/* ThemeREX Addons ------------------------------------------------------------------------------------ */ @import "../../../../css/_mixins.scss"; @import "../../../../css/_theme-vars.scss"; @import "../../css/_skin-vars.scss"; /* Common rules --------------------------------------------- */ /* User styles ------------------------------------------ */ .trx_addons_accent, .trx_addons_accent > a, .trx_addons_accent > * { color: var(--theme-color-text_link); } .trx_addons_accent > a:hover { color: var(--theme-color-text_dark); } .sidebar .trx_addons_accent, [class*="scheme_"].sidebar .trx_addons_accent, .sidebar .trx_addons_accent > a, [class*="scheme_"].sidebar .trx_addons_accent > a, .sidebar .trx_addons_accent > *, [class*="scheme_"].sidebar .trx_addons_accent > *, .footer_wrap .trx_addons_accent, [class*="scheme_"].footer_wrap .trx_addons_accent, .footer_wrap .trx_addons_accent > a, [class*="scheme_"].footer_wrap .trx_addons_accent > a, .footer_wrap .trx_addons_accent > *, [class*="scheme_"].footer_wrap .trx_addons_accent > * { color: var(--theme-color-alter_link); } .sidebar .trx_addons_accent > a:hover, [class*="scheme_"].sidebar .trx_addons_accent > a:hover, .footer_wrap .trx_addons_accent > a:hover, [class*="scheme_"].footer_wrap .trx_addons_accent > a:hover { color: var(--theme-color-alter_dark); } .trx_addons_title_with_link { @include font(1.056em, 1.8em); letter-spacing: 0.5px; } .trx_addons_title_with_link, .trx_addons_title_with_link > a { color: var(--theme-color-alter_text) !important; } .trx_addons_title_with_link > a { @include transition(color .3s ease); } .trx_addons_title_with_link > a.underline_anim { padding-bottom: 0.4em; font-weight: 400; text-transform: none; } .trx_addons_title_with_link_2 { @include font(1em, 1.8em); letter-spacing: 0; } .trx_addons_title_with_link_2, .trx_addons_title_with_link_2 > a { color: var(--theme-color-alter_dark) !important; } .trx_addons_title_with_link_2 > a { @include transition(color .3s ease); } .trx_addons_title_with_link_2 > a.underline_anim { padding-bottom: 0.4em; font-weight: 400; text-transform: none; } .trx_addons_alter_text { @include font(21px, 1.5em, 600); letter-spacing: 0; } .trx_addons_alter_text, .trx_addons_alter_text > a { color: var(--theme-color-alter_text); @include transition(color .3s ease); } .trx_addons_alter_text > a:hover, a:hover > .trx_addons_alter_text { color: var(--theme-color-alter_dark); } .trx_addons_alter_text_2 { @include font(19px, 1.5em, 400); letter-spacing: -0.4px; } .trx_addons_alter_text_2, .trx_addons_alter_text_2 > a { color: var(--theme-color-alter_text); @include transition(color .3s ease); } .trx_addons_alter_text_2 > a:hover, a:hover > .trx_addons_alter_text_2 { color: var(--theme-color-alter_dark); } .trx_addons_hover, .trx_addons_hover > * { color: var(--theme-color-text_hover); } .trx_addons_accent_bg { background-color: var(--theme-color-text_dark); color: var(--theme-color-bg_color); } .trx_addons_inverse { color: var(--theme-color-bg_color); background-color: var(--theme-color-text_dark); } .trx_addons_dark, .trx_addons_dark > a { color: var(--theme-color-text_dark); } .trx_addons_dark > a:hover { color: var(--theme-color-text_link); } .trx_addons_inverse, .trx_addons_inverse > a { color: var(--theme-color-bg_color); background-color: var(--theme-color-text_dark); } .trx_addons_inverse > a:hover { color: var(--theme-color-inverse_hover); } .trx_addons_dropcap { float: left; display: block; font-size: 47px; padding: 0; margin: 0.15em 0.4em 0 0; text-align: center; font-weight: 600; @include square(70px); line-height: 66px; @include border-radius(0); } .trx_addons_dropcap_style_1 { color: var(--theme-color-inverse_link); background-color: var(--theme-color-text_link2); } .trx_addons_dropcap_style_2 { background-color: transparent; color: var(--theme-color-text_dark); font-size: 57px; height: 55px; line-height: 48px; margin: 0; text-align: left; width: auto !important; min-width: 55px; padding-right: 5px; overflow: visible; } ul.text_link2[class*="trx_addons_list"] > li:before { color: var(--theme-color-text_link2); } ul[class*="trx_addons_list"] > li:before { color: var(--theme-color-text_link); } ul[class*="trx_addons_list"][class*="_circled"] > li:before { color: var(--theme-color-inverse_link); background-color: var(--theme-color-text_link); } .trx_addons_list_parameters { color: var(--theme-color-text_dark); > li { font-size: 19px; line-height: 24px; font-weight: 500; border: none !important; padding: 0 !important; overflow: hidden; + li { margin-top: 17px !important; } strong { position: relative; width: auto; } strong:last-child { position: absolute; top: 0; right: 0; max-width: 50%; display: inline-block; text-align: right; padding-left: 5px; @include box-sizing(border-box); background-color: var(--theme-color-bg_color); } &:after { display: inline-block; content: ""; border-bottom: 2px dotted #DDD; width: 5000%; } } } /* dot */ ul[class*="trx_addons_list_dot"] { padding-left: 16px; > li { margin: 1px 0; &:first-child { margin-top: 0 !important; } &:last-child { margin-bottom: 0 !important; } &:before { font-size: 28px; left: -16px; top: 1px; } } } /* success */ ul[class*="trx_addons_list_success"] { color: var(--theme-color-text_dark); padding-left: 30px; > li { margin: 10px 0; &:first-child { margin-top: 0 !important; } &:last-child { margin-bottom: 0 !important; } &:before { content: '\e9a2'; font-family: $theme_icons; font-size: 11px; left: -30px; } } } .trx_addons_tooltip { border-color: var(--theme-color-text); color: var(--theme-color-text); display: inline-block; line-height: 1; } [data-tooltip-text]:after { background-color: var(--theme-color-text_link2); color: var(--theme-color-inverse_link); font-size: 18px; line-height: 20px; font-weight: 600; text-transform: uppercase; letter-spacing: 0.2px; padding: 7px 12px; top: -38px; } [data-tooltip-text]:before { border-top-color: var(--theme-color-text_link2); top: -4px; } blockquote.trx_addons_blockquote_style_1, blockquote.trx_addons_blockquote_style_2 { padding: 1.8em 2.55em; &:before { content: '\e9a1'; display: block; font-family: $theme_icons; font-size: 16px; margin: 0 0 8px; } } blockquote.trx_addons_blockquote_style_1 { border-left: 2px solid var(--theme-color-alter_link2); } blockquote.trx_addons_blockquote_style_2 { border-left: 2px solid var(--theme-color-alter_link); } blockquote.trx_addons_blockquote_style_1:before { color: var(--theme-color-alter_link2); } blockquote.trx_addons_blockquote_style_1 { color: var(--theme-color-alter_dark); background-color: var(--theme-color-alter_bg_color); } blockquote.trx_addons_blockquote_style_1 b { color: var(--theme-color-alter_dark); } blockquote.trx_addons_blockquote_style_1 a, blockquote.trx_addons_blockquote_style_1 cite { color: var(--theme-color-alter_link2); &:before { background-color: var(--theme-color-alter_link2); } } blockquote.trx_addons_blockquote_style_1 a:hover { color: var(--theme-color-alter_hover2); } blockquote.trx_addons_blockquote_style_2 { color: var(--theme-color-alter_dark); background-color: var(--theme-color-alter_bg_color); } blockquote.trx_addons_blockquote_style_2:before, blockquote.trx_addons_blockquote_style_2 a, blockquote.trx_addons_blockquote_style_2 cite { color: var(--theme-color-alter_link); } blockquote.trx_addons_blockquote_style_2 cite:before { background-color: var(--theme-color-alter_link); } blockquote.trx_addons_blockquote_style_2 a:hover { color: var(--theme-color-alter_hover); } .trx_addons_hover_mask { background-color: var(--theme-color-extra_bg_color_07); } .trx_addons_hover_title { color: var(--theme-color-extra_dark); } .trx_addons_hover_content { .trx_addons_hover_text { color: var(--theme-color-extra_text); } .trx_addons_hover_icon, .trx_addons_hover_links a { color: var(--theme-color-inverse_link); background-color: var(--theme-color-extra_link); } .trx_addons_hover_icon:hover, .trx_addons_hover_links a:hover { color: var(--theme-color-inverse_hover) !important; background-color: var(--theme-color-extra_hover); } } /* Gradient */ body:not(.ua_ie) .trx_addons_text_gradient { background: var(--theme-color-text_link); background: linear-gradient(0deg, var(--theme-color-text_link), var(--theme-color-text_hover)); } /* Layouts --------------------------------------- */ .menu_side_left .sc_layouts_row_fixed_on { margin-left: 6rem !important; } .menu_side_right .sc_layouts_row_fixed_on { margin-right: 6rem !important;} body.mobile_layout.menu_side_left .sc_layouts_row_fixed_on { margin-left: 0 !important; } body.mobile_layout.menu_side_right .sc_layouts_row_fixed_on { margin-right: 0 !important; } .header_position_under:not(.mobile_layout) .top_panel .wpb_row { background-color: transparent !important; } .top_panel.with_bg_image .sc_layouts_row:not(.sc_layouts_row_fixed_on) { background-color:transparent; } body.body_style_boxed .sc_layouts_row_fixed_on { right: calc( ( 100% - var(--theme-var-page_boxed) ) / 2 ); left: calc( ( 100% - var(--theme-var-page_boxed) ) / 2 ); } /* Stack rows */ .menu_side_right .sc_stack_section_fixed { right: var(--theme-var-menu_side) !important; } .menu_side_left .sc_stack_section_fixed { left: var(--theme-var-menu_side) !important; } /* Grid */ .sidebar .trx_addons_columns_wrap { margin-right: 0; } .sidebar .trx_addons_columns_wrap [class*="trx_addons_column-"] { display:block; width: 100%; padding: 0; } /* CPT */ .post-type-archive-cpt_portfolio .sc_portfolio_default, .post-type-archive-cpt_services .sc_services_default, .post-type-archive-cpt_team .sc_team_default { .trx_addons_columns_wrap:not(.columns_in_single_row) { margin-bottom: -30px; } } /* Tabs */ .widget .trx_addons_tabs { .trx_addons_tabs_titles { margin: -3px -3px 1.2em -3px; li { @include font(12px, 14px, 600); letter-spacing: 0.6px; @include border-radius(0); &, & + li { margin: 3px; } a { display: inline-block; padding: 4px 17px 5px; @include border-radius(0); @include border-box; color: var(--theme-color-inverse_link); background-color: var(--theme-color-bd_color); &:before { display: none; } } } li.ui-state-active a, li a:hover { color: var(--theme-color-inverse_link); background-color: var(--theme-color-text_link); } } [class*="scheme_"].sidebar & .trx_addons_tabs_titles { li a { color: var(--theme-color-alter_text); background-color: var(--theme-color-alter_bd_color); } li.ui-state-active a, li a:hover { color: var(--theme-color-inverse_link); background-color: var(--theme-color-alter_link); } } } /* Posts emotions */ .trx_addons_emotions_item { background-color: var(--theme-color-bg_color); border-color: var(--theme-color-bd_color); color: var(--theme-color-text_light); } .trx_addons_emotions_item:hover { color: var(--theme-color-alter_dark); border-color: var(--theme-color-alter_bd_hover); background-color: var(--theme-color-alter_bg_hover); } .trx_addons_emotions_active { color: var(--theme-color-alter_text); border-color: var(--theme-color-alter_bd_color); background-color: var(--theme-color-alter_bg_color); } .trx_addons_emotions_item_number { color: var(--theme-color-text); } /* Slider ---------------------------------------------- */ /* Pagination */ .sidebar .slider_pagination_pos_bottom > .swiper-pagination, .sidebar .slider_outer_pagination_pos_bottom > .swiper-pagination { bottom: 0.5em; } .sidebar .slider_container .swiper-pagination-bullet, .sidebar .slider_outer .swiper-pagination-bullet { @include square(8px); } .sc_slider_controls.slider_pagination_style_bullets .slider_pagination_bullet, .swiper-pagination-custom .swiper-pagination-button, .slider_container .swiper-pagination-bullet, .slider_outer .swiper-pagination-bullet { @include transition(color .3s ease, border-color .3s ease, background-color .3s ease, opacity .3s ease); } .sc_slider_controls.slider_pagination_style_bullets .slider_pagination_bullet, .slider_container .slider_pagination_wrap .swiper-pagination-bullet, .slider_outer .slider_pagination_wrap .swiper-pagination-bullet, .swiper-pagination-custom .swiper-pagination-button { border-color: var(--theme-color-alter_bd_color); background-color: var(--theme-color-alter_bg_color); } .swiper-pagination-custom .swiper-pagination-button.swiper-pagination-button-active, .sc_slider_controls.slider_pagination_style_bullets .slider_pagination_bullet.swiper-pagination-bullet-active, .sc_slider_controls.slider_pagination_style_bullets .slider_pagination_bullet:hover, .slider_container .slider_pagination_wrap .swiper-pagination-bullet.swiper-pagination-bullet-active, .slider_outer .slider_pagination_wrap .swiper-pagination-bullet.swiper-pagination-bullet-active, .slider_container .slider_pagination_wrap .swiper-pagination-bullet:hover, .slider_outer .slider_pagination_wrap .swiper-pagination-bullet:hover { border-color: var(--theme-color-text_link); background-color: var(--theme-color-text_link); } .slider_container .swiper-pagination-progressbar .swiper-pagination-progressbar-fill, .slider_outer .swiper-pagination-progressbar .swiper-pagination-progressbar-fill { background-color: var(--theme-color-text_link); } .slider_outer > .swiper-pagination-fraction { color: var(--theme-color-text_dark); } .sc_slider_controls.slider_pagination_style_progress .sc_slider_controls_wrap { background-color: var(--theme-color-bd_color); } .sc_slider_controls .slider_progress_bar { background-color: var(--theme-color-text_link); } .sc_item_slider.slider_outer_pagination_pos_bottom .swiper-pagination.swiper-pagination-progressbar { bottom: 0; } /* Controls */ .slider_outer.slider_outer_pagination_pos_left > .swiper-pagination-fraction, .slider_outer.slider_outer_pagination_pos_right > .swiper-pagination-fraction { bottom: 6px; } .sc_slider_controls .slider_controls_wrap > a, .slider_container.slider_controls_side .slider_controls_wrap > a, .slider_outer_controls_outside .slider_controls_wrap > a, .slider_outer_controls_side .slider_controls_wrap > a, .slider_outer_controls_top .slider_controls_wrap > a, .slider_outer_controls_bottom .slider_controls_wrap > a { width: 50px; height: 50px; line-height: 50px; @include border-radius(50%); } .slider_container { .swiper-button-next, .swiper-button-prev { margin-top: -25px; } } .slider_container.slider_controls_side:hover .slider_controls_wrap > a, .slider_outer_controls_side:hover .slider_controls_wrap > a { &.slider_prev { margin-left: 30px; } &.slider_next { margin-right: 30px; } } .slider_container.slider_controls_side, .slider_outer_controls_side { .slider_container.slider_controls_side .slider_controls_wrap > a, .slider_outer_controls_side .slider_controls_wrap > a { opacity: 1 !important; &.slider_prev { margin-left: 25px; left: 0 !important } &.slider_next { margin-right: 25px; right: 0 !important; } } } .sc_blogger .slider_outer.slider_outer_pagination_pos_bottom_outside .swiper-pagination-bullets { margin-top: 2.7em; } .sc_blogger .sc_item_slider.slider_outer_pagination_pos_bottom .swiper-pagination.swiper-pagination-bullets { bottom: 0.8em; } .sc_item_slider.slider_outer_pagination_pos_bottom { .slider_outer_pagination_pos_bottom .swiper-pagination { bottom: 1em !important; } } .sc_slider_controls .slider_controls_wrap > a, .slider_container.slider_controls_side .slider_controls_wrap > a, .slider_outer_controls_side .slider_controls_wrap > a, .slider_outer_controls_outside .slider_controls_wrap > a { color: var(--theme-color-text_dark); background-color: var(--theme-color-alter_bg_color); border-color: var(--theme-color-alter_bg_color); } .sc_slider_controls .slider_controls_wrap > a:hover, .slider_container.slider_controls_side .slider_controls_wrap > a:hover, .slider_outer_controls_side .slider_controls_wrap > a:hover, .slider_outer_controls_outside .slider_controls_wrap > a:hover { color: var(--theme-color-text_link); background-color: var(--theme-color-alter_bg_color); border-color: var(--theme-color-alter_bg_color); } .slider_container.slider_controls_top .slider_controls_wrap > a, .slider_container.slider_controls_bottom .slider_controls_wrap > a, .slider_outer_controls_top .slider_controls_wrap > a, .slider_outer_controls_bottom .slider_controls_wrap > a { color: var(--theme-color-text_dark); background-color: var(--theme-color-alter_bg_color); border-color: var(--theme-color-alter_bg_color); } .slider_container.slider_controls_top .slider_controls_wrap > a:hover, .slider_container.slider_controls_bottom .slider_controls_wrap > a:hover, .slider_outer_controls_top .slider_controls_wrap > a:hover, .slider_outer_controls_bottom .slider_controls_wrap > a:hover { color: var(--theme-color-text_link); background-color: var(--theme-color-alter_bg_color); border-color: var(--theme-color-alter_bg_color); } .slider_style_modern .slider_controls_label { color: var(--theme-color-bg_color); } .slider_style_modern .slider_pagination_wrap { color: var(--theme-color-text_light); } .slider_style_modern .swiper-pagination-current { color: var(--theme-color-text_dark); } /* Icons in controls */ .sc_slider_controls .slider_controls_wrap > a:before, .slider_container.slider_controls_side .slider_controls_wrap > a:before, .slider_outer_controls_side .slider_controls_wrap > a:before, .slider_outer_controls_outside .slider_controls_wrap > a:before, .slider_outer_controls_top .slider_controls_wrap > a:before, .slider_outer_controls_bottom .slider_controls_wrap > a:before { font-family: $theme_icons; font-size: 18px; } .sc_slider_controls .slider_controls_wrap > .slider_prev:before, .slider_container.slider_controls_side .slider_controls_wrap > .slider_prev:before, .slider_outer_controls_side .slider_controls_wrap > .slider_prev:before, .slider_outer_controls_outside .slider_controls_wrap > .slider_prev:before, .slider_outer_controls_top .slider_controls_wrap > .slider_prev:before, .slider_outer_controls_bottom .slider_controls_wrap > .slider_prev:before { content: '\e907'; } .sc_slider_controls .slider_controls_wrap > .slider_next:before, .slider_container.slider_controls_side .slider_controls_wrap > .slider_next:before, .slider_outer_controls_side .slider_controls_wrap > .slider_next:before, .slider_outer_controls_outside .slider_controls_wrap > .slider_next:before, .slider_outer_controls_top .slider_controls_wrap > .slider_next:before, .slider_outer_controls_bottom .slider_controls_wrap > .slider_next:before { content: '\e908'; } .slider_elastistack_outer.slider_outer_controls > .slider_controls_wrap > .slider_next:before, .slider_elastistack.slider_controls > .slider_controls_wrap > .slider_next:before { content: '\e929'; } .widget_slider.widget ul > li .slide_info a:first-child:before { display: none; } /* Slide info */ .slider_container .slide_info, .slider_container .slide_content { padding: 0 2em; line-height: inherit; } .slider_container.slider_multi .slide_title, .slider_container .slide_info:not(.slide_info_large) .slide_title { @include font(1.333em, 1.3em, 500); } .slider_container .slide_info .slide_cats, .slider_container .slide_content .slide_cats { @include font(16px, 1.5em, 400, normal); letter-spacing: 0; } .slider_container .slide_overlay { background: rgba(0,0,0, .3); } .slider_container .slider-slide:hover .slide_overlay { background: rgba(0,0,0, .4); } /* Type Text */ .slider_outer_overflow_hidden .slider_container.slider_type_text[data-slides-per-view="1"][class*="-fade"] .slider-slide { &:not(.swiper-slide-active) { opacity: 0 !important; } @include flex-justify-content(start); } /* Type Images */ .slider_type_images.slider_container .slide_overlay { display: none; } .slider_type_images.slider_container.slider_multi:not(.slider_type_text) .slide_title, .slider_type_images.slider_container.slider_multi:not(.slider_type_text) .slide_title a, .slider_type_images.slider_container:not(.slider_type_text) .slide_info:not(.slide_info_large) .slide_title, .slider_type_images.slider_container:not(.slider_type_text) .slide_info:not(.slide_info_large) .slide_title a { color: var(--theme-color-text_dark); } .slider_type_images.slider_container.slider_multi:not(.slider_type_text) .slide_date, .slider_type_images.slider_container.slider_multi:not(.slider_type_text) .slide_cats, .slider_type_images.slider_container.slider_multi:not(.slider_type_text) .slide_cats a, .slider_type_images.slider_container:not(.slider_type_text) .slide_info:not(.slide_info_large) .slide_date, .slider_type_images.slider_container:not(.slider_type_text) .slide_info:not(.slide_info_large) .slide_cats, .slider_type_images.slider_container:not(.slider_type_text) .slide_info:not(.slide_info_large) .slide_cats a { color: var(--theme-color-text); } .slider_type_images.slider_container.slider_titles_lb .slider-slide:not(.with_content) .slide_info_small, .slider_type_images.slider_container.slider_titles_rb .slider-slide:not(.with_content) .slide_info_small, .slider_type_images.slider_container.slider_titles_bottom .slider-slide:not(.with_content) .slide_info_small, .slider_type_images.slider_container.slider_titles_lb .slide_content, .slider_type_images.slider_container.slider_titles_rb .slide_content, .slider_type_images.slider_container.slider_titles_bottom .slide_content { margin-top: 10px; margin-bottom: 0; padding: 0; } .slider_type_images.slider_container:not(.slider_type_text) .slide_info_small, .slider_type_images.slider_container.slider_multi:not(.slider_type_text) .slide_info_small { text-shadow: none; } .slider_type_images.slider_container .slide_info.slide_info_large { padding: 0; } .slider_type_images.slider_container.slider_titles_rb .slide_info_large, .slider_type_images.slider_container.slider_titles_lb .slide_info_large { max-width: none; } .slider_type_images.slider_container.slider_titles_rb .slide_info_large { padding-left: 5%; } .slider_type_images.slider_container.slider_titles_lb .slide_info_large { padding-right: 5%; } /* Type bg */ .slider_type_bg.slider_container.slider_titles_center .trx_addons_video_player.with_cover.hover_play + .slide_info, .slider_type_bg.slider_container.slider_titles_center .trx_addons_video_player.with_cover.hover_play:hover + .slide_info { @include transform(translateY(5em)); } .slider_type_bg.slider_container.slider_titles_center .trx_addons_video_player.with_cover.hover_play ~ .slide_content { @include transform(translateY(5em)); } .slider_container.slider_titles_center .trx_addons_video_player.with_cover.hover_play + .slide_info, .slider_container.slider_titles_center .trx_addons_video_player.with_cover.hover_play:hover + .slide_info { @include transform(none); } .slider_container.slider_titles_outside .trx_addons_video_player.with_cover.hover_play ~ .slide_link, .slider_container.slider_titles_center .trx_addons_video_player.with_cover.hover_play ~ .slide_link { z-index: 0; } .slider_container.slider_titles_outside .trx_addons_video_player.with_cover.hover_play ~ .slide_content { @include transform(translateY(4em)); text-shadow: 1px 1px #000; } /* Info Large */ .slider_container .slide_info.slide_info_large { padding: 1.5em; background-color: var(--theme-color-bg_color_09); } .slider_container .slide_info.slide_info_large:hover { background-color: var(--theme-color-bg_color); } .slider_container.slider_titles_center .slide_info:not(.slide_info_large), .slider_container.slider_titles_center .slide_content { width: 100%; padding: 0 5%; } .slider_container .slide_info.slide_info_large .slide_title { margin: 0.3em 0; @include font(1.4em, 1.3em, 500); text-transform: none; } .slider_container.slider_type_bg .slide_info.slide_info_large .slide_title, .slider_container.slider_type_images .slide_info.slide_info_large .slide_title, .slider_container.slider_type_bg .slide_info.slide_info_large .slide_title a, .slider_container.slider_type_images .slide_info.slide_info_large .slide_title a, .slider_container.slider_type_bg .slide_info.slide_info_large:hover .slide_date, .slider_container.slider_type_images .slide_info.slide_info_large:hover .slide_date, .slider_container.slider_type_bg .slide_info.slide_info_large:hover .slide_cats, .slider_container.slider_type_images .slide_info.slide_info_large:hover .slide_cats, .slider_container.slider_type_bg .slide_info.slide_info_large:hover .slide_cats a, .slider_container.slider_type_images .slide_info.slide_info_large:hover .slide_cats a { color: var(--theme-color-text_dark); } .slider_container .slide_info.slide_info_large .slide_cats { color: var(--theme-color-text); } .slider_container .slide_info.slide_info_large .slide_cats a { color: var(--theme-color-text); @include font(16px, 1.5em, 400); text-transform: none; } .slider_container .slide_info.slide_info_large .slide_title a { color: var(--theme-color-text_dark); } .slider_container .slide_info.slide_info_large .slide_date { color: var(--theme-color-text_dark); } .slider_container .slide_info.slide_info_large:hover .slide_date { color: var(--theme-color-text_dark); } .slider_container .slide_info.slide_info_large .slide_cats a:hover, .slider_container .slide_info.slide_info_large .slide_title a:hover { color: var(--theme-color-text_dark); } .slider_container.slider_multi .slide_cats a:hover, .slider_container.slider_multi .slide_title a:hover, .slider_container.slider_multi a:hover .slide_title { color: var(--theme-color-text_dark); } .slider_titles_outside_wrap .slide_title { @include font(1.333em, 1.3em); + .slide_cats, + .slide_subtitle { margin-top: 6px; } } .slider_titles_outside_wrap .slide_title a { color: var(--theme-color-text_dark); } .slider_titles_outside_wrap .slide_title a:hover { color: var(--theme-color-text_dark); } .slider_titles_outside_wrap .slide_cats, .slider_titles_outside_wrap .slide_subtitle { color: var(--theme-color-text); @include font(16px, 1.5em, 400, normal); letter-spacing: 0; text-transform: none; } .slider_titles_outside_wrap .slide_cats a, .slider_titles_outside_wrap .slide_subtitle a { color: var(--theme-color-text); } .slider_titles_outside_wrap .slide_cats a:hover, .slider_titles_outside_wrap .slide_subtitle a:hover { color: var(--theme-color-text_dark); } // Titles -> Outside Top .slider_outer.slider_outer_titles_outside_top { padding-top: 9em; .slider_titles_outside_wrap { top: 2em; padding: 0 70px; max-height: 100%; } .slide_info { position: relative; text-align: left; padding-right: 60px; .slide_cats { @include font(14px, 18px, 700); text-transform: uppercase; letter-spacing: 1.4px; margin-bottom: 5px; color: var(--theme-color-text_dark); a { color: var(--theme-color-text_dark); &:hover { color: var(--theme-color-text); } } } .slide_number { @include transform(none); color: var(--theme-color-text_light); top: auto; bottom: 0; right: 0; } .slide_title { overflow: hidden; display: -webkit-box; -webkit-line-clamp: 1; -webkit-box-orient: vertical; } .slide_title, .slide_number { @include font(var(--theme-font-h1_font-size), 1.2em, var(--theme-font-h1_font-weight)); padding-bottom: 5px; } } } /* Slider in the widgets area */ .header_widgets_wrap .slider_container .slide_overlay.slide_overlay_large { background-color: transparent; } .header_widgets_wrap .slider_container.slider_titles_center:not(.slider_multi) .slide_info.slide_info_large { width: 18em; } .sidebar .slider_container.slider_multi .slide_info:not(.slide_info_large), .sidebar .slider_container .slide_info:not(.slide_info_large), .footer_wrap .slider_container.slider_multi .slide_info:not(.slide_info_large), .footer_wrap .slider_container .slide_info:not(.slide_info_large) { bottom: 8px; } .sidebar .slider_container.slider_multi .slide_title, .sidebar .slider_container .slide_info:not(.slide_info_large) .slide_title, .footer_wrap .slider_container.slider_multi .slide_title, .footer_wrap .slider_container .slide_info:not(.slide_info_large) .slide_title { @include font(1.2em, 1.2em); margin-bottom: 6px; } .sidebar .slider_container.slider_multi .slide_date, .sidebar .slider_container .slide_info:not(.slide_info_large) .slide_date, .footer_wrap .slider_container.slider_multi .slide_date, .footer_wrap .slider_container .slide_info:not(.slide_info_large) .slide_date { @include font(12px, 16px); } /* titles horizontal */ .sc_slider_controller_horizontal[data-controls="1"] { padding-left: 60px; padding-right: 57px; .sc_slider_controller_info { width: 83%; } } .sc_slider_controller_horizontal .slider_outer_controls_side .slider_controls_wrap > a { width: 60px; &.slider_prev { left: -60px; &:before { content: '\e939'; font-size: 28px; } } &.slider_next { right: -57px; &:before { content: '\e93a'; font-size: 28px; } } } .sc_slider_controller_titles .slider-slide { background-color: var(--theme-color-alter_bg_color); &:hover { background-color: var(--theme-color-alter_bg_color); } } .sc_slider_controller_titles .slider-slide:after { background-color: var(--theme-color-alter_bd_color); } .sc_slider_controller_titles .slider-slide.swiper-slide-active { background-color: var(--theme-color-bg_color); &:after { background-color: var(--theme-color-text_dark); } } .sc_slider_controller_titles .slider-slide:before { width: 1px; background-color: var(--theme-color-alter_bd_color); } .sc_slider_controller_titles { padding-top: 12px; } .sc_slider_controller_titles .slider_outer_controls_side .slider_controls_wrap > a { top: 12px; } .sc_slider_controller_titles .swiper-slide { margin-top: 12px; } .sc_slider_controller_titles .swiper-slide.swiper-slide-active { margin-top: 0; margin-bottom: -12px; } .sc_slider_controller_titles .sc_slider_controller_info { text-transform: uppercase; font-size: 24px; font-weight: 600; .sc_slider_controller_info_number { color: var(--theme-color-text_dark); &:after { content: '.'; } } .sc_slider_controller_info_title { color: var(--theme-color-text_dark); } .slider-slide::before { content: ' '; position: absolute; z-index: 1; top: 0; right: 0; bottom: 0; left: auto; width: 1px; background-color: #ddd; } } /* titles vertical */ .sc_slider_controller_vertical.sc_slider_controller_titles { .swiper-slide, .swiper-slide.swiper-slide-active { margin-top: 0; margin-bottom: 0; } } /* Slider controller */ .sc_slider_controller .slider_container.slider_controls_side:hover .slider_controls_wrap > a.slider_prev, .sc_slider_controller .slider_outer_controls_side:hover .slider_controls_wrap > a.slider_prev { margin-left: 0; } .sc_slider_controller .slider_container.slider_controls_side:hover .slider_controls_wrap > a.slider_next, .sc_slider_controller .slider_outer_controls_side:hover .slider_controls_wrap > a.slider_next { margin-right: 0; } .sc_slider_controller .slider-slide.swiper-slide-active:after { background-color: var(--theme-color-text_dark); } .sc_slider_controller_titles .slider_controls_wrap > a { color: var(--theme-color-inverse_link); background-color: var(--theme-color-text_link); } .sc_slider_controller_titles .slider_controls_wrap > a:hover { color: var(--theme-color-bg_color); background-color: var(--theme-color-text_dark); } .slider_outer_wrap .sc_slider_controller .slider-slide { padding: 1em 1em 1em 2em; } .slider_outer_wrap .sc_slider_controller .sc_slider_controller_item_info_date { color: var(--theme-color-text_light); } .slider_outer_wrap .sc_slider_controller .slider-slide.swiper-slide-active { background-color: var(--theme-color-alter_bg_hover); } .slider_outer_wrap .sc_slider_controller .slider-slide.swiper-slide-active .sc_slider_controller_item_info_date { color: var(--theme-color-alter_light); } .slider_outer_wrap .sc_slider_controller .slider-slide.swiper-slide-active .sc_slider_controller_item_info_title { color: var(--theme-color-alter_dark); } .slider_outer_wrap .sc_slider_controller .sc_slider_controller_item_image + .sc_slider_controller_item_info, .slider_outer_wrap .sc_slider_controller .sc_slider_controller_item_image ~ .sc_slider_controller_item_info { padding-left: 1.5em; overflow: hidden } .slider_outer_wrap .sc_slider_controller .slider-slide { .sc_slider_controller_item_info_cats { @include font(16px, 1.5em, 400, normal); letter-spacing: 0; a { color: var(--theme-color-alter_text); &:hover { color: var(--theme-color-alter_text); } } } &.swiper-slide-active .sc_slider_controller_item_info_cats a { color: var(--theme-color-alter_dark); &:hover { color: var(--theme-color-alter_dark); } } } .slider_outer_wrap .sc_slider_controller .slider-slide { .sc_slider_controller_item_info_date { font-weight: 400; color: var(--theme-color-alter_text); } &.swiper-slide-active .sc_slider_controller_item_info_date { color: var(--theme-color-alter_dark); } } .slider_outer_wrap .sc_slider_controller .sc_slider_controller_item_info_title { @include font(1.1em, 1.2em); } .slider_outer_wrap .sc_slider_controller .sc_slider_controller_item_info_cats + .sc_slider_controller_item_info_title { margin-top: 3px; } .slider_outer_wrap .sc_slider_controller .sc_slider_controller_item_info_title + .sc_slider_controller_item_info_date { margin-top: 5px; } .slider_outer_wrap.slider_outer_wrap_controller_pos_bottom .sc_slider_controller_horizontal { padding-top: 0; .slider-slide.swiper-slide-active:after { background-color: var(--theme-color-alter_link); } } /* Slider controls - Title */ .slider_pagination_style_title .slider_pagination_wrap { height: auto !important; } .slider_pagination_style_title .slider_pagination_wrap .slider_pagination_bullet { width: 100%; height: auto; font-size: 47px; font-weight: 600; line-height: 1.3em; letter-spacing: -0.5px; text-transform: uppercase; @include border-radius(0); background: none !important; opacity: 1 !important; border: none !important; margin: 0 !important; color: var(--theme-color-text_light); cursor: pointer; + .slider_pagination_bullet { margin-top: 10px !important; } &:after { display: none !important; } &.slider_pagination_bullet_active { color: var(--theme-color-text_dark); } } /* Light */ .slider_pagination_style_title.sc_slider_controls_light .slider_pagination_wrap .slider_pagination_bullet { width: 100%; height: auto; font-size: 19px; font-weight: 400; line-height: 1.3em; letter-spacing: 0; text-transform: none; @include border-radius(0); background: none !important; opacity: 1 !important; border: none !important; margin: 0 !important; color: var(--theme-color-alter_text); cursor: pointer; text-align: left; padding: 0 0 0 20px; position: relative; + .slider_pagination_bullet { margin-top: 22px !important; } &:before { font-size: 7px; left: 0; top: 0; display: inline-block; position: absolute; color: var(--theme-color-alter_text); content: '\e814'; font-family:$theme_icons; font-weight: 400; } &:after { display: none !important; } &.slider_pagination_bullet_active { color: var(--theme-color-text_dark); &:before { color: var(--theme-color-text_link2); } } } /* Widgets ---------------------------------------------- */ /* Widgets in the Footer */ .footer_wrap .sc_layouts_row { line-height: 1.66em; } .footer_wrap .sc_layouts_row_type_compact { font-size: 17px; } .footer_wrap .sc_layouts_row .sc_layouts_item, .footer_wrap .sc_layouts_row .widget { vertical-align: top; margin-top: 0.5em !important; margin-bottom: 0.5em !important; } .footer_wrap .sc_layouts_item.elementor-widget-divider, .footer_wrap .sc_layouts_item.elementor-widget-spacer, .footer_wrap .sc_layouts_item .widget { margin-top: 0 !important; margin-bottom: 0 !important; } /* Categories list */ .widget_categories_list .categories_list_style_1 .categories_list_icon { color: var(--theme-color-text_dark); } .widget_categories_list .categories_list_style_1 .categories_list_item:hover .categories_list_icon { color: var(--theme-color-text_link); } .widget_categories_list .categories_list_style_1 .categories_list_item:hover .categories_list_title { color: var(--theme-color-text_link); } .widget_categories_list .categories_list_style_2 .categories_list_title { color: var(--theme-color-alter_dark); background-color: var(--theme-color-alter_bg_color_07); } .widget_categories_list .categories_list_style_2 .categories_list_item:hover .categories_list_title { color: var(--theme-color-alter_link); background-color: var(--theme-color-alter_bg_hover); } .widget_categories_list .categories_list_style_3 .categories_list_item { background-color: var(--theme-color-alter_bg_color); } .widget_categories_list .categories_list_style_3 .categories_list_item:hover .categories_list_title, .widget_categories_list .categories_list_style_3 .categories_list_item:hover .categories_list_icon { color: var(--theme-color-text_link); } /* Widget Categories list in columns or sidebar */ .widget_categories_list[class*="column-"] [class*="column-"], .sidebar .widget_categories_list [class*="column-"] { width:100%; float:none; overflow:hidden; } .widget_categories_list[class*="column-"] [class*="column-"]+[class*="column-"], .sidebar .widget_categories_list [class*="column-"]+[class*="column-"] { margin-top:0.5em; } .widget_categories_list[class*="column-"] .categories_list_style_1 .categories_list_item, .sidebar .widget_categories_list .categories_list_style_1 .categories_list_item { text-align:left; } .widget_categories_list[class*="column-"] .categories_list_style_1 .categories_list_image { display:inline-block; width: 20%; } .sidebar .widget_categories_list .categories_list_style_1 .categories_list_image { display:inline-block; width: 32px; vertical-align:middle; } .widget_categories_list[class*="column-"] .categories_list_style_1 .categories_list_image img, .sidebar .widget_categories_list .categories_list_style_1 .categories_list_image img { @include box(100%, auto); } .widget_categories_list[class*="column-"] .categories_list_style_1 .categories_list_title, .sidebar .widget_categories_list .categories_list_style_1 .categories_list_title { display:inline-block; vertical-align:middle; width: 70%; margin: 0; font-size:1em; text-align:left; text-transform:none; @include border-box; } .widget_categories_list[class*="column-"] .categories_list_style_1 .categories_list_image + .categories_list_title, .sidebar .widget_categories_list .categories_list_style_1 .categories_list_image + .categories_list_title { padding-left: 1em; } /* Contacts */ .widget_contacts .contacts_socials { margin-bottom: -5px; .social_item { margin: 0 5px 5px 0; } } .widget_contacts .contacts_info { @include font(17px, 1.7em); span, > div > a, > a { padding-left: 2.3em; } .contacts_left > * { padding-right: 2.3em; } .contacts_left > :before { text-align: center; } span + span, span + a { margin-top: 1.5em; } span:before, > div > a:before, > a::before { font-family: $theme_icons; font-size: 1.4em; width: 1.2em; text-align: center; } span.contacts_address:before { content: '\E9D2'; } span.contacts_email:before { content: '\E9FC'; } span.contacts_phone:before, a.contacts_phone:before { content: '\E9CF'; } .contacts_left, .contacts_right { white-space: normal; .contacts_email, .contacts_phone { white-space: nowrap; } } } .footer_wrap .widget_contacts .contacts_description, .footer_wrap .widget_contacts .contacts_content { margin-left: auto; margin-right: auto; } .footer_wrap .columns_wrap .widget_contacts .contacts_description, .footer_wrap .columns_wrap .widget_contacts .contacts_content { max-width:none; } .widget_contacts .contacts_info { color: var(--theme-color-text); } .widget_contacts .contacts_info span:before, .widget_contacts .contacts_info > div > a:before, .widget_contacts .contacts_info > a:before { color: var(--theme-color-text_link2); } .widget_contacts .contacts_info span a, .widget_contacts .contacts_info > div > a, .widget_contacts .contacts_info > a { color: var(--theme-color-text); } .widget_contacts .contacts_info span a:hover, .widget_contacts .contacts_info > div > a:hover, .widget_contacts .contacts_info > a:hover { color: var(--theme-color-text_dark); } [class*="scheme_"].sidebar .widget_contacts .contacts_info, [class*="scheme_"].footer_wrap .widget_contacts .contacts_info { color: var(--theme-color-alter_text); } [class*="scheme_"].sidebar .widget_contacts .contacts_info span:before, [class*="scheme_"].sidebar .widget_contacts .contacts_info > div > a:before, [class*="scheme_"].sidebar .widget_contacts .contacts_info > a:before, [class*="scheme_"].footer_wrap .widget_contacts .contacts_info span:before, [class*="scheme_"].footer_wrap .widget_contacts .contacts_info > div > a:before, [class*="scheme_"].footer_wrap .widget_contacts .contacts_info > a:before { color: var(--theme-color-alter_link2); } [class*="scheme_"].sidebar .widget_contacts .contacts_info span a, [class*="scheme_"].sidebar .widget_contacts .contacts_info > div > a, [class*="scheme_"].sidebar .widget_contacts .contacts_info > a, [class*="scheme_"].footer_wrap .widget_contacts .contacts_info span a, [class*="scheme_"].footer_wrap .widget_contacts .contacts_info > div > a, [class*="scheme_"].footer_wrap .widget_contacts .contacts_info > a { color: var(--theme-color-alter_text); } [class*="scheme_"].sidebar .widget_contacts .contacts_info span a:hover, [class*="scheme_"].sidebar .widget_contacts .contacts_info > div > a:hover, [class*="scheme_"].sidebar .widget_contacts .contacts_info > a:hover, [class*="scheme_"].footer_wrap .widget_contacts .contacts_info span a:hover, [class*="scheme_"].footer_wrap .widget_contacts .contacts_info > div > a:hover, [class*="scheme_"].footer_wrap .widget_contacts .contacts_info > a:hover { color: var(--theme-color-alter_dark); } .footer_wrap [class*="scheme_"].sc_layouts_row.sc_layouts_row_type_compact { .sc_layouts_item a:not(.sc_button):not([class*="button"]) { color: var(--theme-color-text); &:hover { color: var(--theme-color-text_dark); } } .sc_layouts_item .product_list_widget { a:not(.sc_button):not([class*="button"]) { color: var(--theme-color-text_dark); &:hover { color: var(--theme-color-text_link); } } span.price, span.amount { color: var(--theme-color-text_dark); } } .trx_addons_alter_text a { color: var(--theme-color-text_dark) !important; } } /* footer narrow row */ .footer_wrap .sc_layouts_row_type_narrow { font-size: 17px; .sc_layouts_item_icon + .sc_layouts_item_details { margin-left: 0.4em; } .sc_layouts_item_details_line1, .sc_layouts_item_details_line2, .sc_layouts_item_icon { color: var(--theme-color-text_dark); } } /* footer compact row */ .footer_wrap .sc_layouts_row_type_compact { .sc_socials.sc_socials_default { .socials_wrap .social_item .social_icon { position: relative; display: block; overflow: hidden; @include box(45px, 45px, 42px); font-size: 16px; text-align: center; border: 1px solid var(--theme-color-text_dark_015); } &[class*="modern"] .socials_wrap .social_item .social_icon { @include box(45px, 45px, 44px); } } .sc_socials.sc_socials_default .socials_wrap { margin-bottom: -5px; } .sc_socials.sc_socials_default .socials_wrap .social_item { margin: 0 5px 5px 0; } } /* widget custom links */ .widget_custom_links { ul > li a:first-child:before { display: none; } ul.custom_links_list .custom_links_list_item + .custom_links_list_item { margin-top: 14px !important; } ul > li.custom_links_list_item { @include flex; @include flex-direction(column); @include flex-justify-content(flex-start); @include flex-align-items(flex-start); .custom_links_list_item_link { margin: 0; padding: 0; @include transition-all(0.3s); color: var(--theme-color-text_dark); &:hover { color: var(--theme-color-text_dark); } } &:hover .custom_links_list_item_link { margin-left: 9px; } .custom_links_list_item_title { padding: 0; position: relative; display: inline-block; line-height: 1.2em; font-size: 17px; &:after { content: ""; display: block; position: relative; z-index: 1; top: auto; bottom: -5px; left: 0; -webkit-transform: none; -ms-transform: none; transform: none; width: 0; height: 1px; @include transition-all(0.3s); background-color: var(--theme-color-text_dark); } } &:hover .custom_links_list_item_title:after { width: 100%; } .custom_links_list_item_label { color: var(--theme-color-inverse_hover); border-color: var(--theme-color-text_dark); background-color: var(--theme-color-text_dark); } .custom_links_list_item_description { margin-top: 5px; font-style: normal; } .custom_links_list_item_button { padding: 0 1.5em 0 0; @include font(16px, 21px); color: var(--theme-color-text_dark); &:focus, &:hover { color: var(--theme-color-text_dark) !important; } &:before, &:after { font-size: 9px; } } } } .footer_wrap .sc_layouts_row_type_compact { .underline_anim { display: inline; padding: 0; padding-bottom: 6px; 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_on .8s cubic-bezier(0.25, 0.8, 0.25, 1) both; } .underline_anim.underline_do_hover:hover { animation: underline_hover_off .8s cubic-bezier(0.25, 0.8, 0.25, 1) both; } } @-webkit-keyframes underline_hover_on { 0% { -webkit-background-size: 0 1px; background-size: 0 1px; } 100% { -webkit-background-size: 100% 1px; background-size: 100% 1px; } } @keyframes underline_hover_on { 0% { -webkit-background-size: 0 1px; background-size: 0 1px; } 100% { -webkit-background-size: 100% 1px; background-size: 100% 1px; } } @-webkit-keyframes underline_hover_off { 0% { -webkit-background-size: 100% 1px; background-size: 100% 1px; } 100% { -webkit-background-size: 0 1px; background-size: 0 1px; } } @keyframes underline_hover_off { 0% { -webkit-background-size: 100% 1px; background-size: 100% 1px; } 100% { -webkit-background-size: 0 1px; background-size: 0 1px; } } /* Icons + names Socials in footer */ .footer_wrap .sc_layouts_row_type_compact { .sc_socials.sc_socials_icons_names .socials_wrap .social_item + .social_item { margin-top: 10px; } .sc_socials.sc_socials_icons_names .socials_wrap .social_item .social_icon { font-size: 16px; width: 2em; height: 2em; line-height: 2em; margin-left: -0.5em; color: var(--theme-color-text); + .social_name { display: inline-block; vertical-align: middle; margin: 0 0 0 6px; font-size: 17px; line-height: 20px; font-weight: 400; color: var(--theme-color-text); } } .sc_socials.sc_socials_icons_names .socials_wrap .social_item:hover .social_name, .sc_socials.sc_socials_icons_names .socials_wrap .social_item:hover .social_icon { color: var(--theme-color-text_dark); } } /* Names Socials in footer */ .footer_wrap .sc_layouts_row_type_normal { .sc_socials.sc_socials_names:not(.alter) .socials_wrap .social_item { margin-right: 43px; font-size: 21px; font-weight: 400; color: var(--theme-color-text_dark); &:hover { color: var(--theme-color-text); } } } .footer_wrap .sc_layouts_row_type_compact { .sc_socials.sc_socials_names:not(.alter) .socials_wrap .social_item + .social_item { margin-top: 10px; } .sc_socials.sc_socials_names:not(.alter) .socials_wrap .social_item { display: inline-block; width: 100%; text-align: inherit; } .sc_socials.sc_socials_names.sc_align_left:not(.alter) .socials_wrap .social_item { display: table; width: auto; } .sc_socials.sc_socials_names:not(.alter) .socials_wrap .social_item .social_icon { font-size: 16px; width: 2em; height: 2em; line-height: 2em; margin-left: -0.5em; color: var(--theme-color-text); + .social_name { display: inline-block; vertical-align: middle; margin: 0 0 0 6px; font-size: 17px; line-height: 20px; font-weight: 400; color: var(--theme-color-text); } } .sc_socials.sc_socials_names:not(.alter) .socials_wrap .social_item:hover .social_name, .sc_socials.sc_socials_names:not(.alter) .socials_wrap .social_item:hover .social_icon { color: var(--theme-color-text_dark); } } /* Only Name Socials */ .sc_socials.sc_socials_names { .socials_wrap .social_item { color: var(--theme-color-text_dark); &:hover { color: var(--theme-color-text_link); } .social_name { text-transform: uppercase; font-weight: 500; letter-spacing: 0.5px; } } } /* Modern Socials */ .sc_socials.sc_socials_default.modern_2 .socials_wrap, .sc_socials.sc_socials_default.modern .socials_wrap { margin-bottom: -8px; .social_item { margin: 0 8px 8px 0; .social_icon { position: relative; display: block; overflow: hidden; width: 45px; height: 45px; line-height: 44px; font-size: 16px; text-align: center; border: none !important; background-color:var(--theme-color-alter_bg_color); color:var(--theme-color-text_dark); } &:hover .social_icon { background-color:var(--theme-color-alter_bg_color); color:var(--theme-color-text_link); } } } .sc_socials.sc_socials_default.modern_2 .socials_wrap .social_item { .social_icon { background-color: #2C313D; color: var(--theme-color-inverse_link); } &:hover .social_icon { color: var(--theme-color-inverse_link) !important; background-color: var(--theme-color-text_link); &[class*="facebook"] { background-color: #3b5998 !important; color: var(--theme-color-inverse_link) !important; } &[class*="twitter"] { background-color: #1da1f2 !important; color: var(--theme-color-inverse_link) !important; } &[class*="dribble"], &[class*="dribbble"] { background-color: #ea4c89 !important; color: var(--theme-color-inverse_link) !important; } &[class*="instagram"] { background-color: #C862DC !important; color: var(--theme-color-inverse_link) !important; } &[class*="youtube"] { background-color: #FF0000 !important; color: var(--theme-color-inverse_link) !important; } &[class*="deviantart"] { background-color: #00E59B !important; color: var(--theme-color-inverse_link) !important; } &[class*="discord"] { background-color: #5562EA !important; color: var(--theme-color-inverse_link) !important; } } } /* Alter Socials */ .sc_socials.sc_socials_icons_names.alter .socials_wrap { @include flex; flex-direction: row; align-items: center; justify-content: space-around; .social_item { margin: 0 !important; padding: 28px 10px; width: 100%; line-height: 1; + .social_item { border-left: 1px solid var(--theme-color-bd_color); } .social_name { font-size: 15px; font-weight: 500; line-height: 20px; color: var(--theme-color-text_dark); } .social_icon { width: 1.5em; height: 1.5em; line-height: 1.5em; font-size: 16px; color: var(--theme-color-text_dark); + .social_name { display: inline-block; vertical-align: middle; margin: 0 0 0 5px; } } &:hover .social_name, &:hover .social_icon { color: var(--theme-color-text_dark); } } } /* Extra Socials */ .sc_socials.sc_socials_icons_names.extra { &.sc_align_center .socials_wrap { @include flex-justify-content(center); } &.sc_align_right .socials_wrap { @include flex-justify-content(flex-end); } .socials_wrap { @include flex; @include flex-wrap(wrap); @include flex-justify-content(flex-start); .social_item { padding: 0 1px; @include flex; @include flex-align-items(center); margin-right: 1.3em; color: var(--theme-color-alter_dark); .social_icon { text-align: left; padding: 0 1px; font-size: 16px; @include box(auto, auto, inherit); } .social_icon + .social_name { margin: 0 0 0 8px; @include font(14px, 17px); } &: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; } &[class*="youtube"] { color: #FF0000 !important; } &[class*="deviantart"] { color: #00E59B !important; } &[class*="discord"] { color: #5562EA !important; } } &:hover .social_name { color: var(--theme-color-text_dark); } } } } /* Socials Simple */ .sc_socials.sc_socials_default.simple .socials_wrap { .social_item { margin-right: 18px; .social_icon { padding: 0 1px; @include box(auto, auto, inherit); @include border-radius(0); border: none; text-align: unset; } } } /* Recent News + Shortcode Recent News */ body.expand_content .sc_recent_news_style_news-announce .post_size_full, .sc_layouts_submenu .sc_recent_news_style_news-announce .post_size_full { height: 656px; } body.expand_content .sc_recent_news_style_news-announce .post_size_big, .sc_layouts_submenu .sc_recent_news_style_news-announce .post_size_big { height: 328px; } body.expand_content .sc_recent_news_style_news-announce .post_size_medium, .sc_layouts_submenu .sc_recent_news_style_news-announce .post_size_medium, body.expand_content .sc_recent_news_style_news-announce .post_size_small, .sc_layouts_submenu .sc_recent_news_style_news-announce .post_size_small { height: 164px; } /* Attention! This widget can be placed in the content area and should use main text colors */ .sc_recent_news_header { border-color: var(--theme-color-text_dark); } .sc_recent_news_header_category_item_more { color: var(--theme-color-text_link); } .sc_recent_news_header_more_categories { border-color: var(--theme-color-extra_bd_color); background-color:var(--theme-color-extra_bg_color); } .sc_recent_news_header_more_categories > a { color:var(--theme-color-extra_link); } .sc_recent_news_header_more_categories > a:hover { color:var(--theme-color-extra_hover); background-color:var(--theme-color-extra_bg_hover); } .sc_recent_news_style_news-magazine .post_accented_border { border-color: var(--theme-color-bd_color); } .sc_recent_news_style_news-excerpt .post_item { border-color: var(--theme-color-bd_color); } /* Twitter */ .widget_twitter .widget_content .sc_twitter_item, .widget_twitter .widget_content li { color: var(--theme-color-text); } .widget_twitter .widget_content .sc_twitter_item .sc_twitter_item_icon { color: var(--theme-color-text_link) !important; } .widget_twitter .swiper-pagination-bullet { background-color: var(--theme-color-text_light); } .widget_twitter .swiper-pagination-bullet-active { background-color: var(--theme-color-text_link); } .widget_twitter .widget_content .sc_twitter_list li { color: var(--theme-color-text); } .widget_twitter .widget_content .sc_twitter_list li:before { color: var(--theme-color-text_link) !important; } [class*="scheme_"].sidebar .widget_twitter .widget_content .sc_twitter_list li { color: var(--theme-color-alter_text); } [class*="scheme_"].sidebar .widget_twitter .widget_content .sc_twitter_list li:before { color: var(--theme-color-alter_link) !important; } /* Video player in narrow posts */ .narrow_content .trx_addons_video_list_controller_bottom .trx_addons_video_list_controller_wrap .trx_addons_video_list_controller_item { width: 50%; .trx_addons_video_list_title { @include font(1em); } } /* Video sticky */ .trx_addons_video_sticky { .trx_addons_video_sticky_inner { .trx_addons_video_sticky_title { display: none; } } } .post_featured { .trx_addons_video_sticky_inner { .trx_addons_video_sticky_title { display: none; } } } .trx_addons_video_sticky_on { .trx_addons_video_sticky_inner { right: 90px; width: 618px !important; height: 348px !important; z-index: 21; iframe { width: 618px !important; height: 348px !important; } .trx_addons_video_list_title_wrap { background-color: var(--theme-color-alter_bg_color); .trx_addons_video_list_title, .trx_addons_video_list_title a, .trx_addons_video_list_title a:hover { color: var(--theme-color-alter_dark); } } .post_video.video_frame { height: 100%; .mejs-container { width: 100% !important; height: 100% !important; .mejs-overlay.mejs-overlay-play { width: 100% !important; height: 100% !important; } iframe, video, embed { width: 100% !important; height: 100% !important; } } } .trx_addons_video_list_title_wrap, .trx_addons_video_sticky_title { display: block; background-color: var(--theme-color-alter_bg_color); bottom: 100%; -webkit-box-sizing: border-box; box-sizing: border-box; margin: 0; padding: 21px 4em 21px 30px; position: absolute; top: -4.1rem; height: auto; width: 100%; display: block; text-align: left; overflow: hidden; white-space: nowrap; text-overflow: ellipsis; } } .trx_addons_video_sticky_close { right: 110px; bottom: 358px; } } .post_featured:not(.post_video_play):not(.with_video_sticky_on) .trx_addons_video_sticky_on .trx_addons_video_sticky_inner { height: 0 !important; } .post_featured:not(.post_video_play):not(.with_video_sticky_on) .trx_addons_video_sticky_on .trx_addons_video_sticky_close { bottom: 12px; } /* Reviews stars */ .trx_addons_reviews_stars_default, .trx_addons_reviews_stars_hover { color: var(--theme-color-text_link); } [class*="scheme_"].sidebar .trx_addons_reviews_stars_default, [class*="scheme_"].sidebar .trx_addons_reviews_stars_hover { color: var(--theme-color-alter_link); } .trx_addons_reviews_bubble { background-color: var(--theme-color-bg_color); } .trx_addons_reviews_bubble:before { background-color: var(--theme-color-bg_color); border-right-color: var(--theme-color-bd_color); border-bottom-color: var(--theme-color-bd_color); } /* Reviews in the single post */ .trx_addons_reviews_block_short .trx_addons_reviews_block_info { color: var(--theme-color-alter_text); background-color: var(--theme-color-alter_bg_color); } .trx_addons_reviews_block_short .trx_addons_reviews_block_title { color: var(--theme-color-extra_dark); background-color: var(--theme-color-extra_bg_color); padding-left: 0.5em; padding-right: 0.5em; } .trx_addons_reviews_block_short .trx_addons_reviews_block_title:after { border-top-color: var(--theme-color-extra_bg_color); } .trx_addons_reviews_block_short .trx_addons_reviews_block_mark_value { border-color: var(--theme-color-alter_bd_hover); background-color: var(--theme-color-alter_bg_hover); } .trx_addons_reviews_block_detailed { color: var(--theme-color-alter_text); background-color: var(--theme-color-alter_bg_color); } .trx_addons_reviews_block_detailed .trx_addons_reviews_block_title { color: var(--theme-color-extra_dark); background-color: var(--theme-color-extra_bg_color); } .trx_addons_reviews_block_detailed .trx_addons_reviews_block_pn { color: var(--theme-color-alter_dark); background-color: var(--theme-color-alter_bg_hover); } .trx_addons_reviews_block_detailed .trx_addons_reviews_block_pn .trx_addons_reviews_block_list li:before { color: var(--theme-color-alter_dark); } .trx_addons_reviews_block_detailed .trx_addons_reviews_block_criterias { color: var(--theme-color-alter_dark); } .trx_addons_reviews_block_detailed .trx_addons_reviews_block_criterias[data-mark-max="10"] [class*="trx_addons_reviews_block_list_mark_line"], .trx_addons_reviews_block_detailed .trx_addons_reviews_block_criterias[data-mark-max="100"] [class*="trx_addons_reviews_block_list_mark_line"] { background-color: var(--theme-color-text_link); } .trx_addons_reviews_block_mark .trx_addons_reviews_block_mark_value{ border-color: var(--theme-color-alter_bd_hover); background-color: var(--theme-color-alter_bg_hover); } .trx_addons_reviews_block_mark_text { font-weight: 500; } .trx_addons_reviews_block_detailed .trx_addons_reviews_block_buttons { color:var(--theme-color-text_dark); } .trx_addons_reviews_block_detailed .trx_addons_reviews_block_buttons .trx_addons_reviews_block_subtitle { font-weight: 500; } .trx_addons_reviews_block_detailed .trx_addons_reviews_block_pn .trx_addons_reviews_block_list li:before { left: -1.5em; } .trx_addons_reviews_block { .sc_button { font-size: 15px; line-height: 17px; padding: 17px 27px; } &.trx_addons_reviews_block_detailed { .trx_addons_reviews_block_pn { .trx_addons_reviews_block_negatives, .trx_addons_reviews_block_positives { padding-left: 0; width: calc(50% - 1em); .trx_addons_reviews_block_list li:before { font-family: $theme_icons; font-weight: 400; font-size: 0.9em; line-height: 1.9em; } } .trx_addons_reviews_block_positives { .trx_addons_reviews_block_list li:before { content: '\E8AD'; } } .trx_addons_reviews_block_negatives { .trx_addons_reviews_block_list li:before { content: '\E8AE'; } } } } .trx_addons_reviews_block_mark { overflow: visible; canvas { transform: rotate(-90deg) translateY(calc(-50% - -0.5px)); } .trx_addons_reviews_block_mark_value { width: 2.9em; height: 2.9em; line-height: 2.9em; border-width: 4px; } } } /* Shortcodes --------------------------------------------- */ /* Common styles */ .sc_item_subtitle { color:var(--theme-color-text_dark); } .color_style_link2 .sc_item_subtitle { color:var(--theme-color-text_link2); } .color_style_link3 .sc_item_subtitle { color:var(--theme-color-text_link3); } .sc_item_subtitle.sc_item_title_style_shadow { color:var(--theme-color-text_light); } .theme_scroll_down:hover { color: var(--theme-color-text_link); } .sc_item_filters_more_link_wrap { .sc_item_filters_more_link { overflow: visible; } } .sc_item_filters_align_left, .sc_item_filters_align_right, .sc_item_filters .sc_item_filters_header { border-color: var(--theme-color-text_dark); } .sc_item_filters_align_left, .sc_item_filters_align_right { .sc_item_filters_header { flex-basis: 50%; } } .sc_item_filters_align_right .sc_item_filters_header { flex-basis: 50%; text-align: right; } .sc_blogger.sc_item_filters_tabs_left .sc_item_filters_tabs li > a { padding: 0.15em 0; margin-bottom: 0.5em; } ul.sc_layouts_submenu { .sc_item_filters_tabs_left .sc_item_filters_tabs > li > a.active, .sc_item_filters_tabs_left .sc_item_filters_tabs > li > a.active > span { color: var(--theme-color-extra_dark) !important; } .post_featured.hover_info .post_info { padding: 1em; .post_category { top: 1em; left: 1em; } } .post_featured .post_info .post_title { font-size: 1.25em; } .post_featured .post_info .post_descr { display: none; } } .menu_mobile ul.sc_layouts_submenu { .sc_item_filters_tabs_left .sc_item_filters, .sc_item_filters_tabs_left .sc_item_posts_container, .sc_item_filters_tabs_left .sc_item_pagination { margin-left: 0; } .sc_item_filters_tabs_right .sc_item_filters, .sc_item_filters_tabs_right .sc_item_posts_container, .sc_item_filters_tabs_right .sc_item_pagination { margin-right: 0; } .sc_item_filters .sc_item_filters_tabs { position: static; width: 100%; padding: 0 !important; margin-bottom: 1em !important; li { display: inline-block; vertical-align: top; margin-right: 1em; width: auto; > a { padding: 0; } } li:last-child { margin-right: 0; } } .sc_item_posts_container [class*="column-"] + [class*="column-"] { padding-top: 1em; } } .sc_item_featured { [class*="post_info_"] { color:var(--theme-color-extra_text); background-color:var(--theme-color-extra_bg_color_07); } &:hover [class*="post_info_"] { background-color:var(--theme-color-extra_bg_color_07); } [class*="post_info_"] a { color:var(--theme-color-extra_dark); } [class*="post_info_"] a:hover, [class*="post_info_"] a:focus { color:var(--theme-color-extra_hover); } .post_meta a { color:var(--theme-color-extra_light); } .post_meta a:hover, .post_meta a:focus { color:var(--theme-color-extra_hover); } .post_meta_item.post_categories, .post_meta_item.post_categories a { color: var(--theme-color-extra_link); } .post_meta_item.post_categories a:hover, .post_meta_item.post_categories a:focus { color: var(--theme-color-extra_hover); } } .sc_blogger { .sc_item_featured .post_info_audio { background: transparent !important; padding: 0 !important; max-width: 100% !important; margin: 0 !important; } .format-audio .post_featured.without_thumb .post_audio:not(.with_iframe) { padding: 1.8em; } .format-audio .post_featured .post_audio_title { margin-bottom: 0.2em; } } /* Typed title */ .sc_typed_entry { color: var(--theme-color-text_dark); } /* Action */ .sc_action_item .sc_action_item_subtitle { color:var(--theme-color-text_link); } .sc_action_item.color_style_link2 .sc_action_item_subtitle { color:var(--theme-color-text_link2); } .sc_action_item.color_style_link3 .sc_action_item_subtitle { color:var(--theme-color-text_link3); } .sc_action_item.color_style_dark .sc_action_item_subtitle { color:var(--theme-color-text_dark); } .sc_action_item_event .sc_action_item_date, .sc_action_item_event .sc_action_item_info { color:var(--theme-color-text_dark); border-color:var(--theme-color-text); } .sc_action_item_event .sc_action_item_description { color:var(--theme-color-text); } .sc_action_item_event.with_image .sc_action_item_inner { background-color:var(--theme-color-bg_color); } /* Blogger */ .sc_blogger .post_featured + .post_header { max-width: none; padding: 0; display: block; } .sc_blogger_item_list.sc_blogger_item_image_position_left .sc_blogger_item_title, .sc_blogger_item_list.sc_blogger_item_image_position_right .sc_blogger_item_title, .sc_blogger_item_list.sc_blogger_item_image_position_alter .sc_blogger_item_title { @include font(1.15em, 1.5em); } .sc_blogger_item_list.sc_blogger_item_with_image.sc_blogger_item_image_position_left .sc_blogger_item_title, .sc_blogger_item_list.sc_blogger_item_with_image.sc_blogger_item_image_position_right .sc_blogger_item_title, .sc_blogger_item_list.sc_blogger_item_with_image.sc_blogger_item_image_position_alter .sc_blogger_item_title { margin-top: -0.5em; } // Inside single post .post_item_single .post_content_single .sc_item_filters_title, .editor-block-list__layout .sc_item_filters_title { font-size: 1.15em; line-height: 1.25em; text-transform: uppercase; } .post_item_single .post_content_single .sc_blogger_item_excerpt, .editor-block-list__layout .sc_blogger_item_excerpt { line-height: 1.5em; } .sc_blogger.slider_container .swiper-pagination-bullet { border-color: var(--theme-color-text_light); } .sc_blogger_item_on_plate .sc_blogger_item_body { color: var(--theme-color-alter_text); } .sc_blogger_item_default.sc_blogger_item_on_plate .sc_blogger_item_body, .sc_blogger_item_list.sc_blogger_item_on_plate .sc_blogger_item_body, .sc_blogger_item_wide.sc_blogger_item_on_plate { background-color: var(--theme-color-alter_bg_color); } .sc_blogger_item_on_plate .sc_blogger_item_content .post_meta, .sc_blogger_item_on_plate .sc_blogger_item_content .post_meta a { color: var(--theme-color-alter_light); } .sc_blogger_item_on_plate .sc_blogger_item_content .post_meta a:hover { color: var(--theme-color-alter_dark); } .sc_blogger_item_on_plate .sc_blogger_item_content .post_meta .post_sponsored, .sc_blogger_item_on_plate .sc_blogger_item_content .post_meta .post_sponsored a { color: var(--theme-color-alter_link); } .sc_blogger_item_on_plate .sc_blogger_item_content .post_meta .post_sponsored a:hover { color: var(--theme-color-alter_dark); } .sc_blogger_item_on_plate .sc_blogger_item_content a { color: var(--theme-color-alter_link); } .sc_blogger_item_on_plate .sc_blogger_item_content a:hover { color: var(--theme-color-alter_hover); } .sc_blogger_item_on_plate .sc_blogger_item_content a.sc_button_simple:hover { color: var(--theme-color-alter_hover) !important; } .sc_blogger_item_on_plate .sc_blogger_item_content .sc_blogger_item_title a { color: var(--theme-color-alter_dark); } .sc_blogger_item_on_plate .sc_blogger_item_content .sc_blogger_item_title a:hover { color: var(--theme-color-alter_link); } .sc_blogger_item_default.sc_blogger_item_on_plate .sc_blogger_item_excerpt:after { background-image: -webkit-gradient(linear,left top,left bottom,from(var(--theme-color-alter_bg_color_00)),to(var(--theme-color-alter_bg_color))); background-image: -webkit-linear-gradient(top,var(--theme-color-alter_bg_color_00),var(--theme-color-alter_bg_color)); background-image: -o-linear-gradient(top,var(--theme-color-alter_bg_color_00),var(--theme-color-alter_bg_color)); background-image: linear-gradient(180deg,var(--theme-color-alter_bg_color_00),var(--theme-color-alter_bg_color)); } .sc_blogger_content .sc_blogger_item { border-color: var(--theme-color-bd_color); } .sc_blogger_item_list.sc_blogger_item_with_numbers:not(.sc_blogger_item_with_image) .sc_blogger_item_title:before, .sc_blogger_item_list.sc_blogger_item_with_numbers.sc_blogger_item_with_image .sc_blogger_item_featured:after { color: var(--theme-color-extra_dark); background-color: var(--theme-color-extra_bg_color); } .sc_blogger_item_list .post_featured[class*="hover_"] .post_info_back { display: none; } /* Content */ .sc_content_number { color: var(--theme-color-alter_bg_hover); } .sc_content_width_1_1, .sc_inner_width_1_1 > .elementor-column-wrap, .sc_inner_width_1_1 > .elementor-widget-wrap { width: var(--theme-var-page); } .sc_content_width_1_2, .sc_inner_width_1_2 > .elementor-column-wrap, .sc_inner_width_1_2 > .elementor-widget-wrap { width: calc( var(--theme-var-page ) / 2 ); } .sc_content_width_1_3, .sc_inner_width_1_3 > .elementor-column-wrap, .sc_inner_width_1_3 > .elementor-widget-wrap { width: calc( var(--theme-var-page ) / 3 ); } .sc_content_width_2_3, .sc_inner_width_2_3 > .elementor-column-wrap, .sc_inner_width_2_3 > .elementor-widget-wrap { width: calc( var(--theme-var-page ) / 3 * 2 ); } .sc_content_width_1_4, .sc_inner_width_1_4 > .elementor-column-wrap, .sc_inner_width_1_4 > .elementor-widget-wrap { width: calc( var(--theme-var-page ) / 4 ); } .sc_content_width_3_4, .sc_inner_width_3_4 > .elementor-column-wrap, .sc_inner_width_3_4 > .elementor-widget-wrap { width: calc( var(--theme-var-page ) / 4 * 3 ); } /* Events */ .sc_events.slider_container .swiper-pagination-bullet { border-color: var(--theme-color-text_light); } /* Events Default */ .sc_events_default { .sc_events_columns, .sc_events_slider { .sc_events_item { @include flex-direction(column); } .sc_events_item_info { @include flex-direction(column); padding-right: 0; } .sc_events_item_content_wrap { @include flex-direction(column); } .sc_events_item_thumb { flex-basis: 100%; margin-right: 0; margin-bottom: 1em; } .sc_events_item_date_start { display: none; margin: 0 0 1em 0; } .sc_events_item_price { width: 100%; margin-top: 0.6em; } } .sc_events_item { position: relative; z-index: 1; @include flex; @include flex-direction(row); @include flex-wrap(nowrap); @include flex-justify-content(flex-start); @include flex-align-items(flex-start); margin-bottom: 0; + .sc_events_item { margin-top: 1.7em; padding-top: 1.7em; border-top: 1px solid var(--theme-color-bd_color); } } .post_featured.hover_link img { will-change: transform; } .sc_events_item:hover .post_featured.hover_link img { @include transform(scale(1.07, 1.07)); } .sc_events_item_link { @include abs-cover(10); } .sc_events_item_info { width: 100%; padding: 0; padding-right: 8%; @include flex; @include flex-direction(row); @include flex-align-items(flex-start); @include border-box; } .sc_events_item_content_wrap { @include flex; @include flex-direction(row); @include flex-align-items(flex-start); @include flex-justify-content(flex-start); } .sc_events_item_content { width: 100%; margin-top: 0.5em; } .sc_events_item_thumb { width: 100%; margin-right: 1.6em; overflow: hidden !important; flex-basis: 170px; flex-shrink: 0; } .sc_events_item_title { @include font(1.333em, 1.2em); margin: 0; } .sc_events_item_title + .sc_events_item_meta { margin-top: 0.6em; } .sc_events_item_meta + .sc_events_item_more_link, .sc_events_item_meta + .sc_events_item_text { margin-top: 0.8em; } .sc_events_item_text + .sc_events_item_more_link { margin-top: 0.8em; } .sc_events_item_price { margin-top: 0.3em; position: relative; z-index: 1; top: auto; right: auto; @include font(1.333em, 1.2em, 600); color: var(--theme-color-text_dark); &.free_price { color: var(--theme-color-text_link); } &:not(.free_price):before { font-family: $theme_icons; content: '\E9BD'; margin-right: 0.5em; } } .sc_events_item_meta { @include font(14px, 24px); color: var(--theme-color-text_light); } .sc_events_item_meta_date { position: relative; &:before { @include font(16px, '', 400); margin-right: 10px; font-family: $theme_icons; content: '\E9B7'; color: var(--theme-color-text_link); } } .sc_events_item_meta_locality { margin-right: 1em; @include font(16px, 19px, 500); color: var(--theme-color-text_dark); } .sc_events_item_date_start { width: auto; min-width: 80px; margin-right: 1.3em; margin-top: 0.5em; @include flex; @include flex-direction(column); @include flex-justify-content(flex-start); @include border-box; flex-shrink: 0; .sc_events_item_date_day { @include font(1.944em, 1em, 600); color: var(--theme-color-text_dark); } .sc_events_item_date_month { margin-top: 7px; @include font(15px, 19px); color: var(--theme-color-text_light); } } .sc_events_item_more_link { position: relative; display: inline-block; top: auto; left: auto; height: auto; width: auto; @include font(15px, 21px, 500); color: var(--theme-color-text_dark); z-index: 1; overflow: hidden; } .sc_events_item_more_link .link_text { position: relative; margin-right: 0; display: inline-block; vertical-align: middle; text-indent: -110px; visibility: hidden; white-space: nowrap; opacity: 0; @include transition(visibility .4s ease, margin-right .4s ease-out, text-indent .5s ease-out, opacity .4s ease); will-change: visibility, margin-right, text-indent, opacity; } .sc_events_item:hover .sc_events_item_more_link .link_text, .sc_events_item .sc_events_item_more_link: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, opacity .4s ease); } .sc_events_item .sc_events_item_more_link .link_icon { position: relative; display: inline-block; vertical-align: middle; overflow: hidden; @include square(1.4em); } .sc_events_item .sc_events_item_more_link .link_icon:before { @include font(11px, inherit, 400, inherit); content: '\E9A4'; font-family: $theme_icons; display: inline-block; vertical-align: top; color: currentColor; } } /* Events Classic */ .sc_events_classic { .sc_events_slider .sc_events_item, .sc_events_columns .sc_events_item { display: inline-block; vertical-align: top; width: 100%; height: 100%; @include border-box; } .sc_events_item { position: relative; z-index: 1; overflow: hidden; &:before { content: ' '; width: 0; height: 0; padding-top: 110%; display: inline-block; margin-left: -0.2em; } } .sc_events_item_content { @include flex; @include bg-mask(#05080d, 1, 1); } .sc_events_item_featured { @include abs-pos(0,0,0,0,-1); @include bg-cover; @include transition(transform .3s ease-out); @include backface-hidden; &:before { content: ''; @include abs-pos(0, 0, 0, 0, -1); background: -moz-linear-gradient(top, rgba(0, 0, 0, 0) 0%, rgba(0, 0, 0, 1) 100%); background: -webkit-linear-gradient(top, rgba(0, 0, 0, 0) 0%, rgba(0, 0, 0, 1) 100%); background: linear-gradient(to bottom, rgba(0, 0, 0, 0) 0%, rgba(0, 0, 0, 1) 100%); opacity: .9; } } .sc_events_item:hover .sc_events_item_featured { @include transform(scale(1.05, 1.05)); } .sc_events_item_content_inner { position: relative; z-index: 1; padding: 2em 2.2em; @include flex; @include flex-direction(column); @include flex-justify-content(stretch); @include flex-align-items(flex-start); @include border-box; width: 100%; max-height: 100%; overflow: hidden; } .sc_events_item_content_inner_top { position: relative; z-index: 1; } .sc_events_item_content_inner_bottom { @include flex-grow(1); @include flex; @include flex-direction(column); @include flex-justify-content(flex-end); position: relative; z-index: 1; width: 100%; max-height: 100%; overflow: hidden; @include border-box; } .sc_events_item.with_more .sc_events_item_content_inner_bottom { @include transform(translateY(25px)); will-change: transform; @include transition(transform .3s ease-out); } .sc_events_item.with_more:hover .sc_events_item_content_inner_bottom { @include transform(translateY(-15px)); } .sc_events_item_link { @include abs-cover(10); } .sc_events_item_title, .sc_events_item_title a { color: #ffffff; } .sc_events_item_title a:hover { color: #ffffff; } .sc_events_item_meta_categories { display: block; line-height: normal; a { margin: 0 6px 6px 0; display: inline-block; padding: 6px 16px; @include font(11px, 14px, 700); letter-spacing: 1px; text-transform: uppercase; @include border-radius(0); color: var(--theme-color-inverse_link); background-color: var(--theme-color-text_link2); &:hover { color: var(--theme-color-inverse_hover); background-color: var(--theme-color-text_dark); } } } .sc_events_item:hover .sc_events_item_meta_categories a { color: var(--theme-color-inverse_hover); background-color: var(--theme-color-text_dark); } .sc_events_item_meta { margin-top: 1em; @include font(14px, 24px); color: #d2d3d5; } .sc_events_item_date { letter-spacing: inherit; font-style: inherit; } .sc_events_item_meta_date { position: relative; &:before { @include font(16px, '', 400); margin-right: 13px; font-family: $theme_icons; content: '\E9B7'; color: var(--theme-color-text_link); } } .sc_events_item_text { color: #d2d3d5; margin-top: 0.6em; max-height: 3.6em; overflow: hidden; } .sc_events_item_more_link { margin-top: 1em; position: relative; z-index: 1; display: inline-block; @include font(14px, 20px, 700); letter-spacing: 1px; text-transform: uppercase; color: #ffffff; overflow: hidden; opacity: 0; will-change: opacity; @include transition(opacity .3s ease-out); } .sc_events_item:hover .sc_events_item_more_link { opacity: 1; } .sc_events_item_more_link .link_text { position: relative; margin-right: 6px; display: inline-block; vertical-align: middle; white-space: nowrap; opacity: 1; } .sc_events_item_more_link .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; } } } /* Events Modern */ .sc_events_modern { .sc_events_item { position: relative; @include flex; @include flex-justify-content(flex-start); @include flex-align-items(flex-start); } .sc_events_item_thumb { position: relative; z-index: 1; @include box(170px, 170px); margin-top: 1px; margin-bottom: 1px; margin-right: 1.6em; overflow: hidden; @include border-radius(50%); flex-shrink: 0; &:before { display: none; } .bg_in { margin-top: -1px; margin-bottom: -1px; } } .sc_events_item:hover .sc_events_item_thumb > .bg_in { @include transform(scale(1.07, 1.07)); } .sc_events_item_info { margin-top: 1.3em; } .sc_events_item_title { @include font(1.333em, 1.2em); margin: 0; } .sc_events_item_title, .sc_events_item_title a { color: var(--theme-color-text_dark); } .sc_events_item_title a:hover { color: var(--theme-color-text_dark); } .sc_events_item_title + .sc_events_item_meta { margin-top: 0.6em; } .sc_events_item_meta + .sc_events_item_more_link, .sc_events_item_meta + .sc_events_item_text { margin-top: 1em; } .sc_events_item_text + .sc_events_item_more_link { margin-top: 1em; } .sc_events_item_price { display: inline-block; margin-bottom: 0.66em; @include font(1.333em, 1.2em, 600); color: var(--theme-color-text_link); } .sc_events_item_meta { margin-top: 1em; @include font(14px, 24px); color: var(--theme-color-text_light); } .sc_events_item_meta_date { position: relative; &:before { @include font(16px, '', 400); margin-right: 10px; font-family: $theme_icons; content: '\E9B7'; color: var(--theme-color-text_link); } } .sc_events_item_meta_date_separator { margin: 0 0.5em; } .sc_events_item_meta_locality { margin-right: 1em; @include font(16px, 19px, 500); color: var(--theme-color-text_dark); } .sc_events_item_link { @include abs-cover(10); } .sc_events_item_more_link { position: relative; display: inline-block; top: auto; left: auto; height: auto; width: auto; @include font(15px, 21px, 500); color: var(--theme-color-text_dark); z-index: 1; overflow: hidden; } .sc_events_item_more_link .link_text { position: relative; margin-right: 0; display: inline-block; vertical-align: middle; text-indent: -110px; visibility: hidden; white-space: nowrap; opacity: 0; @include transition(visibility .4s ease, margin-right .4s ease-out, text-indent .5s ease-out, opacity .4s ease); will-change: visibility, margin-right, text-indent, opacity; } .sc_events_item:hover .sc_events_item_more_link .link_text, .sc_events_item .sc_events_item_more_link: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, opacity .4s ease); } .sc_events_item .sc_events_item_more_link .link_icon { position: relative; display: inline-block; vertical-align: middle; overflow: hidden; @include square(1.4em); } .sc_events_item .sc_events_item_more_link .link_icon:before { @include font(11px, inherit, 400, inherit); content: '\E9A4'; font-family: $theme_icons; display: inline-block; vertical-align: top; color: currentColor; } } /* Events Alter */ .sc_events_alter { .sc_events_item { position: relative; } .sc_events_item_info { position: relative; padding: 2em 2.2em 2.4em; background-color: var(--theme-color-alter_bg_color); @include box-shadow(0 3px 20px rgba(0,0,0,.03)); } .sc_events_item_thumb { margin-bottom: 0; } .sc_events_item:hover .sc_events_item_thumb img { @include transform(scale(1.07, 1.07)); } .sc_events_item_meta + .sc_events_item_title, .sc_events_item_meta + .sc_events_item_text, .sc_events_item_meta + .sc_events_item_more_link { margin-top: 0.55em; } .sc_events_item_title + .sc_events_item_text, .sc_events_item_title + .sc_events_item_more_link { margin-top: 1.2em; } .sc_events_item_text + .sc_events_item_more_link { margin-top: 1.2em; } .sc_events_item_title { @include font(1.556em, 1.22em); margin: 0; } .sc_events_item_title, .sc_events_item_title a { color: var(--theme-color-text_dark); } .sc_events_item_title a:hover { color: var(--theme-color-text_dark); } .sc_events_item_price { padding: 10px 12px 12px; @include flex; @include flex-justify-content(center); @include flex-align-items(center); min-width: 65px; min-height: 65px; @include abs-rt(25px, -50px, 5); @include border-radius(0); @include content-box; color: var(--theme-color-inverse_hover); background-color: var(--theme-color-alter_dark); .sc_events_item_price_text { position: relative; top: 0; @include font(26px, 1em, 600); } } .sc_events_item_meta { padding-right: 80px; @include font(14px, 24px); color: var(--theme-color-text_light); } .sc_events_item_meta_date { position: relative; &:before { @include font(16px, '', 400); margin-right: 10px; font-family: $theme_icons; content: '\E9B7'; color: var(--theme-color-text_link); } } .sc_events_item_meta_date_separator { margin: 0 0.5em; } .sc_events_item_link { @include abs-cover(10); } .sc_events_item_more_link { position: relative; display: inline-block; top: auto; left: auto; height: auto; width: auto; @include font(15px, 21px, 500); color: var(--theme-color-text_dark); z-index: 1; overflow: hidden; } .sc_events_item_more_link .link_text { position: relative; margin-right: 0; display: inline-block; vertical-align: middle; text-indent: -110px; visibility: hidden; white-space: nowrap; opacity: 0; @include transition(visibility .4s ease, margin-right .4s ease-out, text-indent .5s ease-out, opacity .4s ease); will-change: visibility, margin-right, text-indent, opacity; } .sc_events_item:hover .sc_events_item_more_link .link_text, .sc_events_item .sc_events_item_more_link: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, opacity .4s ease); } .sc_events_item .sc_events_item_more_link .link_icon { position: relative; display: inline-block; vertical-align: middle; overflow: hidden; @include square(1.4em); } .sc_events_item .sc_events_item_more_link .link_icon:before { @include font(11px, inherit, 400, inherit); content: '\E9A4'; font-family: $theme_icons; display: inline-block; vertical-align: top; color: currentColor; } } /* Form */ .trx_addons_field_error { border-color: #ff5b4a !important; @include box-shadow(none); } .sc_form .sc_form_info_item .sc_form_info_icon:before { font-family: $theme_icons; } .sc_form .sc_form_info_item_address .sc_form_info_icon:before { content: '\e8fd'; } .sc_form .sc_form_info_item_email .sc_form_info_icon:before { content: '\e8fa'; } .sc_form .sc_form_info_item_phone .sc_form_info_icon:before { content: '\e8f5'; } [class*="scheme_"].sc_form { background-color: var(--theme-color-bg_color); } span.sc_form_field_title { color: var(--theme-color-text_dark); } .sc_form .sc_form_info_icon { color: var(--theme-color-text_link); } .sc_form .sc_form_info_data > a, .sc_form .sc_form_info_data > span { color: var(--theme-color-text_dark); } .sc_form .sc_form_info_data > a:hover { color: var(--theme-color-text_link); } /* input hovers */ [class*="sc_input_hover_"] .sc_form_field_hover { color: var(--theme-color-text_dark); } .sc_input_hover_accent input[type="text"]:focus, .sc_input_hover_accent input[type="number"]:focus, .sc_input_hover_accent input[type="email"]:focus, .sc_input_hover_accent input[type="password"]:focus, .sc_input_hover_accent input[type="search"]:focus, .sc_input_hover_accent select:focus, .sc_input_hover_accent .select2-container.select2-container--focus span.select2-selection, .sc_input_hover_accent .select2-container.select2-container--open span.select2-selection, .sc_input_hover_accent textarea:focus { border-color: var(--theme-color-text_link) !important; } .sc_input_hover_accent .sc_form_field_hover:before { color: var(--theme-color-text_link_02); } .sc_input_hover_path .sc_form_field_graphic { stroke: var(--theme-color-input_bd_color); } .sc_input_hover_jump .sc_form_field_hover { color: var(--theme-color-input_light); } .sc_input_hover_jump .sc_form_field_content:before { color: var(--theme-color-text_link); } .sc_input_hover_jump input[type="text"], .sc_input_hover_jump input[type="number"], .sc_input_hover_jump input[type="email"], .sc_input_hover_jump input[type="password"], .sc_input_hover_jump input[type="search"], .sc_input_hover_jump textarea { border-color: var(--theme-color-input_bd_color); } .sc_input_hover_jump input[type="text"]:focus, .sc_input_hover_jump input[type="number"]:focus, .sc_input_hover_jump input[type="email"]:focus, .sc_input_hover_jump input[type="password"]:focus, .sc_input_hover_jump input[type="search"]:focus, .sc_input_hover_jump textarea:focus { border-color: var(--theme-color-text_link) !important; } .sc_input_hover_underline .sc_form_field_hover:before { background-color: var(--theme-color-input_bd_color); } .sc_input_hover_underline input:focus + .sc_form_field_hover:before, .sc_input_hover_underline textarea:focus + .sc_form_field_hover:before, .sc_input_hover_underline input.filled + .sc_form_field_hover:before, .sc_input_hover_underline textarea.filled + .sc_form_field_hover:before { background-color: var(--theme-color-text_link); } .sc_input_hover_underline .sc_form_field_content { color: var(--theme-color-input_dark); } .sc_input_hover_underline input:focus, .sc_input_hover_underline textarea:focus, .sc_input_hover_underline input.filled, .sc_input_hover_underline textarea.filled, .sc_input_hover_underline input:focus + .sc_form_field_hover > .sc_form_field_content, .sc_input_hover_underline textarea:focus + .sc_form_field_hover > .sc_form_field_content, .sc_input_hover_underline input.filled + .sc_form_field_hover > .sc_form_field_content, .sc_input_hover_underline textarea.filled + .sc_form_field_hover > .sc_form_field_content { color: var(--theme-color-text_link) !important; } .sc_input_hover_iconed .sc_form_field_hover { overflow: hidden; padding: 0.88em 0 !important; font-size: 16px; font-weight: 400; line-height: 18px; } [class*="sc_input_hover_"] input[type="text"], [class*="sc_input_hover_"] input[type="number"], [class*="sc_input_hover_"] input[type="email"], [class*="sc_input_hover_"] input[type="password"], [class*="sc_input_hover_"] input[type="search"], [class*="sc_input_hover_"] select, [class*="sc_input_hover_"] textarea { padding: 1em !important; font-size: 16px; font-weight: 400; } [class*="sc_input_hover_"].sc_input_hover_iconed input[type="text"], [class*="sc_input_hover_"].sc_input_hover_iconed input[type="number"], [class*="sc_input_hover_"].sc_input_hover_iconed input[type="email"], [class*="sc_input_hover_"].sc_input_hover_iconed input[type="password"], [class*="sc_input_hover_"].sc_input_hover_iconed input[type="search"], [class*="sc_input_hover_"].sc_input_hover_iconed textarea { padding-left: 2.5em !important; } .sc_input_hover_iconed .sc_form_field_hover { color: var(--theme-color-input_light); } .sc_input_hover_iconed input:focus + .sc_form_field_hover, .sc_input_hover_iconed textarea:focus + .sc_form_field_hover, .sc_input_hover_iconed input.filled + .sc_form_field_hover, .sc_input_hover_iconed textarea.filled + .sc_form_field_hover { color: var(--theme-color-input_dark); } /* Cart */ .sc_layouts_cart { display: inline-block; .sc_layouts_cart_icon { &:before { position: relative; font-family: $theme_icons; content: '\e9f4'; } } } /* Iconed Text */ .sc_layouts_item_details_line1 { @include font(16px, 21px, 400); color: var(--theme-color-text); } .sc_layouts_item_details_line2 { @include font(19px, 26px, 500); color: var(--theme-color-text_dark); } .sc_layouts_item_icon + .sc_layouts_item_details { margin-left: 0.7em; } /* Login & Logout */ .sc_layouts_login { .sc_layouts_login_icon:before { font-family: $theme_icons; content: '\EA12'; } .sc_layouts_row_type_compact & .sc_layouts_item_details_line1 + .sc_layouts_item_details_line2 { margin-left: 0.3em; } } /* popup login form */ .trx_addons_popup .trx_addons_tabs_titles { margin-bottom: 0; li.trx_addons_tabs_title > a { text-transform: none; } } .trx_addons_popup .trx_addons_tabs_titles + .trx_addons_tabs_content, .trx_addons_popup .trx_addons_tabs_titles + .trx_addons_tabs_content + .trx_addons_tabs_content { padding: 1.7em 1.7em 2.2em; } .trx_addons_popup_form_field_remember, .trx_addons_popup_form_field_agree, .trx_addons_popup_form_field_pwd_description { font-size: 14px; } .trx_addons_popup_form_field_submit .submit_button { padding: 0.5em 2em; } .trx_addons_popup_form_field_submit { padding-top: 1.1em; } .trx_addons_popup_form_field_agree input[type="checkbox"] + label:before, .trx_addons_popup_form_field_remember input[type="checkbox"] + label:before { top: 3px; } .trx_addons_popup_form_field_submit .submit_button { padding: 14px 48px; @include font(16px, 21px); } /* Googlemap */ .sc_googlemap_content, [class*="scheme_"].sc_googlemap_content { color: var(--theme-color-text); background-color: var(--theme-color-bg_color); } .sc_googlemap_content b, .sc_googlemap_content strong, [class*="scheme_"].sc_googlemap_content b, [class*="scheme_"].sc_googlemap_content strong { color: var(--theme-color-text_dark); } .sc_googlemap_content_detailed:before { color: var(--theme-color-text_link); } /* OpenStreet map */ .sc_osmap_content, [class*="scheme_"].sc_osmap_content { color: var(--theme-color-text); background-color: var(--theme-color-bg_color); } .sc_osmap_content b, .sc_osmap_content strong, [class*="scheme_"].sc_osmap_content b, [class*="scheme_"].sc_osmap_content strong { color: var(--theme-color-text_dark); } .sc_osmap_content_detailed:before { color: var(--theme-color-text_link); } .sc_osmap input[type="text"] { padding: 0.3em 0.5em; } /* Portfolio */ .sc_portfolio_default .sc_portfolio_item { @include transition-colors; } .portfolio_page_details_share { border-color: var(--theme-color-bd_color); } .portfolio_page_details_share .socials_wrap .social_item .social_icon { color: var(--theme-color-text_dark); } .portfolio_page_details_share .socials_wrap .social_item:hover .social_icon { color: var(--theme-color-text_hover); } [class*="scheme_"].sc_portfolio_preview { color: var(--theme-color-text); } [class*="scheme_"].sc_portfolio_preview:before { background-color: var(--theme-color-bg_color); } /* Promo */ .sc_promo_icon { color:var(--theme-color-text_link); } .sc_promo .sc_promo_title, .sc_promo .sc_promo_descr { color:var(--theme-color-text_dark); } .sc_promo .sc_promo_content { color:var(--theme-color-text); } .sc_promo_modern .sc_promo_link2 { color: var(--theme-color-inverse_link); background-color: var(--theme-color-text_link) !important; } .sc_promo_modern .sc_promo_link2:hover { color: var(--theme-color-bg_color); background-color: var(--theme-color-text_dark); } [class*="scheme_"].sc_promo .sc_promo_text.trx_addons_stretch_height, [class*="scheme_"].sc_promo .sc_promo_text_inner { background-color: var(--theme-color-alter_bg_color); } [class*="scheme_"].sc_promo .sc_promo_title { color:var(--theme-color-alter_link); } [class*="scheme_"].sc_promo .sc_promo_subtitle { color:var(--theme-color-alter_hover); } [class*="scheme_"].sc_promo .sc_promo_descr { color:var(--theme-color-alter_dark); } [class*="scheme_"].sc_promo .sc_promo_content { color:var(--theme-color-alter_text); } /* Reviews */ .sidebar_hide.narrow_content .trx_addons_reviews_block.trx_addons_reviews_block_short { margin-top: 0; } /* Services */ .services_single .services_page_content > { h1:first-child, h2:first-child, h3:first-child, h4:first-child, h5:first-child, h6:first-child { margin-top: 0 !important; } } .sc_services_motley > .sc_services_content > .sc_services_item, .sc_services_fashion > .sc_services_content > .sc_services_item, .sc_services_creative > .sc_services_content > .sc_services_item, .sc_services_minimal > .sc_services_content > .sc_services_item { + .sc_services_item { margin-top: 2em; } } .sc_services_strange > .sc_services_content > .sc_services_item + .sc_services_item, .sc_services_unusual > .sc_services_content > .sc_services_item + .sc_services_item, .sc_services_accent > .sc_services_content > .sc_services_item + .sc_services_item, .sc_services_shine > .sc_services_content > .sc_services_item + .sc_services_item, .sc_services_classic > .sc_services_content > .sc_services_item + .sc_services_item, .sc_services_strong > .sc_services_content > .sc_services_item + .sc_services_item, .sc_services_extra > .sc_services_content > .sc_services_item + .sc_services_item, .sc_services_cool > .sc_services_content > .sc_services_item + .sc_services_item, .sc_services_breezy > .sc_services_content > .sc_services_item + .sc_services_item, .sc_services_alter > .sc_services_content > .sc_services_item + .sc_services_item, .sc_services_hover > .sc_services_content > .sc_services_item + .sc_services_item { margin-top: 2em; } .sc_services_backward > .sc_services_content > .sc_services_item + .sc_services_item { margin-top: 3.5em; } .services_page_tabs { margin-top: 5em; &.trx_addons_tabs .trx_addons_tabs_titles { border-bottom-color: var(--theme-color-bd_color); li > a { font-weight: 500; text-transform: none; color: var(--theme-color-text_dark); border-color: var(--theme-color-bd_color); background-color: var(--theme-color-bg_color); } li:not(.ui-state-active) > a:hover { border-color: var(--theme-color-bd_color); background-color: var(--theme-color-bg_color); } li.ui-state-active > a { color: var(--theme-color-text_dark); background-color: var(--theme-color-bg_color); border-color: var(--theme-color-bd_color); border-bottom-color: var(--theme-color-bg_color); } li + li { margin-left: -1px; } } .show_comments_single { display: none; } .comments_wrap { display: block; } .comments_list_wrap, .comments_form_wrap:first-child { margin-top: 0; padding-top: 0; border-top-width: 0; } .comments_list_wrap + .comments_form_wrap { margin-top: 3em; padding-top: 3em; border-top-width: 1px; } } .services_page_related + .services_page_section_contacts, .services_single + .services_page_section_contacts { margin-top: 5em; } .sc_services .sc_services_item .post_featured .post_info_back { display: none; } .sc_services .sc_services_item_number { color: var(--theme-color-text_dark); } .sc_services .sc_services_item_subtitle { @include font(17px, 1.5em, 400, normal); letter-spacing:0; } .sc_services .post_featured > .sc_services_item_price, .sc_services .post_featured > p > .sc_services_item_price { bottom: 15px; right: 15px; @include font(1.5em, '', 600); color: #fff; text-shadow: 0 0 8px #000; pointer-events: none; } .sc_services_item_button { display: inline-block; } /* Services Related */ .services_page_related.related_wrap { .sc_services_item_number { display: none; } .sc_services_item.sc_services_item_featured_top { background-color: transparent; @include box-shadow(none); } .post_featured { margin-bottom: 1em; } .sc_services_item_info { padding: 0; text-align: left; } .sc_services_item_content { display: none; } .sc_services_item_header { @include flex; @include flex-direction(column-reverse); } .sc_services_item_title { @include font(24px, 1.2em, 600); } .sc_services_item_subtitle { margin-bottom: 0.85em; @include font(13px, 1.5em, 600); letter-spacing: 1.1px; text-transform: uppercase; } .sc_services_item_subtitle, .sc_services_item_subtitle a { color: var(--theme-color-text_dark); } .sc_services_item:hover .sc_services_item_subtitle, .sc_services_item:hover .sc_services_item_subtitle a { color: var(--theme-color-text_dark); } .sc_services_item .sc_services_item_subtitle a:hover { color: var(--theme-color-text_link); } .sc_services_item_title + .sc_services_item_subtitle { margin-top: 0; } } /* Style 'Default' */ .sc_services_default { .sc_services_item { color: var(--theme-color-alter_text); background-color: var(--theme-color-alter_bg_color); } .sc_services_item.sc_services_item_featured_top { @include box-shadow(0 3px 60px rgba(0,0,0,.04)); } .sc_services_slider .sc_services_item.sc_services_item_featured_top { @include box-shadow(none); } .sc_services_item:hover .post_featured.hover_link img { @include transform(scale(1.07, 1.07)); } .sc_services_item_info { padding: 2.9em 2em; text-align: center; } .sc_services_item_content { @include font(17px, 1.65em); margin-top: 0.8em; } .sc_services_item_content p:last-child { margin-bottom: 0; } .sc_services_item_number { display: inline-block; @include font(6em, 1em, 400); margin-top: 0.3em; color: var(--theme-color-alter_dark); } .sc_services_item_featured_left .sc_services_item_number, .sc_services_item_featured_right .sc_services_item_number { @include font(3em, 1em); margin-top: 0; @include abs-lt(0, -5px); } .sc_services_item_featured_left .sc_services_item_icon, .sc_services_item_featured_right .sc_services_item_icon { font-size:3.4em; margin-top: 0; @include abs-lt; } .sc_services_item_featured_right .sc_services_item_thumb, .sc_services_item_featured_right .sc_services_item_icon, .sc_services_item_featured_right .sc_services_item_pictogram, .sc_services_item_featured_right .sc_services_item_number { left: auto; right: 0; } .sc_services_item_featured_right .sc_services_item_info { margin-right: 5em; } .sc_services_item_icon, .sc_services_item_pictogram { position: relative; display: inline-block; font-size: 4.4em; @include box(auto, auto, 1em); margin-top: 0.8em; border: none; @include border-radius(0); } .sc_services_item_title { @include font(1.556em, 1.214em); margin: 0; } .sc_services_item_subtitle, .sc_services_item_subtitle a { color: var(--theme-color-alter_text); } .sc_services_item:hover .sc_services_item_subtitle, .sc_services_item:hover .sc_services_item_subtitle a, .sc_services_item .sc_services_item_subtitle a:hover { color: var(--theme-color-alter_text); } .sc_services_item_title + .sc_services_item_subtitle { margin-top: 0.45em; } .sc_services_item .sc_services_item_title, .sc_services_item .sc_services_item_title a { color: var(--theme-color-alter_dark); } .sc_services_item:hover .sc_services_item_title, .sc_services_item:hover .sc_services_item_title a, .sc_services_item .sc_services_item_title a:hover { color: var(--theme-color-alter_dark); } .sc_services_item .sc_services_item_button { margin: 1.1em 0 0; } .sc_services_item .sc_services_item_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-alter_dark); z-index: 1; overflow: hidden; } .sc_services_item:hover .sc_services_item_more_link, .sc_services_item .sc_services_item_more_link:hover { color: var(--theme-color-alter_dark); } .sc_services_item .sc_services_item_more_link .link_text { display: inline-block; position: relative; margin-right: 0; margin-top: 3px; vertical-align: middle; text-indent: -110px; visibility: hidden; white-space: nowrap; opacity: 0; @include transition(visibility .4s ease, margin-right .4s ease-out, text-indent .5s ease-out, opacity .4s ease); will-change: visibility, margin-right, text-indent, opacity; } .sc_services_item:hover .sc_services_item_more_link .link_text, .sc_services_item .sc_services_item_more_link:hover .link_text { opacity: 1; text-indent: 0; margin-right: 10px; visibility: visible; @include transition(visibility .4s ease, margin-right .3s ease-out, text-indent .4s ease-out, opacity .4s ease); } .sc_services_item .sc_services_item_more_link .link_icon { position: relative; display: inline-block; vertical-align: middle; overflow: hidden; @include box(2.3em, 2.3em, 2.25em); text-align: center; border: 1px solid var(--theme-color-alter_bd_color); @include border-box; @include border-radius(50%); } .sc_services_item .sc_services_item_more_link .link_icon:before { @include font(9px, inherit, 400, inherit); content: '\E9A4'; font-family: $theme_icons; display: inline-block; vertical-align: top; color: currentColor; } .sc_services_item_icon { color: var(--theme-color-alter_link); } .sc_services_item:hover .sc_services_item_icon { color: var(--theme-color-alter_dark); } &.color_style_link2 .sc_services_item_icon { color: var(--theme-color-alter_link2); } &.color_style_link2 .sc_services_item:hover .sc_services_item_icon { color: var(--theme-color-alter_dark); } &.color_style_link2 .sc_services_item_subtitle, &.color_style_link2 .sc_services_item_subtitle a { color: var(--theme-color-alter_text); } &.color_style_link2 .sc_services_item:hover .sc_services_item_subtitle, &.color_style_link2 .sc_services_item:hover .sc_services_item_subtitle a, &.color_style_link2 .sc_services_item .sc_services_item_subtitle a:hover { color: var(--theme-color-alter_text); } &.color_style_link3 .sc_services_item_icon { color: var(--theme-color-alter_link3); } &.color_style_link3 .sc_services_item:hover .sc_services_item_icon { color: var(--theme-color-alter_dark); } &.color_style_link3 .sc_services_item_subtitle, &.color_style_link3 .sc_services_item_subtitle a { color: var(--theme-color-alter_text); } &.color_style_link3 .sc_services_item:hover .sc_services_item_subtitle, &.color_style_link3 .sc_services_item:hover .sc_services_item_subtitle a, &.color_style_link3 .sc_services_item .sc_services_item_subtitle a:hover { color: var(--theme-color-alter_text); } &.color_style_dark .sc_services_item_icon { color: var(--theme-color-alter_dark); } &.color_style_dark .sc_services_item:hover .sc_services_item_icon { color: var(--theme-color-alter_link); } &.color_style_dark .sc_services_item_subtitle, &.color_style_dark .sc_services_item_subtitle a { color: var(--theme-color-alter_text); } &.color_style_dark .sc_services_item:hover .sc_services_item_subtitle, &.color_style_dark .sc_services_item:hover .sc_services_item_subtitle a, &.color_style_dark .sc_services_item .sc_services_item_subtitle a:hover { color: var(--theme-color-alter_text); } .sc_services_item_featured_left, .sc_services_item_featured_right { color: var(--theme-color-text); background-color: transparent; } .sc_services_item_featured_left .sc_services_item_icon, .sc_services_item_featured_right .sc_services_item_icon { color: var(--theme-color-text_link); } .sc_services_item_featured_left:hover .sc_services_item_icon, .sc_services_item_featured_right:hover .sc_services_item_icon { color: var(--theme-color-text_dark); } .sc_services_item_featured_left .sc_services_item_subtitle a, .sc_services_item_featured_right .sc_services_item_subtitle a { color: var(--theme-color-text_link); } .sc_services_item_featured_left .sc_services_item_subtitle a:hover, .sc_services_item_featured_right .sc_services_item_subtitle a:hover { color: var(--theme-color-text_hover); } &.color_style_link2 .sc_services_item_featured_left .sc_services_item_icon, &.color_style_link2 .sc_services_item_featured_right .sc_services_item_icon { color: var(--theme-color-text_link2); } &.color_style_link2 .sc_services_item_featured_left:hover .sc_services_item_icon, &.color_style_link2 .sc_services_item_featured_right:hover .sc_services_item_icon { color: var(--theme-color-text_dark); } &.color_style_link2 .sc_services_item_featured_left .sc_services_item_subtitle a, &.color_style_link2 .sc_services_item_featured_right .sc_services_item_subtitle a { color: var(--theme-color-text_link2); } &.color_style_link2 .sc_services_item_featured_left .sc_services_item_subtitle a:hover, &.color_style_link2 .sc_services_item_featured_right .sc_services_item_subtitle a:hover { color: var(--theme-color-text_hover2); } &.color_style_link3 .sc_services_item_featured_left .sc_services_item_icon, &.color_style_link3 .sc_services_item_featured_right .sc_services_item_icon { color: var(--theme-color-text_link3); } &.color_style_link3 .sc_services_item_featured_left:hover .sc_services_item_icon, &.color_style_link3 .sc_services_item_featured_right:hover .sc_services_item_icon { color: var(--theme-color-text_dark); } &.color_style_link3 .sc_services_item_featured_left .sc_services_item_subtitle a, &.color_style_link3 .sc_services_item_featured_right .sc_services_item_subtitle a { color: var(--theme-color-text_link3); } &.color_style_link3 .sc_services_item_featured_left .sc_services_item_subtitle a:hover, &.color_style_link3 .sc_services_item_featured_right .sc_services_item_subtitle a:hover { color: var(--theme-color-text_hover3); } &.color_style_dark .sc_services_item_featured_left .sc_services_item_icon, &.color_style_dark .sc_services_item_featured_right .sc_services_item_icon { color: var(--theme-color-text_dark); } &.color_style_dark .sc_services_item_featured_left:hover .sc_services_item_icon, &.color_style_dark .sc_services_item_featured_right:hover .sc_services_item_icon { color: var(--theme-color-text_dark); } &.color_style_dark .sc_services_item_featured_left .sc_services_item_subtitle a, &.color_style_dark .sc_services_item_featured_right .sc_services_item_subtitle a { color: var(--theme-color-text_dark); } &.color_style_dark .sc_services_item_featured_left .sc_services_item_subtitle a:hover, &.color_style_dark .sc_services_item_featured_right .sc_services_item_subtitle a:hover { color: var(--theme-color-text_link); } } /* Style 'Alter' */ .sc_services_alter { .sc_services_item { padding: 2em 1.5em; color: var(--theme-color-alter_text); background-color: var(--theme-color-alter_bg_color); } .sc_services_item.with_image { padding: 1.5em; } .sc_services_item:hover .post_featured.hover_link img { @include transform(scale(1.07, 1.07)); } .sc_services_item_content { @include font(17px, 1.65em); margin-top: 0.8em; } .sc_services_item_content p:last-child { margin-bottom: 0; } .sc_services_item_number { display: inline-block; @include font(3.5em, 1em, 400); margin-top: 0.3em; color: var(--theme-color-alter_dark); } .sc_services_item_icon, .sc_services_item_pictogram { position: relative; display: inline-block; font-size: 4em; margin-top: 0.5em; @include box(auto, auto, 1em); } .sc_services_item_number + .sc_services_item_info, .sc_services_item_icon + .sc_services_item_info, .sc_services_item_pictogram + .sc_services_item_info { margin-top: 1.5em; } .sc_services_item_title { @include font(19px, 1.3em); margin: 0; max-width: 70%; } .sc_services_item_subtitle, .sc_services_item_subtitle a { color: var(--theme-color-alter_text); } .sc_services_item:hover .sc_services_item_subtitle, .sc_services_item:hover .sc_services_item_subtitle a, .sc_services_item .sc_services_item_subtitle a:hover { color: var(--theme-color-alter_text); } .sc_services_item_title + .sc_services_item_subtitle { margin-top: 0.45em; } .sc_services_item .sc_services_item_title, .sc_services_item .sc_services_item_title a { color: var(--theme-color-alter_dark); } .sc_services_item:hover .sc_services_item_title, .sc_services_item:hover .sc_services_item_title a, .sc_services_item .sc_services_item_title a:hover { color: var(--theme-color-alter_dark); } .sc_services_item .sc_services_item_button { margin: 1.1em 0 0; } .sc_services_item .sc_services_item_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-alter_dark); z-index: 1; overflow: hidden; } .sc_services_item:hover .sc_services_item_more_link, .sc_services_item .sc_services_item_more_link:hover { color: var(--theme-color-alter_dark); } .sc_services_item .sc_services_item_more_link .link_text { display: inline-block; position: relative; margin-right: 0; vertical-align: middle; text-indent: -110px; visibility: hidden; white-space: nowrap; opacity: 0; @include transition(visibility .4s ease, margin-right .4s ease-out, text-indent .5s ease-out, opacity .4s ease); will-change: visibility, margin-right, text-indent, opacity; } .sc_services_item:hover .sc_services_item_more_link .link_text, .sc_services_item .sc_services_item_more_link:hover .link_text { opacity: 1; text-indent: 0; margin-right: 10px; visibility: visible; @include transition(visibility .4s ease, margin-right .3s ease-out, text-indent .4s ease-out, opacity .4s ease); } .sc_services_item .sc_services_item_more_link .link_icon { position: relative; display: inline-block; vertical-align: middle; overflow: hidden; @include box(2.3em, 2.3em, 2.25em); text-align: center; border: 1px solid var(--theme-color-alter_bd_color); @include border-box; @include border-radius(50%); } .sc_services_item .sc_services_item_more_link .link_icon:before { @include font(9px, inherit, 400, inherit); content: '\E9A4'; font-family: $theme_icons; display: inline-block; vertical-align: top; color: currentColor; } .sc_services_item_icon { color: var(--theme-color-alter_link); } .sc_services_item:hover .sc_services_item_icon { color: var(--theme-color-alter_dark); } &.color_style_link2 .sc_services_item_icon { color: var(--theme-color-alter_link2); } &.color_style_link2 .sc_services_item:hover .sc_services_item_icon { color: var(--theme-color-alter_dark); } &.color_style_link2 .sc_services_item_subtitle, &.color_style_link2 .sc_services_item_subtitle a { color: var(--theme-color-alter_text); } &.color_style_link2 .sc_services_item:hover .sc_services_item_subtitle, &.color_style_link2 .sc_services_item:hover .sc_services_item_subtitle a, &.color_style_link2 .sc_services_item .sc_services_item_subtitle a:hover { color: var(--theme-color-alter_text); } &.color_style_link3 .sc_services_item_icon { color: var(--theme-color-alter_link3); } &.color_style_link3 .sc_services_item:hover .sc_services_item_icon { color: var(--theme-color-alter_dark); } &.color_style_link3 .sc_services_item_subtitle, &.color_style_link3 .sc_services_item_subtitle a { color: var(--theme-color-alter_text); } &.color_style_link3 .sc_services_item:hover .sc_services_item_subtitle, &.color_style_link3 .sc_services_item:hover .sc_services_item_subtitle a, &.color_style_link3 .sc_services_item .sc_services_item_subtitle a:hover { color: var(--theme-color-alter_text); } &.color_style_dark .sc_services_item_icon { color: var(--theme-color-alter_dark); } &.color_style_dark .sc_services_item:hover .sc_services_item_icon { color: var(--theme-color-alter_link); } &.color_style_dark.sc_services_item_subtitle, &.color_style_dark .sc_services_item_subtitle a { color: var(--theme-color-alter_text); } &.color_style_dark .sc_services_item:hover .sc_services_item_subtitle, &.color_style_dark .sc_services_item:hover .sc_services_item_subtitle a, &.color_style_dark .sc_services_item .sc_services_item_subtitle a:hover { color: var(--theme-color-alter_text); } } /* Style 'List' */ .sc_services_list { .sc_services_item { color: var(--theme-color-text); background-color: transparent; } .sc_services_item .sc_services_item_icon { color: var(--theme-color-text_link); border-color: var(--theme-color-text_link); } .sc_services_item:hover .sc_services_item_icon { color: var(--theme-color-text_hover); } .sc_services_item_featured_left:hover .sc_services_item_icon, .sc_services_item_featured_right:hover .sc_services_item_icon { color: var(--theme-color-inverse_dark); background-color: var(--theme-color-text_link); border-color: var(--theme-color-text_link); } &.color_style_link2 .sc_services_item_icon { color: var(--theme-color-text_link2); border-color: var(--theme-color-text_link2); } &.color_style_link2 .sc_services_item:hover .sc_services_item_icon { color: var(--theme-color-text_hover2); } &.color_style_link2 .sc_services_item_featured_left:hover .sc_services_item_icon, &.color_style_link2 .sc_services_item_featured_right:hover .sc_services_item_icon { color: var(--theme-color-inverse_dark); background-color: var(--theme-color-text_link2); border-color: var(--theme-color-text_link2); } &.color_style_link3 .sc_services_item_icon { color: var(--theme-color-text_link3); border-color: var(--theme-color-text_link3); } &.color_style_link3 .sc_services_item:hover .sc_services_item_icon { color: var(--theme-color-text_hover3); } &.color_style_link3 .sc_services_item_featured_left:hover .sc_services_item_icon, &.color_style_link3 .sc_services_item_featured_right:hover .sc_services_item_icon { color: var(--theme-color-inverse_dark); background-color: var(--theme-color-text_link3); border-color: var(--theme-color-text_link3); } &.color_style_dark .sc_services_item_icon { color: var(--theme-color-text_dark); border-color: var(--theme-color-text_dark); } &.color_style_dark .sc_services_item:hover .sc_services_item_icon { color: var(--theme-color-text_link); } &.color_style_dark .sc_services_item_featured_left:hover .sc_services_item_icon, &.color_style_dark .sc_services_item_featured_right:hover .sc_services_item_icon { color: var(--theme-color-inverse_dark); background-color: var(--theme-color-text_dark); border-color: var(--theme-color-text_dark); } } /* Style 'Light' */ .sc_services_light .sc_services_item_icon { color: var(--theme-color-text_link); } .sc_services_light .sc_services_item:hover .sc_services_item_icon { color: var(--theme-color-text_hover); } .sc_services_light.color_style_link2 .sc_services_item_icon { color: var(--theme-color-text_link2); } .sc_services_light.color_style_link2 .sc_services_item:hover .sc_services_item_icon { color: var(--theme-color-text_hover2); } .sc_services_light.color_style_link3 .sc_services_item_icon { color: var(--theme-color-text_link3); } .sc_services_light.color_style_link3 .sc_services_item:hover .sc_services_item_icon { color: var(--theme-color-text_hover3); } .sc_services_light.color_style_dark .sc_services_item_icon { color: var(--theme-color-text_dark); } .sc_services_light.color_style_dark .sc_services_item:hover .sc_services_item_icon { color: var(--theme-color-text_link); } .sc_services_callouts .sc_services_item { background-color:var(--theme-color-alter_bg_color); } .sc_services_callouts .sc_services_item_marker { border-color: var(--theme-color-bg_color); background-color:var(--theme-color-alter_link); color: var(--theme-color-inverse_link); } .sc_services_callouts .sc_services_item .sc_services_item_marker_back { border-color: var(--theme-color-bg_color); background-color:var(--theme-color-alter_hover); color: var(--theme-color-inverse_hover); } .sc_services_callouts.color_style_link2 .sc_services_item_marker { background-color:var(--theme-color-alter_link2); } .sc_services_callouts.color_style_link2 .sc_services_item .sc_services_item_marker_back { background-color:var(--theme-color-alter_hover2); } .sc_services_callouts.color_style_link3 .sc_services_item_marker { background-color:var(--theme-color-alter_link3); } .sc_services_callouts.color_style_link3 .sc_services_item .sc_services_item_marker_back { background-color:var(--theme-color-alter_hover3); } .sc_services_callouts.color_style_dark .sc_services_item_marker { background-color:var(--theme-color-alter_dark); } .sc_services_callouts.color_style_dark .sc_services_item .sc_services_item_marker_back { background-color:var(--theme-color-alter_link); } .sc_services_callouts .sc_services_item_marker_bg { border-color: var(--theme-color-bg_color); background-color:var(--theme-color-bg_color); } .sc_services_timeline .sc_services_item_timeline { border-color: var(--theme-color-bd_color); } .sc_services_timeline .sc_services_item_marker { border-color: var(--theme-color-text_link); background-color:var(--theme-color-text_link); color: var(--theme-color-inverse_link); } .sc_services_timeline .sc_services_item:hover .sc_services_item_marker { border-color: var(--theme-color-text_hover); background-color:var(--theme-color-text_hover); color: var(--theme-color-inverse_hover); } .sc_services_timeline.color_style_link2 .sc_services_item_marker { border-color: var(--theme-color-text_link2); background-color:var(--theme-color-text_link2); } .sc_services_timeline.color_style_link2 .sc_services_item:hover .sc_services_item_marker { border-color: var(--theme-color-text_hover2); background-color:var(--theme-color-text_hover2); } .sc_services_timeline.color_style_link3 .sc_services_item_marker { border-color: var(--theme-color-text_link3); background-color:var(--theme-color-text_link3); } .sc_services_timeline.color_style_link3 .sc_services_item:hover .sc_services_item_marker { border-color: var(--theme-color-text_hover3); background-color:var(--theme-color-text_hover3); } .sc_services_timeline.color_style_dark .sc_services_item_marker { border-color: var(--theme-color-text_dark); background-color:var(--theme-color-text_dark); } .sc_services_timeline.color_style_dark .sc_services_item:hover .sc_services_item_marker { border-color: var(--theme-color-text_link); background-color:var(--theme-color-text_link); } .sc_services_timeline { .sc_services_content .sc_services_item { .sc_services_item_title { font-size: 24px; font-weight: 600; line-height: 1.2em; margin: 0; } .sc_services_item_content { font-size: 17px; line-height: 1.6em; margin-top: 15px; } } .sc_services_item { position: relative; z-index: 1; width: calc(25% - 15px); display: inline-block; vertical-align: top; margin: 0; padding: 0 !important; + .sc_services_item { margin-left: 30px; } } .sc_services_item_info { text-align: center; padding: 55px 30px 50px !important; @include box-shadow(0 3px 50px rgba(0,0,0,0.04) !important); @include transition-all(0.3s); .link_wrap { position: absolute; left: 0; top: 0; width: 100%; height: 100%; z-index: 2; } } .extra_row { position: relative; text-align: left; padding: 61px 0 50px 0; .sc_services_item_timeline_point { @include abs-ct(); top: -72px; width: 18px; height: 18px; @include border-radius(50%); background-color: #ffffff; @include transition-all(0.4s); &:before { content: ""; @include abs-cc(); width: 8px; height: 8px; @include border-radius(50%); background-color: #000000; @include transition-all(0.4s); } } .sc_services_item { background-color: var(--theme-color-alter_bg_color); } .sc_services_item:after { content: ''; width: 22px; height: 22px; background-color: transparent; position: absolute; top: 0; left: 50%; bottom: auto; z-index: 1; @include transform(translateX(-50%) rotate(130deg) skew(-10deg)); @include transition-all(0.3s); } .sc_services_item:hover { .sc_services_item_info { @include box-shadow(0 3px 50px rgba(0,0,0,0.1) !important); } .sc_services_item_timeline_point { background-color: var(--theme-color-text_link2_02); &:before { background-color: var(--theme-color-text_link2); } } &:after { top: -8px; background-color: var(--theme-color-alter_bg_color); } } } .extra_row:nth-child(odd) { padding: 0 0 65px 0; text-align: right; .sc_services_item_timeline_point { top: auto; bottom: -72px; } .sc_services_item:after { width: 22px; height: 22px; bottom: 0; top: auto; } .sc_services_item { vertical-align: bottom; &:hover { &:after { bottom: -8px; } } } &:after { content: ""; position: absolute; bottom: 0; left: 0; height: 4px; width: 100%; display: block; background-color:var(--theme-color-bd_color); } } } .sc_services_iconed .sc_services_item { color: var(--theme-color-alter_text); background-color: var(--theme-color-alter_bg_color); } .sc_services_iconed .sc_services_item_icon:hover, .sc_services_iconed .sc_services_item:hover .sc_services_item_icon, .sc_services_iconed .sc_services_item_header .sc_services_item_subtitle a:hover, .sc_services_iconed .sc_services_item:hover .sc_services_item_header .sc_services_item_subtitle a { color: var(--theme-color-text_link); } .sc_services_iconed.color_style_link2 .sc_services_item_icon:hover, .sc_services_iconed.color_style_link2 .sc_services_item:hover .sc_services_item_icon, .sc_services_iconed.color_style_link2 .sc_services_item_header .sc_services_item_subtitle a:hover, .sc_services_iconed.color_style_link2 .sc_services_item:hover .sc_services_item_header .sc_services_item_subtitle a { color: var(--theme-color-text_link2); } .sc_services_iconed.color_style_link3 .sc_services_item_icon:hover, .sc_services_iconed.color_style_link3 .sc_services_item:hover .sc_services_item_icon, .sc_services_iconed.color_style_link3 .sc_services_item_header .sc_services_item_subtitle a:hover, .sc_services_iconed.color_style_link3 .sc_services_item:hover .sc_services_item_header .sc_services_item_subtitle a { color: var(--theme-color-text_link3); } .sc_services_iconed .sc_services_item_header .sc_services_item_title a { color: var(--theme-color-text_link); } .sc_services_iconed.color_style_link2 .sc_services_item_header .sc_services_item_title a { color: var(--theme-color-text_link2); } .sc_services_iconed.color_style_link3 .sc_services_item_header .sc_services_item_title a { color: var(--theme-color-text_link3); } .sc_services_iconed .sc_services_item_header .sc_services_item_title a:hover, .sc_services_iconed .sc_services_item:hover .sc_services_item_header .sc_services_item_title a { color: #fff; } .sc_services_iconed .sc_services_item .sc_services_item_header .sc_services_item_subtitle a { color: #fff; } .sc_services_iconed .sc_services_item:hover .sc_services_item_header .sc_services_item_subtitle a, .sc_services_iconed .sc_services_item .sc_services_item_header .sc_services_item_subtitle a:hover { color: var(--theme-color-text_link); } .sc_services_iconed.color_style_link2 .sc_services_item:hover .sc_services_item_header .sc_services_item_subtitle a, .sc_services_iconed.color_style_link2 .sc_services_item .sc_services_item_header .sc_services_item_subtitle a:hover { color: var(--theme-color-text_link2); } .sc_services_iconed.color_style_link3 .sc_services_item:hover .sc_services_item_header .sc_services_item_subtitle a, .sc_services_iconed.color_style_link3 .sc_services_item .sc_services_item_header .sc_services_item_subtitle a:hover { color: var(--theme-color-text_link3); } .sc_services_iconed .sc_services_item_content .sc_services_item_title a { color: var(--theme-color-alter_dark); } .sc_services_iconed .sc_services_item_content .sc_services_item_title a:hover, .sc_services_iconed .sc_services_item:hover .sc_services_item_content .sc_services_item_title a { color: var(--theme-color-alter_link); } .sc_services_iconed.color_style_link2 .sc_services_item_content .sc_services_item_title a:hover, .sc_services_iconed.color_style_link2 .sc_services_item:hover .sc_services_item_content .sc_services_item_title a { color: var(--theme-color-alter_link2); } .sc_services_iconed.color_style_link3 .sc_services_item_content .sc_services_item_title a:hover, .sc_services_iconed.color_style_link3 .sc_services_item:hover .sc_services_item_content .sc_services_item_title a { color: var(--theme-color-alter_link3); } .sc_services_iconed.color_style_dark .sc_services_item_content .sc_services_item_title a:hover, .sc_services_iconed.color_style_dark .sc_services_item:hover .sc_services_item_content .sc_services_item_title a { color: var(--theme-color-alter_dark); } .sc_services.slider_container .swiper-pagination-bullet { border-color: var(--theme-color-text_light); } .sc_services_list .sc_services_item_featured_left .sc_services_item_number, .sc_services_list .sc_services_item_featured_right .sc_services_item_number { color: var(--theme-color-text_light); } /* Style 'Strange' */ .sc_services_strange { overflow: hidden; .sc_services_item { @include flex; @include flex-direction(column); position: relative; z-index: 1; overflow: hidden; background-color: var(--theme-color-alter_bg_color); @include transition-property(background-color); } .sc_services_item:hover .post_featured.hover_link.with_thumb > .bg_in { @include transform(scale(1.07, 1.07)); } .sc_services_item_header { width: 100%; margin-bottom: 0 !important; @include bg-cover; } .sc_services_item_header:before, .sc_services_item_content:before { content: ' '; display: inline-block; @include box(0, 0); padding-top: 95%; /* 112.5% - 16:9 */ vertical-align: top; margin-left: -0.3em; } .sc_services_item_content { position: relative; z-index: 1; @include border-box; width: 100%; max-height: 100%; overflow: hidden; } .sc_services_item_content_inner { width: 100%; max-height: 100%; position: absolute; z-index: 1; left: 50%; top: 50%; @include transform(translate3d(-50%, -50%, 0)); @include flex; @include flex-direction(column); @include flex-justify-content(flex-start); @include flex-align-items(center); padding: 2.6em 2em; } .sc_services_item_icon { position:relative; display:inline-block; font-size:4em; @include box(auto, auto, 1em); margin-top: 0; will-change: transform, color; @include transform(translateY(0)); @include transition(transform .3s ease-out, color .3s ease); } .sc_services_item:hover .sc_services_item_icon { @include transform(translateY(-8px)); color: var(--theme-color-alter_dark); } .sc_services_item_icon img { @include abs-cc; } .sc_services_item_icon.sc_icon_type_svg svg { @include box(1em, 1em); position:relative; top: 2px; } .sc_services_item_title { @include font(1.556em, 1.214em); } .sc_services_item_icon + .sc_services_item_title { margin-top: 1.1em; } .sc_services_item_text { @include font(17px, 1.65em); text-align: center; max-height: 4.85em; overflow: hidden; } .sc_services_item_text p:last-child { margin-bottom: 0; } .sc_services_item_subtitle, .sc_services_item_subtitle a { color: var(--theme-color-alter_text); } .sc_services_item_title + .sc_services_item_subtitle { margin-top: 0.45em; } .sc_services_item .sc_services_item_title, .sc_services_item .sc_services_item_title a { color: var(--theme-color-alter_dark); } .sc_services_item:hover .sc_services_item_title, .sc_services_item:hover .sc_services_item_title a, .sc_services_item .sc_services_item_title a:hover { color: var(--theme-color-alter_dark); } .sc_services_item_title { margin: 0; text-align: center; } .sc_services_item_title + .sc_services_item_text, .sc_services_item_subtitle + .sc_services_item_text { margin-top: 0.8em; } .sc_services_item .sc_services_item_button { margin: 1.6em 0 0; } .sc_services_item .sc_services_item_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-alter_dark); z-index: 1; overflow: hidden; } .sc_services_item:hover .sc_services_item_more_link, .sc_services_item .sc_services_item_more_link:hover { color: var(--theme-color-alter_dark); } .sc_services_item .sc_services_item_more_link .link_text { display: inline-block; position: relative; margin-right: 0; vertical-align: middle; text-indent: -110px; visibility: hidden; white-space: nowrap; opacity: 0; @include transition(visibility .4s ease, margin-right .4s ease-out, text-indent .5s ease-out, opacity .4s ease); will-change: visibility, margin-right, text-indent, opacity; } .sc_services_item:hover .sc_services_item_more_link .link_text, .sc_services_item .sc_services_item_more_link:hover .link_text { opacity: 1; text-indent: 0; margin-right: 10px; visibility: visible; @include transition(visibility .4s ease, margin-right .3s ease-out, text-indent .4s ease-out, opacity .4s ease); } .sc_services_item .sc_services_item_more_link .link_icon { position: relative; display: inline-block; vertical-align: middle; overflow: hidden; @include box(1.4em, 1.4em, 1.4em); text-align: center; @include border-box; } .sc_services_item .sc_services_item_more_link .link_icon:before { @include font(11px, inherit, 400, inherit); content: '\E9A4'; font-family: $theme_icons; display: inline-block; vertical-align: top; color: currentColor; } .sc_services_slider .slider-slide:nth-child(2n) .sc_services_item .sc_services_item_header, .sc_services_columns_wrap [class*="trx_addons_column-1_2"]:nth-child(2n) .sc_services_item .sc_services_item_header, .sc_services_columns_wrap [class*="trx_addons_column-1_4"]:nth-child(2n) .sc_services_item .sc_services_item_header, .sc_services_columns_wrap [class*="trx_addons_column-1_6"]:nth-child(2n) .sc_services_item .sc_services_item_header { order: 2; } .sc_services_slider .slider-slide:nth-child(2n) .sc_services_item .sc_services_item_content, .sc_services_columns_wrap [class*="trx_addons_column-1_2"]:nth-child(2n) .sc_services_item .sc_services_item_content, .sc_services_columns_wrap [class*="trx_addons_column-1_4"]:nth-child(2n) .sc_services_item .sc_services_item_content, .sc_services_columns_wrap [class*="trx_addons_column-1_6"]:nth-child(2n) .sc_services_item .sc_services_item_content { order: 1; } .sc_services_columns_wrap [class*="trx_addons_column-1_3"]:nth-child(3n-1) .sc_services_item .sc_services_item_header { order: 2; } .sc_services_columns_wrap [class*="trx_addons_column-1_3"]:nth-child(3n-1) .sc_services_item .sc_services_item_content { order: 1; } .sc_services_columns_wrap [class*="trx_addons_column-1_5"]:nth-child(2) .sc_services_item .sc_services_item_header, .sc_services_columns_wrap [class*="trx_addons_column-1_5"]:nth-child(4) .sc_services_item .sc_services_item_header, .sc_services_columns_wrap [class*="trx_addons_column-1_5"]:nth-child(7) .sc_services_item .sc_services_item_header, .sc_services_columns_wrap [class*="trx_addons_column-1_5"]:nth-child(9) .sc_services_item .sc_services_item_header, .sc_services_columns_wrap [class*="trx_addons_column-1_5"]:nth-child(12) .sc_services_item .sc_services_item_header { order: 2; } .sc_services_columns_wrap [class*="trx_addons_column-1_5"]:nth-child(2) .sc_services_item .sc_services_item_content, .sc_services_columns_wrap [class*="trx_addons_column-1_5"]:nth-child(4) .sc_services_item .sc_services_item_content, .sc_services_columns_wrap [class*="trx_addons_column-1_5"]:nth-child(7) .sc_services_item .sc_services_item_content, .sc_services_columns_wrap [class*="trx_addons_column-1_5"]:nth-child(9) .sc_services_item .sc_services_item_content, .sc_services_columns_wrap [class*="trx_addons_column-1_5"]:nth-child(12) .sc_services_item .sc_services_item_content { order: 1; } .sc_item_columns_5 .sc_services_item_content_inner, .sc_item_columns_6 .sc_services_item_content_inner { padding: 1.5em; } .sc_item_columns_5 .sc_services_item_title, .sc_item_columns_6 .sc_services_item_title { @include font(1.2em, 1.114em); } .sc_item_columns_5 .sc_services_item_text, .sc_item_columns_6 .sc_services_item_text { display: none; } .sc_item_columns_5 .sc_services_item_icon, .sc_item_columns_6 .sc_services_item_icon { font-size: 3em; } .sc_item_columns_5 .sc_services_item_button, .sc_item_columns_6 .sc_services_item_button { display: none; } } /* Style 'Hover' +++++++++++++++++++++++ */ .sc_services_hover { @include transform (translateZ(0)); .sc_services_item { @include flex; position:relative; z-index: 1; text-align:center; -webkit-transform-style: preserve-3d; transform-style: preserve-3d; perspective: none; @include backface-hidden; } .sc_services_item:hover { z-index: 10; } .sc_services_item:before { content: ' '; @include box(0, 0); padding-top: 98%; display:inline-block; } .sc_services_item_link { @include abs-cover(10); @include transform(translateZ(60px)); } .sc_services_item_content, .sc_services_item:hover .sc_services_item_content { @include transform(none); @include transition(none); } .sc_services_item_content { position: relative; z-index: 1; top: auto; left: auto; bottom: auto; right: auto; @include flex; @include bg-cover; @include backface-hidden; background-color: #05080d; -webkit-transform-style: preserve-3d; transform-style: preserve-3d; width: 100%; max-height:100%; } .sc_services_item.with_image .sc_services_item_content:before, .sc_services_item.with_image:hover .sc_services_item_content:before { content: ' '; @include bg-mask(#05080d, 0.35, -1); @include transition-property(background-color); } .sc_services_item_content_inner { position: relative; top: auto; left: auto; @include flex; @include flex-direction(column); @include flex-justify-content(center); @include flex-align-items(center); @include border-box; width: 100%; max-height:100%; overflow:hidden; padding: 2em; @include transform(translateZ(60px) scale(0.95)); } .sc_services_item_icon, .sc_services_item_pictogram { position: relative; display: inline-block; @include font(4em, 1em); } .sc_services_item_icon.sc_icon_type_svg svg { @include box(1em, 1em); } .sc_services_item_number { display: inline-block; @include font(4em, 1em, 600); } .sc_services_item_title { @include font(1.556em, 1.2em, 600); margin: 0; } .sc_services_item_content .sc_services_item_title { margin: 1em 0 0; } .sc_services_item_featured_none .sc_services_item_content .sc_services_item_title { margin-top: 0; } .sc_services_item_title + .sc_services_item_subtitle { margin-top:0.2em; } .sc_services_item_title + .sc_services_item_text, .sc_services_item_subtitle + .sc_services_item_text { margin-top:0.4em; } .sc_services_item_price { @include font(1.5em, '', 600); text-shadow: none; margin-top:0.6em; } .sc_services_item_text { @include font(17px, 1.5em); max-height: none; } .sc_services_item_content p { margin:0; } .sc_services_item_content p + p { margin-top:0.2em; } .sc_services_item.with_image .sc_services_item_content.without_image:before { display:none; } .sc_services_item_price, .sc_services_item_price .amount, .sc_services_item_icon, .sc_services_item_number { color: #ffffff !important; } .sc_services_item_title, .sc_services_item_title a { color: #ffffff !important; } .sc_services_item_title a:hover { color: #ffffff !important; } .sc_services_item_subtitle, .sc_services_item_subtitle a { color: #ffffff !important; } .sc_services_item_subtitle a:hover { color: #ffffff !important; } .sc_services_item_content { color: #ffffff !important; } .sc_services_item_text { color: rgba(255,255,255,.8); } &.color_style_link2 .sc_services_item_icon { color: var(--theme-color-text_link2) !important; } &.color_style_link2 .sc_services_item_title a:hover, &.color_style_link2 .sc_services_item_subtitle a:hover { color: var(--theme-color-inverse_link) !important; } &.color_style_link3 .sc_services_item_icon { color: var(--theme-color-text_link3) !important; } &.color_style_link3 .sc_services_item_title a:hover, &.color_style_link3 .sc_services_item_subtitle a:hover { color: var(--theme-color-inverse_link) !important; } [class*="column-"] .sc_services_item.with_image .sc_services_item_content.without_image, .slider-slide .sc_services_item.with_image .sc_services_item_content.without_image { background-color: var(--theme-color-text_link_007); } [class*="column-"]:nth-child(3n-1) .sc_services_item.with_image .sc_services_item_content.without_image, .slider-slide:nth-child(3n-1) .sc_services_item.with_image .sc_services_item_content.without_image { background-color: var(--theme-color-text_link2_007); } [class*="column-"]:nth-child(3n) .sc_services_item.with_image .sc_services_item_content.without_image, .slider-slide:nth-child(3n) .sc_services_item.with_image .sc_services_item_content.without_image { background-color: var(--theme-color-text_link3_007); } .sc_services_item.with_image .sc_services_item_content.without_image .sc_services_item_icon, .sc_services_item.with_image .sc_services_item_content.without_image .sc_services_item_number { color: var(--theme-color-text_dark) !important; } .sc_services_item.with_image .sc_services_item_content.without_image .sc_services_item_title, .sc_services_item.with_image .sc_services_item_content.without_image .sc_services_item_title a { color: var(--theme-color-text_dark) !important; } .sc_services_item.with_image:hover .sc_services_item_content.without_image .sc_services_item_title a, .sc_services_item.with_image .sc_services_item_content.without_image .sc_services_item_title a:hover { color: var(--theme-color-text_dark) !important; } &.color_style_link2 .sc_services_item.with_image:hover .sc_services_item_content.without_image .sc_services_item_title a, &.color_style_link2 .sc_services_item.with_image .sc_services_item_content.without_image .sc_services_item_title a:hover { color: var(--theme-color-text_dark) !important; } &.color_style_link3 .sc_services_item.with_image:hover .sc_services_item_content.without_image .sc_services_item_title a, &.color_style_link3 .sc_services_item.with_image .sc_services_item_content.without_image .sc_services_item_title a:hover { color: var(--theme-color-text_dark) !important; } .sc_services_item.with_image .sc_services_item_content.without_image .sc_services_item_subtitle, .sc_services_item.with_image .sc_services_item_content.without_image .sc_services_item_subtitle a { color: var(--theme-color-text_dark) !important; } &.color_style_link2 .sc_services_item.with_image .sc_services_item_content.without_image .sc_services_item_subtitle, &.color_style_link2 .sc_services_item.with_image .sc_services_item_content.without_image .sc_services_item_subtitle a { color: var(--theme-color-text_dark) !important; } &.color_style_link3 .sc_services_item.with_image .sc_services_item_content.without_image .sc_services_item_subtitle, &.color_style_link3 .sc_services_item.with_image .sc_services_item_content.without_image .sc_services_item_subtitle a { color: var(--theme-color-text_dark) !important; } .sc_services_item.with_image:hover .sc_services_item_content.without_image .sc_services_item_subtitle a, .sc_services_item.with_image .sc_services_item_content.without_image .sc_services_item_subtitle a:hover { color: var(--theme-color-text_dark) !important; } &.color_style_link2 .sc_services_item.with_image:hover .sc_services_item_content.without_image .sc_services_item_subtitle a, &.color_style_link2 .sc_services_item.with_image .sc_services_item_content.without_image .sc_services_item_subtitle a:hover { color: var(--theme-color-text_dark) !important; } &.color_style_link3 .sc_services_item.with_image:hover .sc_services_item_content.without_image .sc_services_item_subtitle a, &.color_style_link3 .sc_services_item.with_image .sc_services_item_content.without_image .sc_services_item_subtitle a:hover { color: var(--theme-color-text_dark) !important; } .sc_services_item.with_image .sc_services_item_content.without_image .sc_services_item_text { color: var(--theme-color-text) !important; } } /* Style Simple */ .sc_services_tabs_simple .sc_services_item_icon { color: var(--theme-color-text_link); } .sc_services_tabs_simple.color_style_link2 .sc_services_item_icon { color: var(--theme-color-text_link2); } .sc_services_tabs_simple.color_style_link3 .sc_services_item_icon { color: var(--theme-color-text_link3); } .sc_services_tabs_simple.color_style_dark .sc_services_item_icon { color: var(--theme-color-text_dark); } .sc_services_tabs_simple .sc_services_item:hover .sc_services_item_icon, .sc_services_tabs_simple .sc_services_item:hover .sc_services_item_title, .sc_services_tabs_simple .sc_services_item:hover .sc_services_item_subtitle, .sc_services_tabs_simple .sc_services_tabs_list_item.sc_services_tabs_list_item_active .sc_services_item_icon, .sc_services_tabs_simple .sc_services_tabs_list_item.sc_services_tabs_list_item_active .sc_services_item_title, .sc_services_tabs_simple .sc_services_tabs_list_item.sc_services_tabs_list_item_active .sc_services_item_subtitle { color: var(--theme-color-text_hover); } .sc_services_tabs_simple.color_style_link2 .sc_services_item:hover .sc_services_item_icon, .sc_services_tabs_simple.color_style_link2 .sc_services_item:hover .sc_services_item_title, .sc_services_tabs_simple.color_style_link2 .sc_services_item:hover .sc_services_item_subtitle, .sc_services_tabs_simple.color_style_link2 .sc_services_tabs_list_item.sc_services_tabs_list_item_active .sc_services_item_icon, .sc_services_tabs_simple.color_style_link2 .sc_services_tabs_list_item.sc_services_tabs_list_item_active .sc_services_item_title, .sc_services_tabs_simple.color_style_link2 .sc_services_tabs_list_item.sc_services_tabs_list_item_active .sc_services_item_subtitle { color: var(--theme-color-text_hover2); } .sc_services_tabs_simple.color_style_link3 .sc_services_item:hover .sc_services_item_icon, .sc_services_tabs_simple.color_style_link3 .sc_services_item:hover .sc_services_item_title, .sc_services_tabs_simple.color_style_link3 .sc_services_item:hover .sc_services_item_subtitle, .sc_services_tabs_simple.color_style_link3 .sc_services_tabs_list_item.sc_services_tabs_list_item_active .sc_services_item_icon, .sc_services_tabs_simple.color_style_link3 .sc_services_tabs_list_item.sc_services_tabs_list_item_active .sc_services_item_title, .sc_services_tabs_simple.color_style_link3 .sc_services_tabs_list_item.sc_services_tabs_list_item_active .sc_services_item_subtitle { color: var(--theme-color-text_hover3); } .sc_services_tabs .sc_services_item_content { color:var(--theme-color-alter_text); background-color:var(--theme-color-alter_bg_color); } .sc_services_tabs .sc_services_item_title a { color:var(--theme-color-alter_dark); } .sc_services_tabs .sc_services_item_title a:hover { color:var(--theme-color-alter_link); } .sc_services_tabs.color_style_link2 .sc_services_item_title a:hover { color:var(--theme-color-alter_link2); } .sc_services_tabs.color_style_link3 .sc_services_item_title a:hover { color:var(--theme-color-alter_link3); } .sc_services_tabs .sc_services_tabs_list_item .sc_services_item_icon { color: var(--theme-color-alter_link); } .sc_services_tabs.color_style_link2 .sc_services_tabs_list_item .sc_services_item_icon { color: var(--theme-color-alter_link2); } .sc_services_tabs.color_style_link3 .sc_services_tabs_list_item .sc_services_item_icon { color: var(--theme-color-alter_link3); } .sc_services_tabs .sc_services_tabs_list_item .sc_services_item_number { color: var(--theme-color-alter_light); } .sc_services_tabs .sc_services_tabs_list_item { background-color:var(--theme-color-alter_bg_color); } .sc_services_tabs .sc_services_tabs_list_item:nth-child(2n+2) { background-color:var(--theme-color-alter_bg_hover); } .sc_services_tabs .sc_services_tabs_list_item:hover, .sc_services_tabs .sc_services_tabs_list_item:nth-child(2n+2):hover { background-color:var(--theme-color-alter_bd_hover); } .sc_services_tabs .sc_services_tabs_list_item .sc_services_item_title { color:var(--theme-color-alter_dark); } .sc_services_tabs .sc_services_tabs_list_item:hover .sc_services_item_title { color:var(--theme-color-alter_link); } .sc_services_tabs.color_style_link2 .sc_services_tabs_list_item:hover .sc_services_item_title { color:var(--theme-color-alter_link2); } .sc_services_tabs.color_style_link3 .sc_services_tabs_list_item:hover .sc_services_item_title { color:var(--theme-color-alter_link3); } .sc_services_tabs.color_style_dark .sc_services_tabs_list_item:hover .sc_services_item_title { color:var(--theme-color-alter_dark); } .sc_services_tabs .sc_services_tabs_list_item:hover .sc_services_item_icon { color:var(--theme-color-alter_hover); } .sc_services_tabs.color_style_link2 .sc_services_tabs_list_item:hover .sc_services_item_icon { color:var(--theme-color-alter_hover2); } .sc_services_tabs.color_style_link3 .sc_services_tabs_list_item:hover .sc_services_item_icon { color:var(--theme-color-alter_hover3); } .sc_services_tabs.color_style_dark .sc_services_tabs_list_item:hover .sc_services_item_icon { color:var(--theme-color-alter_dark); } .sc_services_tabs .sc_services_tabs_list_item:hover .sc_services_item_number { color: var(--theme-color-alter_text); } .sc_services_tabs .sc_services_tabs_list_item.sc_services_tabs_list_item_active { background-color:var(--theme-color-alter_dark) !important; } .sc_services_tabs .sc_services_tabs_list_item.sc_services_tabs_list_item_active .sc_services_item_title { color: var(--theme-color-bg_color); } .sc_services_tabs .sc_services_tabs_list_item.sc_services_tabs_list_item_active .sc_services_item_icon, .sc_services_tabs .sc_services_tabs_list_item.sc_services_tabs_list_item_active .sc_services_item_number { color: var(--theme-color-alter_link); } .sc_services_tabs.color_style_link2 .sc_services_tabs_list_item.sc_services_tabs_list_item_active .sc_services_item_icon, .sc_services_tabs.color_style_link2 .sc_services_tabs_list_item.sc_services_tabs_list_item_active .sc_services_item_number { color: var(--theme-color-alter_link2); } .sc_services_tabs.color_style_link3 .sc_services_tabs_list_item.sc_services_tabs_list_item_active .sc_services_item_icon, .sc_services_tabs.color_style_link3 .sc_services_tabs_list_item.sc_services_tabs_list_item_active .sc_services_item_number { color: var(--theme-color-alter_link3); } .sc_services_tabs.color_style_dark .sc_services_tabs_list_item.sc_services_tabs_list_item_active .sc_services_item_icon, .sc_services_tabs.color_style_dark .sc_services_tabs_list_item.sc_services_tabs_list_item_active .sc_services_item_number { color: var(--theme-color-alter_dark); } /* Style Modern */ .sc_services_modern { &.sc_services_featured_top .swiper-wrapper .sc_services_item_thumb { margin-top: 14px; } .sc_services_item { margin-bottom: 2em; text-align:center; padding-top:0.0001px; } &.slider_swiper .sc_services_item, .columns_padding_bottom .sc_services_item { margin-bottom:0; } .sc_services_item_thumb { overflow: visible; margin: 0 auto; @include border-radius(50%); width: 60%; } .sc_services_item_link { @include abs-cover(10); } .post_featured_bg .post_thumb { display: block; width: 100%; height: 100%; position: absolute; z-index: 2; top: 0; left: 0; overflow: hidden; background-repeat: no-repeat; background-size: cover; background-position: center; @include border-radius(50%); } .post_featured_bg:before { padding-top: 100%; } .post_featured > .sc_services_item_price, .post_featured > p > .sc_services_item_price { @include abs-cb(1em, 2); @include transition(transform .3s ease); } .sc_services_item:hover .post_featured > .sc_services_item_price, .sc_services_item:hover .post_featured > p > .sc_services_item_price { @include transform(translateX(0)); } .sc_services_item_thumb .all-svg { @include abs-cc(); width: 100%; height: 100%; z-index: 1; span { display: inline-block; line-height: 0; opacity: 0; @include transition(transform .3s ease-out, opacity .3s ease-out); will-change: transform; } .svg-1 { position: absolute; top: 0; right: 0; @include transform(translate3d(-40px, 40px, 0)); svg { width: 100px; height: 100px; fill: var(--theme-color-text_dark); opacity: 0.1; } } .svg-2 { position: absolute; left: 0; bottom: 0; @include transform(translate3d(25px, -25px, 0)); svg { width: 88px; height: 88px; fill: transparent; stroke: var(--theme-color-text_link); stroke-width: 12px; } } } .sc_services_item:hover { .all-svg { .svg-1 { opacity: 1; @include transform(translate3d(30px,-10px,0)); } .svg-2 { opacity: 1; @include transform(translate3d(-20px,5px,0)); } } } .sc_services_item_thumb[class*="hover_"] { display: block; } .sc_services_item_thumb img { @include border-radius(50%); overflow: hidden; width: 100%; position: relative; z-index: 2; } .sc_services_item_icon, .sc_services_item_pictogram { position:relative; display:inline-block; font-size:4em; @include box(auto, auto, 1em); } .sc_services_item_icon img { @include abs-cc; } .sc_services_item_icon.sc_icon_type_svg svg { @include box(1em, 1em); position:relative; top: 2px; } .sc_services_item_pictogram { border: none; width: auto; } .sc_services_item_number { display:inline-block; text-align:center; @include font(5em, 1em, 400); } .sc_services_item_featured_top .sc_services_item_pictogram + .sc_services_item_info, .sc_services_item_featured_top .sc_services_item_icon + .sc_services_item_info, .sc_services_item_featured_top .sc_services_item_number + .sc_services_item_info { margin-top: 1.5em; } .sc_services_item_info { padding: 0; text-align:center; } .sc_services_item_title { margin: 0; } .sc_services_item_title, .sc_services_item_title a { color: var(--theme-color-text_dark); } .sc_services_item_subtitle, .sc_services_item_subtitle a { color: var(--theme-color-text); } .sc_services_item_subtitle + .sc_services_item_title { margin-top: 0.45em; } .sc_services_item_content { @include font(17px, 1.62em); margin-top:0.8em; } .sc_services_item_content p:last-child { margin-bottom: 0; } .sc_services_item_button { margin:1.5em 0 0; } &.sc_services_featured_top .sc_services_item_thumb { margin-bottom: 1.9em; } &.sc_services_featured_top .post_featured_bg .post_thumb { @include transform(none); @include transition(transform .3s ease-out); will-change: transform; } &.sc_services_featured_top .sc_services_item:hover .post_thumb { @include transform(scale3d(1.05, 1.05, 1.05)); } .sc_services_item_featured_left, .sc_services_item_featured_right { position: relative; overflow: hidden; background-color: transparent; &.with_number { min-height: 2.8em; } } .sc_services_item_featured_left { text-align: left; } .sc_services_item_featured_right { text-align: right; } .sc_services_item_featured_left .sc_services_item_number, .sc_services_item_featured_right .sc_services_item_number { @include font(3em, 1em); margin-top: 0; @include abs-lt(0, -5px); } .sc_services_item_featured_left .sc_services_item_icon, .sc_services_item_featured_right .sc_services_item_icon { font-size:3.4em; margin-top: 0; @include abs-lt; } .sc_services_item_featured_right .sc_services_item_thumb, .sc_services_item_featured_right .sc_services_item_icon, .sc_services_item_featured_right .sc_services_item_pictogram, .sc_services_item_featured_right .sc_services_item_number { left: auto; right: 0; } .sc_services_item_featured_left.without_content .sc_services_item_icon, .sc_services_item_featured_right.without_content .sc_services_item_icon { font-size:1.5em; } .sc_services_item_featured_left .sc_services_item_pictogram, .sc_services_item_featured_right .sc_services_item_pictogram { font-size:3.4em; margin-top: 0; @include abs-lt; width: 3.4em; height: auto; } .sc_services_item_featured_left.without_content .sc_services_item_pictogram, .sc_services_item_featured_right.without_content .sc_services_item_pictogram { font-size:1.5em; } .sc_services_item_featured_left .sc_services_item_thumb, .sc_services_item_featured_right .sc_services_item_thumb { width:30%; @include abs-lt; } .sc_services_item_featured_left .sc_services_item_content, .sc_services_item_featured_right .sc_services_item_content { min-height:0; } .sc_services_item_featured_left .sc_services_item_info { text-align:left; padding:0; margin-left: 5em; } .sc_services_item_featured_left.with_image .sc_services_item_info { padding-left: 2em; margin-left: 30%; } .sc_services_item_featured_right .sc_services_item_thumb, .sc_services_item_featured_right .sc_services_item_icon, .sc_services_item_featured_right .sc_services_item_pictogram, .sc_services_item_featured_right .sc_services_item_number { left: auto; right: 0; } .sc_services_item_featured_right .sc_services_item_info { text-align:right; padding: 0; margin-right: 5em; } .sc_services_item_featured_right.with_image .sc_services_item_info { padding-right: 2em; margin-right: 30%; } .trx_addons_hover_content .trx_addons_hover_title { font-size: 1.3333em; } .sc_services_item .sc_button_arrow { position: relative; display: inline-block; @include box(2.8em, 2.8em, 2.85em); text-align: center; color: var(--theme-color-text_dark); background-color: var(--theme-color-text_dark_008); border: none; @include border-box; @include border-radius(50%); @include transition(color .3s ease, background-color .3s ease, box-shadow .3s ease-out); @include box-shadow(none); } .sc_services_item .sc_button_arrow:before { content: '\E9A4'; font-family: $theme_icons; letter-spacing: 1px; @include font(12px, '', 400); @include abs-cc; } .sc_services_item:hover .sc_button_arrow, .sc_services_item .sc_button_arrow:hover { color: var(--theme-color-inverse_link); background-color: var(--theme-color-text_link); @include box-shadow(0 5px 16px var(--theme-color-text_link_02)) } &.color_style_link2 .sc_services_item:hover .sc_button_arrow, &.color_style_link2 .sc_services_item .sc_button_arrow:hover { background-color: var(--theme-color-text_link2); @include box-shadow(0 5px 16px var(--theme-color-text_link2_02)) } &.color_style_link2 .sc_services_item_title a:hover { color: var(--theme-color-text_dark); } &.color_style_link3 .sc_services_item:hover .sc_button_arrow, &.color_style_link3 .sc_services_item .sc_button_arrow:hover { background-color: var(--theme-color-text_link3); @include box-shadow(0 5px 16px var(--theme-color-text_link3_02)) } &.color_style_link3 .sc_services_item_title a:hover { color: var(--theme-color-text_dark); } &.color_style_dark .sc_services_item:hover .sc_button_arrow, &.color_style_dark .sc_services_item .sc_button_arrow:hover { color: var(--theme-color-inverse_hover); background-color: var(--theme-color-text_dark); @include box-shadow(0 5px 16px var(--theme-color-text_dark_02)) } &.color_style_dark .sc_services_item_title a:hover { color: var(--theme-color-text_dark); } } /* Style 'Breezy' +++++++++++++++++++++++ */ .sc_services_breezy { .sc_services_item { position: relative; z-index: 1; text-align: center; &:before { content: ' '; @include box(0, 0); padding-top: 98%; display:inline-block; } } .sc_services_item_link { @include abs-cover(10); } .sc_services_item_content { @include flex; @include bg-mask(#05080d, 1, 1); @include bg-cover; } .sc_services_item.with_image .sc_services_item_content:before { content: ' '; @include abs-pos; z-index: -1; background: -moz-linear-gradient(top, rgba(0,0,0,0) 0%, rgba(0,0,0,1) 100%); background: -webkit-linear-gradient(top, rgba(0,0,0,0) 0%,rgba(0,0,0,1) 100%); background: linear-gradient(to bottom, rgba(0,0,0,0) 0%,rgba(0,0,0,1) 100%); opacity: .6; @include transition(opacity .3s ease); will-change: opacity; } .sc_services_item.with_image:hover .sc_services_item_content:before { opacity: 0; } .sc_services_item.with_image .sc_services_item_content:after { content: ' '; @include abs-pos; z-index: -1; background-color: var(--theme-color-text_link); opacity: 0; @include transition(opacity .3s ease); will-change: opacity; } .sc_services_item.with_image:hover .sc_services_item_content:after { opacity: .7; } .sc_services_item.with_image .sc_services_item_content.without_image:before, .sc_services_item.with_image .sc_services_item_content.without_image:after { display: none; } .sc_services_item_content_inner { position: relative; z-index: 1; @include flex; @include flex-direction(column); @include flex-justify-content(flex-end); @include flex-align-items(center); @include border-box; width: 100%; max-height: 100%; overflow: hidden; padding: 2.6em 2em; } .trx_addons_column-1_5, .trx_addons_column-1_6, .trx_addons_column-1_7, .trx_addons_column-1_8 { .sc_services_item_content_inner { padding: 1em; .sc_services_item_title { font-size: 1.1em; } } } .sc_services_item_icon, .sc_services_item_pictogram { position: relative; display: inline-block; @include font(4em, 1em); } .sc_services_item_icon.sc_icon_type_svg svg { @include box(1em, 1em); } .sc_services_item_number { display: inline-block; @include font(4em, 1em, 600); } .sc_services_item_title { @include font(1.556em, 1.3em, 600); margin: 0.4em 0 0; } .sc_services_item_featured_none .sc_services_item_title { margin-top: 0; } .sc_services_item_title + .sc_services_item_subtitle { margin-top:0.2em; } .sc_services_item_title + .sc_services_item_text, .sc_services_item_subtitle + .sc_services_item_text { margin-top:0.4em; } .sc_services_item_price { @include font(1.5em, '', 600); margin-top:0.6em; } .sc_services_item_text { @include font(17px, 1.5em); max-height: 4.8em; overflow: hidden; } .sc_services_item_content p { margin:0; } .sc_services_item_content p + p { margin-top:0.2em; } .sc_services_item .sc_services_item_icon { color: var(--theme-color-text_link); } .sc_services_item:hover .sc_services_item_icon { color: var(--theme-color-inverse_link); } .sc_services_item_price, .sc_services_item_price .amount, .sc_services_item_number { color: #ffffff !important; } .sc_services_item_title, .sc_services_item_title a { color: #ffffff !important; } .sc_services_item_title a:hover { color: #ffffff !important; } .sc_services_item_subtitle, .sc_services_item_subtitle a { color: #ffffff !important; } .sc_services_item_subtitle a:hover { color: #ffffff !important; } .sc_services_item_content { color: #ffffff !important; } .sc_services_item_text { color: rgba(255,255,255,.8) !important; } [class*="column-"] .sc_services_item.with_image .sc_services_item_content.without_image, .slider-slide .sc_services_item.with_image .sc_services_item_content.without_image { background-color: var(--theme-color-text_link_007); } [class*="column-"]:nth-child(3n-1) .sc_services_item.with_image .sc_services_item_content.without_image, .slider-slide:nth-child(3n-1) .sc_services_item.with_image .sc_services_item_content.without_image { background-color: var(--theme-color-text_link2_007); } [class*="column-"]:nth-child(3n) .sc_services_item.with_image .sc_services_item_content.without_image, .slider-slide:nth-child(3n) .sc_services_item.with_image .sc_services_item_content.without_image { background-color: var(--theme-color-text_link3_007); } .sc_services_item.with_image .sc_services_item_content.without_image .sc_services_item_price, .sc_services_item.with_image .sc_services_item_content.without_image .sc_services_item_price .amount, .sc_services_item.with_image .sc_services_item_content.without_image .sc_services_item_number { color: var(--theme-color-text_dark) !important; } .sc_services_item.with_image .sc_services_item_content.without_image .sc_services_item_icon, .sc_services_item.with_image:hover .sc_services_item_content.without_image .sc_services_item_icon, .sc_services_item.with_image .sc_services_item_content.without_image .sc_services_item_number { color: var(--theme-color-text_dark) !important; } .sc_services_item.with_image .sc_services_item_content.without_image .sc_services_item_title, .sc_services_item.with_image .sc_services_item_content.without_image .sc_services_item_title a { color: var(--theme-color-text_dark) !important; } .sc_services_item.with_image:hover .sc_services_item_content.without_image .sc_services_item_title a, .sc_services_item.with_image .sc_services_item_content.without_image .sc_services_item_title a:hover { color: var(--theme-color-text_dark) !important; } .sc_services_item.with_image .sc_services_item_content.without_image .sc_services_item_subtitle, .sc_services_item.with_image .sc_services_item_content.without_image .sc_services_item_subtitle a { color: var(--theme-color-text_dark) !important; } .sc_services_item.with_image:hover .sc_services_item_content.without_image .sc_services_item_subtitle a, .sc_services_item.with_image .sc_services_item_content.without_image .sc_services_item_subtitle a:hover { color: var(--theme-color-text_dark) !important; } .sc_services_item.with_image .sc_services_item_content.without_image .sc_services_item_text { color: var(--theme-color-text) !important; } &.color_style_link2 .sc_services_item .sc_services_item_icon { color: var(--theme-color-text_link2); } &.color_style_link2 .sc_services_item:hover .sc_services_item_icon { color: var(--theme-color-inverse_link); } &.color_style_link2 .sc_services_item_title a:hover, &.color_style_link2 .sc_services_item_subtitle a:hover { color: var(--theme-color-inverse_link) !important; } &.color_style_link2 .sc_services_item.with_image:hover .sc_services_item_content.without_image .sc_services_item_title a, &.color_style_link2 .sc_services_item.with_image .sc_services_item_content.without_image .sc_services_item_title a:hover { color: var(--theme-color-text_dark) !important; } &.color_style_link2 .sc_services_item.with_image .sc_services_item_content.without_image .sc_services_item_subtitle, &.color_style_link2 .sc_services_item.with_image .sc_services_item_content.without_image .sc_services_item_subtitle a { color: var(--theme-color-text_dark) !important; } &.color_style_link2 .sc_services_item.with_image:hover .sc_services_item_content.without_image .sc_services_item_subtitle a, &.color_style_link2 .sc_services_item.with_image .sc_services_item_content.without_image .sc_services_item_subtitle a:hover { color: var(--theme-color-text_dark) !important; } &.color_style_link2 .sc_services_item.with_image .sc_services_item_content:after { background-color: var(--theme-color-text_link2); } &.color_style_link3 .sc_services_item .sc_services_item_icon { color: var(--theme-color-text_link3); } &.color_style_link3 .sc_services_item:hover .sc_services_item_icon { color: var(--theme-color-inverse_link); } &.color_style_link3 .sc_services_item_title a:hover, &.color_style_link3 .sc_services_item_subtitle a:hover { color: var(--theme-color-inverse_link) !important; } &.color_style_link3 .sc_services_item.with_image:hover .sc_services_item_content.without_image .sc_services_item_title a, &.color_style_link3 .sc_services_item.with_image .sc_services_item_content.without_image .sc_services_item_title a:hover { color: var(--theme-color-text_dark) !important; } &.color_style_link3 .sc_services_item.with_image .sc_services_item_content.without_image .sc_services_item_subtitle, &.color_style_link3 .sc_services_item.with_image .sc_services_item_content.without_image .sc_services_item_subtitle a { color: var(--theme-color-text_dark) !important; } &.color_style_link3 .sc_services_item.with_image:hover .sc_services_item_content.without_image .sc_services_item_subtitle a, &.color_style_link3 .sc_services_item.with_image .sc_services_item_content.without_image .sc_services_item_subtitle a:hover { color: var(--theme-color-text_dark) !important; } &.color_style_link3 .sc_services_item.with_image .sc_services_item_content:after { background-color: var(--theme-color-text_link3); } &.color_style_dark .sc_services_item.with_image .sc_services_item_content:after { background-color: #000000; } &.color_style_dark .sc_services_item .sc_services_item_icon { color: var(--theme-color-text_link); } &.color_style_dark .sc_services_item:hover .sc_services_item_icon { color: var(--theme-color-inverse_link); } } /* Style 'Cool' +++++++++++++++++++++++ */ .sc_services_cool { .trx_addons_columns_wrap { margin-left: 0; margin-right: -4px; } .trx_addons_columns_wrap > [class*="trx_addons_column-"] { padding-right: 4px; } .trx_addons_columns_wrap.columns_padding_bottom > [class*="trx_addons_column-"], .trx_addons_columns_wrap > [class*="trx_addons_column-"].columns_padding_bottom { padding-bottom: 4px; } .trx_addons_columns_wrap.columns_padding_bottom.columns_in_single_row > [class*="trx_addons_column-"] { padding-bottom: 0; } .sc_services_item { position: relative; z-index: 1; text-align: left; &:before { content: ' '; @include box(0, 0); padding-top: 115%; display:inline-block; } } .sc_services_item_link { @include abs-cover(10); } .sc_services_item_content { @include flex; @include bg-mask(#05080d, 1, 1); @include bg-cover; } .sc_services_item.with_image .sc_services_item_content:before { content: ' '; @include abs-pos; z-index: -1; background: -moz-linear-gradient(top, rgba(0,0,0,0) 0%, rgba(0,0,0,1) 100%); background: -webkit-linear-gradient(top, rgba(0,0,0,0) 0%,rgba(0,0,0,1) 100%); background: linear-gradient(to bottom, rgba(0,0,0,0) 0%,rgba(0,0,0,1) 100%); opacity: .6; @include transition(opacity .3s ease); will-change: opacity; } .sc_services_item.with_image:hover .sc_services_item_content:before { opacity: 0; } .sc_services_item.with_image .sc_services_item_content:after { content: ' '; @include abs-pos; z-index: -1; background-color: var(--theme-color-text_link); opacity: 0; @include transition(opacity .3s ease); will-change: opacity; } .sc_services_item.with_image:hover .sc_services_item_content:after { opacity: .7; } .sc_services_item.with_image .sc_services_item_content.without_image:before, .sc_services_item.with_image .sc_services_item_content.without_image:after { display: none; } .sc_services_item_content_inner { position: relative; z-index: 1; @include flex; @include flex-direction(column); @include flex-justify-content(stretch); @include flex-align-items(flex-start); @include border-box; width: 100%; max-height: 100%; overflow: hidden; padding: 3em 2.2em; } .trx_addons_column-1_5, .trx_addons_column-1_6, .trx_addons_column-1_7, .trx_addons_column-1_8 { .sc_services_item_content_inner { padding: 1.8em; .sc_services_item_title { font-size: 1.5em; } } } .sc_services_item_content_inner_bottom { @include flex-grow(1); @include flex; @include flex-direction(column); @include flex-justify-content(flex-end); position: relative; z-index: 1; width: 100%; max-height: 100%; overflow: hidden; @include border-box; } .sc_services_item .sc_services_item_content_inner_top { @include transform(translateY(-15px)); opacity: 0; will-change: transform, opacity; @include transition(transform .3s ease-out, opacity .3s ease-out); } .sc_services_item:hover .sc_services_item_content_inner_top { @include transform(translateY(0)); opacity: 1; } .sc_services_item.with_more:not(.no_links) .sc_services_item_content_inner_bottom { @include transform(translateY(45px)); will-change: transform; @include transition(transform .3s ease-out); } .sc_services_item.with_more:not(.no_links):hover .sc_services_item_content_inner_bottom { @include transform(translateY(0)); } .sc_services_item_icon, .sc_services_item_pictogram { position: relative; display: inline-block; @include font(3em, 1em); } .sc_services_item_icon.sc_icon_type_svg svg { @include box(1em, 1em); } .sc_services_item_number { display: inline-block; @include font(1.333em, 1em, 600); letter-spacing: 0; } .sc_services_item_title { @include font(1.944em, 1.3em, 600); margin: 0.4em 0 0; } .sc_services_item_featured_none .sc_services_item_title { margin-top: 0; } .sc_services_item_title + .sc_services_item_subtitle { margin-top:0.5em; } .sc_services_item_title + .sc_services_item_text { margin-top:0.55em; } .sc_services_item_subtitle + .sc_services_item_text { margin-top: 0.8em; } .sc_services_item_price { @include font(1.5em, '', 600); margin-top:0.6em; } .sc_services_item_text { @include font(17px, 1.5em); max-height: 4.8em; overflow: hidden; } .sc_services_item_content p { margin:0; } .sc_services_item_content p + p { margin-top:0.2em; } .sc_services_item_button { margin-top: 1.2em; } .sc_services_item.with_more:not(.no_links) .sc_services_item_button { opacity: 0; will-change: opacity; @include transition(opacity .3s ease-out); } .sc_services_item.with_more:not(.no_links):hover .sc_services_item_button { opacity: 1; } .sc_services_item .sc_services_item_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: #ffffff !important; z-index: 1; overflow: hidden; } .sc_services_item:hover .sc_services_item_more_link, .sc_services_item .sc_services_item_more_link:hover { color: #ffffff !important; } .sc_services_item .sc_services_item_more_link .link_text { display: none; position: relative; margin-right: 0; vertical-align: middle; text-indent: -110px; visibility: hidden; white-space: nowrap; opacity: 0; @include transition(visibility .4s ease, margin-right .4s ease-out, text-indent .5s ease-out, opacity .4s ease); will-change: visibility, margin-right, text-indent, opacity; } .sc_services_item:hover .sc_services_item_more_link .link_text, .sc_services_item .sc_services_item_more_link: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, opacity .4s ease); } .sc_services_item .sc_services_item_more_link .link_icon { position: relative; display: inline-block; vertical-align: middle; overflow: hidden; @include square(1.4em); } .sc_services_item .sc_services_item_more_link .link_icon:before { @include font(13px, inherit, 400, inherit); content: '\E9A4'; font-family: $theme_icons; display: inline-block; vertical-align: top; color: currentColor; } .sc_services_item .sc_services_item_icon { color: #ffffff; } .sc_services_item:hover .sc_services_item_icon { color: #ffffff; } .sc_services_item_price, .sc_services_item_price .amount, .sc_services_item_number { color: #ffffff !important; } .sc_services_item_title, .sc_services_item_title a { color: #ffffff !important; } .sc_services_item_title a:hover { color: #ffffff !important; } .sc_services_item_subtitle, .sc_services_item_subtitle a { color: #ffffff !important; } .sc_services_item_subtitle a:hover { color: #ffffff !important; } .sc_services_item_content { color: #ffffff !important; } .sc_services_item_text { color: rgba(255,255,255,.8) !important; } [class*="column-"] .sc_services_item.with_image .sc_services_item_content.without_image, .slider-slide .sc_services_item.with_image .sc_services_item_content.without_image { background-color: var(--theme-color-text_link_007); } [class*="column-"]:nth-child(3n-1) .sc_services_item.with_image .sc_services_item_content.without_image, .slider-slide:nth-child(3n-1) .sc_services_item.with_image .sc_services_item_content.without_image { background-color: var(--theme-color-text_link2_007); } [class*="column-"]:nth-child(3n) .sc_services_item.with_image .sc_services_item_content.without_image, .slider-slide:nth-child(3n) .sc_services_item.with_image .sc_services_item_content.without_image { background-color: var(--theme-color-text_link3_007); } .sc_services_item.with_image .sc_services_item_content.without_image .sc_services_item_price, .sc_services_item.with_image .sc_services_item_content.without_image .sc_services_item_price .amount, .sc_services_item.with_image .sc_services_item_content.without_image .sc_services_item_number { color: var(--theme-color-text_dark) !important; } .sc_services_item.with_image .sc_services_item_content.without_image .sc_services_item_icon, .sc_services_item.with_image:hover .sc_services_item_content.without_image .sc_services_item_icon, .sc_services_item.with_image .sc_services_item_content.without_image .sc_services_item_number { color: var(--theme-color-text_dark) !important; } .sc_services_item.with_image .sc_services_item_content.without_image .sc_services_item_title, .sc_services_item.with_image .sc_services_item_content.without_image .sc_services_item_title a { color: var(--theme-color-text_dark) !important; } .sc_services_item.with_image:hover .sc_services_item_content.without_image .sc_services_item_title a, .sc_services_item.with_image .sc_services_item_content.without_image .sc_services_item_title a:hover { color: var(--theme-color-text_dark) !important; } .sc_services_item.with_image .sc_services_item_content.without_image .sc_services_item_subtitle, .sc_services_item.with_image .sc_services_item_content.without_image .sc_services_item_subtitle a { color: var(--theme-color-text_dark) !important; } .sc_services_item.with_image:hover .sc_services_item_content.without_image .sc_services_item_subtitle a, .sc_services_item.with_image .sc_services_item_content.without_image .sc_services_item_subtitle a:hover { color: var(--theme-color-text_dark) !important; } .sc_services_item.with_image .sc_services_item_content.without_image .sc_services_item_text { color: var(--theme-color-text) !important; } .sc_services_item.with_image .sc_services_item_content.without_image .sc_services_item_more_link { color: var(--theme-color-text_dark) !important; } .sc_services_item.with_image .sc_services_item_content.without_image:hover .sc_services_item_more_link, .sc_services_item.with_image .sc_services_item_content.without_image .sc_services_item_more_link:hover { color: var(--theme-color-text_dark) !important; } &.color_style_link2 .sc_services_item .sc_services_item_icon { color: #ffffff; } &.color_style_link2 .sc_services_item:hover .sc_services_item_icon { color: #ffffff; } &.color_style_link2 .sc_services_item_title a:hover, &.color_style_link2 .sc_services_item_subtitle a:hover { color: #ffffff !important; } &.color_style_link2 .sc_services_item.with_image:hover .sc_services_item_content.without_image .sc_services_item_title a, &.color_style_link2 .sc_services_item.with_image .sc_services_item_content.without_image .sc_services_item_title a:hover { color: var(--theme-color-text_dark) !important; } &.color_style_link2 .sc_services_item.with_image .sc_services_item_content.without_image .sc_services_item_subtitle, &.color_style_link2 .sc_services_item.with_image .sc_services_item_content.without_image .sc_services_item_subtitle a { color: var(--theme-color-text_dark) !important; } &.color_style_link2 .sc_services_item.with_image:hover .sc_services_item_content.without_image .sc_services_item_subtitle a, &.color_style_link2 .sc_services_item.with_image .sc_services_item_content.without_image .sc_services_item_subtitle a:hover { color: var(--theme-color-text_dark) !important; } &.color_style_link2 .sc_services_item.with_image .sc_services_item_content:after { background-color: var(--theme-color-text_link2); } &.color_style_link3 .sc_services_item .sc_services_item_icon { color: #ffffff; } &.color_style_link3 .sc_services_item:hover .sc_services_item_icon { color: #ffffff; } &.color_style_link3 .sc_services_item_title a:hover, &.color_style_link3 .sc_services_item_subtitle a:hover { color: #ffffff; } &.color_style_link3 .sc_services_item.with_image:hover .sc_services_item_content.without_image .sc_services_item_title a, &.color_style_link3 .sc_services_item.with_image .sc_services_item_content.without_image .sc_services_item_title a:hover { color: var(--theme-color-text_dark) !important; } &.color_style_link3 .sc_services_item.with_image .sc_services_item_content.without_image .sc_services_item_subtitle, &.color_style_link3 .sc_services_item.with_image .sc_services_item_content.without_image .sc_services_item_subtitle a { color: var(--theme-color-text_dark) !important; } &.color_style_link3 .sc_services_item.with_image:hover .sc_services_item_content.without_image .sc_services_item_subtitle a, &.color_style_link3 .sc_services_item.with_image .sc_services_item_content.without_image .sc_services_item_subtitle a:hover { color: var(--theme-color-text_dark) !important; } &.color_style_link3 .sc_services_item.with_image .sc_services_item_content:after { background-color: var(--theme-color-text_link3); } &.color_style_dark .sc_services_item.with_image .sc_services_item_content:after { background-color: #000000; } &.color_style_dark .sc_services_item .sc_services_item_icon { color: #ffffff; } &.color_style_dark .sc_services_item:hover .sc_services_item_icon { color: #ffffff; } } /* Style 'Extra' +++++++++++++++++++++++ */ .sc_services_extra { .sc_services_item { position: relative; z-index: 1; text-align: center; &:before { content: ' '; @include box(0, 0); padding-top: 115%; display:inline-block; } } .sc_services_item_link { @include abs-cover(10); } .sc_services_item_content { @include flex; @include bg-mask(#05080d, 1, 1); @include bg-cover; } .sc_services_item.with_image .sc_services_item_content:before { content: ' '; @include abs-pos; z-index: -1; background: -moz-linear-gradient(top, rgba(0,0,0,0) 0%, rgba(0,0,0,1) 100%); background: -webkit-linear-gradient(top, rgba(0,0,0,0) 0%,rgba(0,0,0,1) 100%); background: linear-gradient(to bottom, rgba(0,0,0,0) 0%,rgba(0,0,0,1) 100%); opacity: .6; @include transition(opacity .3s ease); will-change: opacity; } .sc_services_item.with_image:hover .sc_services_item_content:before { opacity: 0; } .sc_services_item.with_image .sc_services_item_content:after { content: ' '; @include abs-pos; z-index: -1; background-color: var(--theme-color-text_link); opacity: 0; @include transition(opacity .3s ease); will-change: opacity; } .sc_services_item.with_image:hover .sc_services_item_content:after { opacity: .7; } .sc_services_item.with_image .sc_services_item_content.without_image:before, .sc_services_item.with_image .sc_services_item_content.without_image:after { display: none; } .sc_services_item_content_inner { position: relative; z-index: 1; @include flex; @include flex-direction(column); @include flex-justify-content(stretch); @include flex-align-items(center); @include border-box; width: 100%; max-height: 100%; overflow: hidden; padding: 3em 2.2em; } .trx_addons_column-1_5, .trx_addons_column-1_6, .trx_addons_column-1_7, .trx_addons_column-1_8 { .sc_services_item_content_inner { padding: 1.8em; .sc_services_item_title { font-size: 1.5em; } } } .sc_services_item_content_inner_bottom { @include flex-grow(1); @include flex; @include flex-direction(column); @include flex-justify-content(flex-end); position: relative; z-index: 1; width: 100%; max-height: 100%; overflow: hidden; @include border-box; } .sc_services_item .sc_services_item_content_inner_top { @include transform(translateY(-15px)); opacity: 0; will-change: transform, opacity; @include transition(transform .3s ease-out, opacity .3s ease-out); } .sc_services_item:hover .sc_services_item_content_inner_top { @include transform(translateY(0)); opacity: 1; } .sc_services_item.with_more:not(.no_links) .sc_services_item_content_inner_bottom { @include transform(translateY(45px)); will-change: transform; @include transition(transform .3s ease-out); } .sc_services_item.with_more:not(.no_links):hover .sc_services_item_content_inner_bottom { @include transform(translateY(0)); } .sc_services_item_icon, .sc_services_item_pictogram { position: relative; display: inline-block; @include font(3em, 1em); } .sc_services_item_icon.sc_icon_type_svg svg { @include box(1em, 1em); } .sc_services_item_number { display: inline-block; @include font(1.556em, 1em, 600); letter-spacing: 0; } .sc_services_item_title { @include font(1.944em, 1.3em, 600); margin: 0.4em 0 0; } .sc_services_item_featured_none .sc_services_item_title { margin-top: 0; } .sc_services_item_title + .sc_services_item_subtitle { margin-top:0.5em; } .sc_services_item_title + .sc_services_item_text { margin-top:0.55em; } .sc_services_item_subtitle + .sc_services_item_text { margin-top: 0.8em; } .sc_services_item_price { @include font(1.5em, '', 600); margin-top:0.6em; } .sc_services_item_text { @include font(17px, 1.5em); max-height: 4.8em; overflow: hidden; } .sc_services_item_content p { margin:0; } .sc_services_item_content p + p { margin-top:0.2em; } .sc_services_item_button { margin-top: 1.2em; } .sc_services_item.with_more:not(.no_links) .sc_services_item_button { opacity: 0; will-change: opacity; @include transition(opacity .3s ease-out); } .sc_services_item.with_more:not(.no_links):hover .sc_services_item_button { opacity: 1; } .sc_services_item .sc_services_item_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: #ffffff !important; z-index: 1; overflow: hidden; } .sc_services_item:hover .sc_services_item_more_link, .sc_services_item .sc_services_item_more_link:hover { color: #ffffff !important; } .sc_services_item .sc_services_item_more_link .link_text { display: none; position: relative; margin-right: 0; vertical-align: middle; text-indent: -110px; visibility: hidden; white-space: nowrap; opacity: 0; @include transition(visibility .4s ease, margin-right .4s ease-out, text-indent .5s ease-out, opacity .4s ease); will-change: visibility, margin-right, text-indent, opacity; } .sc_services_item:hover .sc_services_item_more_link .link_text, .sc_services_item .sc_services_item_more_link: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, opacity .4s ease); } .sc_services_item .sc_services_item_more_link .link_icon { position: relative; display: inline-block; vertical-align: middle; overflow: hidden; @include square(1.4em); } .sc_services_item .sc_services_item_more_link .link_icon:before { @include font(13px, inherit, 400, inherit); content: '\E9A4'; font-family: $theme_icons; display: inline-block; vertical-align: top; color: currentColor; } .sc_services_item .sc_services_item_icon { color: #ffffff; } .sc_services_item:hover .sc_services_item_icon { color: #ffffff; } .sc_services_item_price, .sc_services_item_price .amount, .sc_services_item_number { color: #ffffff !important; } .sc_services_item_title, .sc_services_item_title a { color: #ffffff !important; } .sc_services_item_title a:hover { color: #ffffff !important; } .sc_services_item_subtitle, .sc_services_item_subtitle a { color: #ffffff !important; } .sc_services_item_subtitle a:hover { color: #ffffff !important; } .sc_services_item_content { color: #ffffff !important; } .sc_services_item_text { color: rgba(255,255,255,.8) !important; } [class*="column-"] .sc_services_item.with_image .sc_services_item_content.without_image, .slider-slide .sc_services_item.with_image .sc_services_item_content.without_image { background-color: var(--theme-color-text_link_007); } [class*="column-"]:nth-child(3n-1) .sc_services_item.with_image .sc_services_item_content.without_image, .slider-slide:nth-child(3n-1) .sc_services_item.with_image .sc_services_item_content.without_image { background-color: var(--theme-color-text_link2_007); } [class*="column-"]:nth-child(3n) .sc_services_item.with_image .sc_services_item_content.without_image, .slider-slide:nth-child(3n) .sc_services_item.with_image .sc_services_item_content.without_image { background-color: var(--theme-color-text_link3_007); } .sc_services_item.with_image .sc_services_item_content.without_image .sc_services_item_price, .sc_services_item.with_image .sc_services_item_content.without_image .sc_services_item_price .amount, .sc_services_item.with_image .sc_services_item_content.without_image .sc_services_item_number { color: var(--theme-color-text_dark) !important; } .sc_services_item.with_image .sc_services_item_content.without_image .sc_services_item_icon, .sc_services_item.with_image:hover .sc_services_item_content.without_image .sc_services_item_icon, .sc_services_item.with_image .sc_services_item_content.without_image .sc_services_item_number { color: var(--theme-color-text_dark) !important; } .sc_services_item.with_image .sc_services_item_content.without_image .sc_services_item_title, .sc_services_item.with_image .sc_services_item_content.without_image .sc_services_item_title a { color: var(--theme-color-text_dark) !important; } .sc_services_item.with_image:hover .sc_services_item_content.without_image .sc_services_item_title a, .sc_services_item.with_image .sc_services_item_content.without_image .sc_services_item_title a:hover { color: var(--theme-color-text_dark) !important; } .sc_services_item.with_image .sc_services_item_content.without_image .sc_services_item_subtitle, .sc_services_item.with_image .sc_services_item_content.without_image .sc_services_item_subtitle a { color: var(--theme-color-text_dark) !important; } .sc_services_item.with_image:hover .sc_services_item_content.without_image .sc_services_item_subtitle a, .sc_services_item.with_image .sc_services_item_content.without_image .sc_services_item_subtitle a:hover { color: var(--theme-color-text_dark) !important; } .sc_services_item.with_image .sc_services_item_content.without_image .sc_services_item_text { color: var(--theme-color-text) !important; } .sc_services_item.with_image .sc_services_item_content.without_image .sc_services_item_more_link { color: var(--theme-color-text_dark) !important; } .sc_services_item.with_image .sc_services_item_content.without_image:hover .sc_services_item_more_link, .sc_services_item.with_image .sc_services_item_content.without_image .sc_services_item_more_link:hover { color: var(--theme-color-text_dark) !important; } &.color_style_link2 .sc_services_item .sc_services_item_icon { color: #ffffff; } &.color_style_link2 .sc_services_item:hover .sc_services_item_icon { color: #ffffff; } &.color_style_link2 .sc_services_item_title a:hover, &.color_style_link2 .sc_services_item_subtitle a:hover { color: #ffffff !important; } &.color_style_link2 .sc_services_item.with_image:hover .sc_services_item_content.without_image .sc_services_item_title a, &.color_style_link2 .sc_services_item.with_image .sc_services_item_content.without_image .sc_services_item_title a:hover { color: var(--theme-color-text_dark) !important; } &.color_style_link2 .sc_services_item.with_image .sc_services_item_content.without_image .sc_services_item_subtitle, &.color_style_link2 .sc_services_item.with_image .sc_services_item_content.without_image .sc_services_item_subtitle a { color: var(--theme-color-text_dark) !important; } &.color_style_link2 .sc_services_item.with_image:hover .sc_services_item_content.without_image .sc_services_item_subtitle a, &.color_style_link2 .sc_services_item.with_image .sc_services_item_content.without_image .sc_services_item_subtitle a:hover { color: var(--theme-color-text_dark) !important; } &.color_style_link2 .sc_services_item.with_image .sc_services_item_content:after { background-color: var(--theme-color-text_link2); } &.color_style_link3 .sc_services_item .sc_services_item_icon { color: #ffffff; } &.color_style_link3 .sc_services_item:hover .sc_services_item_icon { color: #ffffff; } &.color_style_link3 .sc_services_item_title a:hover, &.color_style_link3 .sc_services_item_subtitle a:hover { color: #ffffff !important; } &.color_style_link3 .sc_services_item.with_image:hover .sc_services_item_content.without_image .sc_services_item_title a, &.color_style_link3 .sc_services_item.with_image .sc_services_item_content.without_image .sc_services_item_title a:hover { color: var(--theme-color-text_dark) !important; } &.color_style_link3 .sc_services_item.with_image .sc_services_item_content.without_image .sc_services_item_subtitle, &.color_style_link3 .sc_services_item.with_image .sc_services_item_content.without_image .sc_services_item_subtitle a { color: var(--theme-color-text_dark) !important; } &.color_style_link3 .sc_services_item.with_image:hover .sc_services_item_content.without_image .sc_services_item_subtitle a, &.color_style_link3 .sc_services_item.with_image .sc_services_item_content.without_image .sc_services_item_subtitle a:hover { color: var(--theme-color-text_dark) !important; } &.color_style_link3 .sc_services_item.with_image .sc_services_item_content:after { background-color: var(--theme-color-text_link3); } &.color_style_dark .sc_services_item.with_image .sc_services_item_content:after { background-color: #000000; } &.color_style_dark .sc_services_item .sc_services_item_icon { color: #ffffff; } &.color_style_dark .sc_services_item:hover .sc_services_item_icon { color: #ffffff; } } /* Style 'Strong' +++++++++++++++++++++++ */ .sc_services_strong { .sc_services_item { position: relative; z-index: 1; text-align: left; &:before { content: ' '; @include box(0, 0); padding-top: 115%; display:inline-block; } } .sc_services_item_link { @include abs-cover(10); } .sc_services_item_content { @include flex; @include bg-mask(#05080d, 1, 1); @include bg-cover; } .sc_services_item.with_image .sc_services_item_content:before { content: ' '; @include abs-pos; z-index: -1; background: -moz-linear-gradient(top, rgba(0,0,0,0) 0%, rgba(0,0,0,1) 100%); background: -webkit-linear-gradient(top, rgba(0,0,0,0) 0%,rgba(0,0,0,1) 100%); background: linear-gradient(to bottom, rgba(0,0,0,0) 0%,rgba(0,0,0,1) 100%); opacity: .6; @include transition(opacity .3s ease); will-change: opacity; } .sc_services_item.with_image:hover .sc_services_item_content:before { opacity: 0; } .sc_services_item.with_image .sc_services_item_content:after { content: ' '; @include abs-pos; z-index: -1; background: #000; opacity: 0; @include transition(opacity .3s ease); will-change: opacity; } .sc_services_item.with_image:hover .sc_services_item_content:after { opacity: .6; } .sc_services_item.with_image .sc_services_item_content.without_image:before, .sc_services_item.with_image .sc_services_item_content.without_image:after { display: none; } .sc_services_item_content_inner { position: relative; z-index: 1; @include flex; @include flex-direction(column); @include flex-justify-content(stretch); @include flex-align-items(flex-start); @include border-box; width: 100%; max-height: 100%; overflow: hidden; padding: 2em 2.2em 2.4em; } .trx_addons_column-1_5, .trx_addons_column-1_6, .trx_addons_column-1_7, .trx_addons_column-1_8 { .sc_services_item_content_inner { padding: 1.8em; .sc_services_item_title { font-size: 1.3em; } } } .sc_services_item_content_inner_bottom { @include flex-grow(1); @include flex; @include flex-direction(column); @include flex-justify-content(flex-end); position: relative; z-index: 1; width: 100%; max-height: 100%; overflow: hidden; @include border-box; } .sc_services_item .sc_services_item_content_inner_top { opacity: 1; } .sc_services_item.with_more:not(.no_links) .sc_services_item_content_inner_bottom { @include transform(translateY(40px)); will-change: transform; @include transition(transform .3s ease-out); } .sc_services_item.with_more:not(.no_links):hover .sc_services_item_content_inner_bottom { @include transform(translateY(0)); } .sc_services_item_icon, .sc_services_item_pictogram { position: relative; display: inline-block; @include font(3em, 1em); } .sc_services_item_icon.sc_icon_type_svg svg { @include box(1em, 1em); } .sc_services_item_number { display: inline-block; @include font(1.333em, 1em, 600); letter-spacing: 0; } .sc_services_item_title { @include font(1.556em, 1.2em, 600); margin: 0.4em 0 0; } .sc_services_item_featured_none .sc_services_item_title { margin-top: 0; } .sc_services_item_title + .sc_services_item_subtitle { margin-top:0.5em; } .sc_services_item_title + .sc_services_item_text { margin-top:0.55em; } .sc_services_item_subtitle + .sc_services_item_text { margin-top: 0.8em; } .sc_services_item_price { @include font(1.5em, '', 600); margin-top:0.6em; } .sc_services_item_text { @include font(17px, 1.5em); max-height: 4.8em; overflow: hidden; } .sc_services_item_content p { margin:0; } .sc_services_item_content p + p { margin-top:0.2em; } .sc_services_item_button { margin-top: 1.2em; } .sc_services_item.with_more:not(.no_links) .sc_services_item_button { opacity: 0; will-change: opacity; @include transition(opacity .3s ease-out); } .sc_services_item.with_more:not(.no_links):hover .sc_services_item_button { opacity: 1; } .sc_services_item .sc_services_item_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: #ffffff !important; z-index: 1; overflow: hidden; } .sc_services_item:hover .sc_services_item_more_link, .sc_services_item .sc_services_item_more_link:hover { color: #ffffff !important; } .sc_services_item .sc_services_item_more_link .link_text { display: none; position: relative; margin-right: 0; vertical-align: middle; text-indent: -110px; visibility: hidden; white-space: nowrap; opacity: 0; @include transition(visibility .4s ease, margin-right .4s ease-out, text-indent .5s ease-out, opacity .4s ease); will-change: visibility, margin-right, text-indent, opacity; } .sc_services_item:hover .sc_services_item_more_link .link_text, .sc_services_item .sc_services_item_more_link: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, opacity .4s ease); } .sc_services_item .sc_services_item_more_link .link_icon { position: relative; display: inline-block; vertical-align: middle; overflow: hidden; @include square(1.4em); } .sc_services_item .sc_services_item_more_link .link_icon:before { @include font(11px, inherit, 400, inherit); content: '\E9A4'; font-family: $theme_icons; display: inline-block; vertical-align: top; color: currentColor; } .sc_services_item .sc_services_item_icon { color: #ffffff; } .sc_services_item:hover .sc_services_item_icon { color: #ffffff; } .sc_services_item_price, .sc_services_item_price .amount, .sc_services_item_number { color: #ffffff !important; } .sc_services_item_title, .sc_services_item_title a { color: #ffffff !important; } .sc_services_item_title a:hover { color: #ffffff !important; } .sc_services_item_subtitle, .sc_services_item_subtitle a { color: #ffffff !important; } .sc_services_item_subtitle a:hover { color: #ffffff !important; } .sc_services_item_content { color: #ffffff !important; } .sc_services_item_text { color: rgba(255,255,255,.8) !important; } [class*="column-"] .sc_services_item.with_image .sc_services_item_content.without_image, .slider-slide .sc_services_item.with_image .sc_services_item_content.without_image { background-color: var(--theme-color-text_link_007); } [class*="column-"]:nth-child(3n-1) .sc_services_item.with_image .sc_services_item_content.without_image, .slider-slide:nth-child(3n-1) .sc_services_item.with_image .sc_services_item_content.without_image { background-color: var(--theme-color-text_link2_007); } [class*="column-"]:nth-child(3n) .sc_services_item.with_image .sc_services_item_content.without_image, .slider-slide:nth-child(3n) .sc_services_item.with_image .sc_services_item_content.without_image { background-color: var(--theme-color-text_link3_007); } .sc_services_item.with_image .sc_services_item_content.without_image .sc_services_item_price, .sc_services_item.with_image .sc_services_item_content.without_image .sc_services_item_price .amount, .sc_services_item.with_image .sc_services_item_content.without_image .sc_services_item_number { color: var(--theme-color-text_dark) !important; } .sc_services_item.with_image .sc_services_item_content.without_image .sc_services_item_icon, .sc_services_item.with_image:hover .sc_services_item_content.without_image .sc_services_item_icon, .sc_services_item.with_image .sc_services_item_content.without_image .sc_services_item_number { color: var(--theme-color-text_dark) !important; } .sc_services_item.with_image .sc_services_item_content.without_image .sc_services_item_title, .sc_services_item.with_image .sc_services_item_content.without_image .sc_services_item_title a { color: var(--theme-color-text_dark) !important; } .sc_services_item.with_image:hover .sc_services_item_content.without_image .sc_services_item_title a, .sc_services_item.with_image .sc_services_item_content.without_image .sc_services_item_title a:hover { color: var(--theme-color-text_dark) !important; } .sc_services_item.with_image .sc_services_item_content.without_image .sc_services_item_subtitle, .sc_services_item.with_image .sc_services_item_content.without_image .sc_services_item_subtitle a { color: var(--theme-color-text_dark) !important; } .sc_services_item.with_image:hover .sc_services_item_content.without_image .sc_services_item_subtitle a, .sc_services_item.with_image .sc_services_item_content.without_image .sc_services_item_subtitle a:hover { color: var(--theme-color-text_dark) !important; } .sc_services_item.with_image .sc_services_item_content.without_image .sc_services_item_text { color: var(--theme-color-text) !important; } .sc_services_item.with_image .sc_services_item_content.without_image .sc_services_item_more_link { color: var(--theme-color-text_dark) !important; } .sc_services_item.with_image .sc_services_item_content.without_image:hover .sc_services_item_more_link, .sc_services_item.with_image .sc_services_item_content.without_image .sc_services_item_more_link:hover { color: var(--theme-color-text_dark) !important; } &.color_style_link2 .sc_services_item .sc_services_item_icon { color: #ffffff; } &.color_style_link2 .sc_services_item:hover .sc_services_item_icon { color: #ffffff; } &.color_style_link2 .sc_services_item_title a:hover, &.color_style_link2 .sc_services_item_subtitle a:hover { color: #ffffff !important; } &.color_style_link2 .sc_services_item.with_image:hover .sc_services_item_content.without_image .sc_services_item_title a, &.color_style_link2 .sc_services_item.with_image .sc_services_item_content.without_image .sc_services_item_title a:hover { color: var(--theme-color-text_dark) !important; } &.color_style_link2 .sc_services_item.with_image .sc_services_item_content.without_image .sc_services_item_subtitle, &.color_style_link2 .sc_services_item.with_image .sc_services_item_content.without_image .sc_services_item_subtitle a { color: var(--theme-color-text_dark) !important; } &.color_style_link2 .sc_services_item.with_image:hover .sc_services_item_content.without_image .sc_services_item_subtitle a, &.color_style_link2 .sc_services_item.with_image .sc_services_item_content.without_image .sc_services_item_subtitle a:hover { color: var(--theme-color-text_dark) !important; } &.color_style_link3 .sc_services_item .sc_services_item_icon { color: #ffffff; } &.color_style_link3 .sc_services_item:hover .sc_services_item_icon { color: #ffffff; } &.color_style_link3 .sc_services_item_title a:hover, &.color_style_link3 .sc_services_item_subtitle a:hover { color: #ffffff !important; } &.color_style_link3 .sc_services_item.with_image:hover .sc_services_item_content.without_image .sc_services_item_title a, &.color_style_link3 .sc_services_item.with_image .sc_services_item_content.without_image .sc_services_item_title a:hover { color: var(--theme-color-text_dark) !important; } &.color_style_link3 .sc_services_item.with_image .sc_services_item_content.without_image .sc_services_item_subtitle, &.color_style_link3 .sc_services_item.with_image .sc_services_item_content.without_image .sc_services_item_subtitle a { color: var(--theme-color-text_dark) !important; } &.color_style_link3 .sc_services_item.with_image:hover .sc_services_item_content.without_image .sc_services_item_subtitle a, &.color_style_link3 .sc_services_item.with_image .sc_services_item_content.without_image .sc_services_item_subtitle a:hover { color: var(--theme-color-text_dark) !important; } &.color_style_dark .sc_services_item .sc_services_item_icon { color: #ffffff; } &.color_style_dark .sc_services_item:hover .sc_services_item_icon { color: #ffffff; } } /* Style 'Minimal' +++++++++++++++++++++++ */ .sc_services_minimal { .elementor-section-full_width & { .sc_services_item:before { padding-top: 71%; } } .sc_services_item { @include flex; position: relative; z-index: 1; text-align: center; overflow: hidden; &:before { content: ''; @include box(0, 0); padding-top: 95%; display:inline-block; } } .sc_services_item_link { @include abs-cover(10); } .sc_services_item_content { @include flex; @include bg-mask(#05080d, 1, 1); @include bg-cover; width: 100%; height: 100%; } .sc_services_item.with_image .sc_services_item_featured_image { @include abs-pos(-1px,-1px,-1px,-1px,-1); @include bg-cover; will-change: transform; @include transition(transform .4s ease-out); @include backface-hidden; &:before { content: ' '; @include abs-pos; z-index: -1; background: #0C0F16; opacity: .45; @include transition(opacity .3s ease); will-change: opacity; } &:hover:before { opacity: .77; } } .sc_services_item:hover .sc_services_item_featured_image { @include transform(scale(1.05, 1.05)); } .sc_services_item.with_image .sc_services_item_featured_image.without_image:before { display: none; } .sc_services_item_content_inner { position: relative; z-index: 1; @include flex; @include flex-direction(column); @include flex-justify-content(center); @include flex-align-items(center); @include border-box; width: 100%; max-height: 100%; overflow: hidden; padding: 3em 2em; } .sc_services_item_content_inner_bottom { display: block; position: relative; z-index: 1; line-height: 1; width: 100%; max-height: 100%; overflow: hidden; @include border-box; } .sc_services_item.with_more:not(.no_links) .sc_services_item_content_inner { @include flex-justify-content(flex-end); } .sc_services_item.with_more:not(.no_links) .sc_services_item_content_inner_bottom { padding-top: 5.7em; } .sc_services_item.with_more:not(.no_links) .sc_services_item_content_inner_bottom { @include transform(translateY(0)); will-change: transform; @include transition(transform .3s ease-out); } .sc_services_item.with_more:not(.no_links):hover .sc_services_item_content_inner_bottom { @include transform(translateY(-1em)); } .sc_services_item_icon, .sc_services_item_pictogram { position: relative; display: inline-block; @include font(3em, 1em); } .sc_services_item_icon.sc_icon_type_svg svg { @include box(1em, 1em); } .sc_services_item_number { display: inline-block; @include font(1.333em, 1em, 600); letter-spacing: 0; } .sc_services_item_title { @include font(1.944em, 1.3em, 600); letter-spacing: -0.8px; margin: 0.4em 0 0; } .sc_services_item_subtitle { @include font(16px, 1.5em, 600); letter-spacing: 1.7px; text-transform: uppercase; opacity: .9; } .sc_services_item_featured_none .sc_services_item_title { margin-top: 0; } .sc_services_item_title + .sc_services_item_subtitle { margin-top:0.5em; } .sc_services_item_title + .sc_services_item_text { margin-top:0.55em; } .sc_services_item_subtitle + .sc_services_item_text { margin-top: 0.8em; } .sc_services_item_price { @include font(1.5em, '', 600); margin-top:0.6em; } .sc_services_item_text { @include font(17px, 1.5em); } .sc_services_item_content p { margin:0; } .sc_services_item_content p + p { margin-top:0.2em; } .sc_services_item.with_more:not(.no_links) .sc_services_item_button { opacity: 0; will-change: opacity; @include transition(opacity .3s ease-out); } .sc_services_item.with_more:not(.no_links):hover .sc_services_item_button { opacity: 1; } .sc_services_item .sc_services_item_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: #ffffff !important; z-index: 1; overflow: hidden; } .sc_services_item:hover .sc_services_item_more_link, .sc_services_item .sc_services_item_more_link:hover { color: #ffffff !important; } .sc_services_item .sc_services_item_more_link .link_text { display: none; position: relative; margin-right: 0; vertical-align: middle; text-indent: -110px; visibility: hidden; white-space: nowrap; opacity: 0; @include transition(visibility .4s ease, margin-right .4s ease-out, text-indent .5s ease-out, opacity .4s ease); will-change: visibility, margin-right, text-indent, opacity; } .sc_services_item:hover .sc_services_item_more_link .link_text, .sc_services_item .sc_services_item_more_link: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, opacity .4s ease); } .sc_services_item .sc_services_item_more_link .link_icon { position: relative; display: inline-block; vertical-align: middle; overflow: hidden; @include box(2em, 1.4em, 1.4em); text-align: center; } .sc_services_item .sc_services_item_more_link .link_icon:before { @include font(16px, inherit, 400, inherit); content: '\E9A4'; font-family: $theme_icons; display: inline-block; vertical-align: top; color: currentColor; } .sc_services_item .sc_services_item_icon { color: #ffffff; } .sc_services_item:hover .sc_services_item_icon { color: #ffffff; } .sc_services_item_price, .sc_services_item_price .amount, .sc_services_item_number { color: #ffffff !important; } .sc_services_item_title, .sc_services_item_title a { color: #ffffff !important; } .sc_services_item_title a:hover { color: #ffffff !important; } .sc_services_item_subtitle, .sc_services_item_subtitle a { color: #ffffff !important; } .sc_services_item_subtitle a:hover { color: #ffffff !important; } .sc_services_item_content { color: #ffffff !important; } .sc_services_item_text { color: rgba(255,255,255,.8) !important; } [class*="column-"] .sc_services_item.with_image .sc_services_item_content.without_image, .slider-slide .sc_services_item.with_image .sc_services_item_content.without_image { background-color: var(--theme-color-text_link_007); } [class*="column-"]:nth-child(3n-1) .sc_services_item.with_image .sc_services_item_content.without_image, .slider-slide:nth-child(3n-1) .sc_services_item.with_image .sc_services_item_content.without_image { background-color: var(--theme-color-text_link2_007); } [class*="column-"]:nth-child(3n) .sc_services_item.with_image .sc_services_item_content.without_image, .slider-slide:nth-child(3n) .sc_services_item.with_image .sc_services_item_content.without_image { background-color: var(--theme-color-text_link3_007); } .sc_services_item.with_image .sc_services_item_content.without_image .sc_services_item_price, .sc_services_item.with_image .sc_services_item_content.without_image .sc_services_item_price .amount, .sc_services_item.with_image .sc_services_item_content.without_image .sc_services_item_number { color: var(--theme-color-text_dark) !important; } .sc_services_item.with_image .sc_services_item_content.without_image .sc_services_item_icon, .sc_services_item.with_image:hover .sc_services_item_content.without_image .sc_services_item_icon, .sc_services_item.with_image .sc_services_item_content.without_image .sc_services_item_number { color: var(--theme-color-text_dark) !important; } .sc_services_item.with_image .sc_services_item_content.without_image .sc_services_item_title, .sc_services_item.with_image .sc_services_item_content.without_image .sc_services_item_title a { color: var(--theme-color-text_dark) !important; } .sc_services_item.with_image:hover .sc_services_item_content.without_image .sc_services_item_title a, .sc_services_item.with_image .sc_services_item_content.without_image .sc_services_item_title a:hover { color: var(--theme-color-text_dark) !important; } .sc_services_item.with_image .sc_services_item_content.without_image .sc_services_item_subtitle, .sc_services_item.with_image .sc_services_item_content.without_image .sc_services_item_subtitle a { color: var(--theme-color-text_dark) !important; } .sc_services_item.with_image:hover .sc_services_item_content.without_image .sc_services_item_subtitle a, .sc_services_item.with_image .sc_services_item_content.without_image .sc_services_item_subtitle a:hover { color: var(--theme-color-text_dark) !important; } .sc_services_item.with_image .sc_services_item_content.without_image .sc_services_item_text { color: var(--theme-color-text) !important; } .sc_services_item.with_image .sc_services_item_content.without_image .sc_services_item_more_link { color: var(--theme-color-text_dark) !important; } .sc_services_item.with_image .sc_services_item_content.without_image:hover .sc_services_item_more_link, .sc_services_item.with_image .sc_services_item_content.without_image .sc_services_item_more_link:hover { color: var(--theme-color-text_dark) !important; } &.color_style_link2 .sc_services_item .sc_services_item_icon { color: #ffffff; } &.color_style_link2 .sc_services_item:hover .sc_services_item_icon { color: #ffffff; } &.color_style_link2 .sc_services_item_title a:hover, &.color_style_link2 .sc_services_item_subtitle a:hover { color: #ffffff !important; } &.color_style_link2 .sc_services_item.with_image:hover .sc_services_item_content.without_image .sc_services_item_title a, &.color_style_link2 .sc_services_item.with_image .sc_services_item_content.without_image .sc_services_item_title a:hover { color: var(--theme-color-text_dark) !important; } &.color_style_link2 .sc_services_item.with_image .sc_services_item_content.without_image .sc_services_item_subtitle, &.color_style_link2 .sc_services_item.with_image .sc_services_item_content.without_image .sc_services_item_subtitle a { color: var(--theme-color-text_dark) !important; } &.color_style_link2 .sc_services_item.with_image:hover .sc_services_item_content.without_image .sc_services_item_subtitle a, &.color_style_link2 .sc_services_item.with_image .sc_services_item_content.without_image .sc_services_item_subtitle a:hover { color: var(--theme-color-text_dark) !important; } &.color_style_link3 .sc_services_item .sc_services_item_icon { color: #ffffff; } &.color_style_link3 .sc_services_item:hover .sc_services_item_icon { color: #ffffff; } &.color_style_link3 .sc_services_item_title a:hover, &.color_style_link3 .sc_services_item_subtitle a:hover { color: #ffffff !important; } &.color_style_link3 .sc_services_item.with_image:hover .sc_services_item_content.without_image .sc_services_item_title a, &.color_style_link3 .sc_services_item.with_image .sc_services_item_content.without_image .sc_services_item_title a:hover { color: var(--theme-color-text_dark) !important; } &.color_style_link3 .sc_services_item.with_image .sc_services_item_content.without_image .sc_services_item_subtitle, &.color_style_link3 .sc_services_item.with_image .sc_services_item_content.without_image .sc_services_item_subtitle a { color: var(--theme-color-text_dark) !important; } &.color_style_link3 .sc_services_item.with_image:hover .sc_services_item_content.without_image .sc_services_item_subtitle a, &.color_style_link3 .sc_services_item.with_image .sc_services_item_content.without_image .sc_services_item_subtitle a:hover { color: var(--theme-color-text_dark) !important; } &.color_style_dark .sc_services_item .sc_services_item_icon { color: #ffffff; } &.color_style_dark .sc_services_item:hover .sc_services_item_icon { color: #ffffff; } /* Column 1_4 */ .trx_addons_column-1_4 .sc_services_item_content_inner { padding: 1.6em; } .trx_addons_column-1_4 .sc_services_item.with_more:not(.no_links) .sc_services_item_content_inner_bottom { padding-top: 2em; } .trx_addons_column-1_4 .sc_services_item_title { font-size: 1.4em; } .trx_addons_column-1_4 .sc_services_item .sc_services_item_more_link .link_icon:before { font-size: 14px; } } /* Style 'Creative' +++++++++++++++++++++++ */ .sc_services_creative { @include transform (translateZ(0)); .sc_services_item { @include flex; position:relative; z-index: 1; text-align: left; -webkit-transform-style: preserve-3d; transform-style: preserve-3d; perspective: none; &:hover { z-index: 10; } &:before { content: ' '; @include box(0, 0); padding-top: 110%; display:inline-block; } } .sc_services_item.with_image .sc_services_item_content:before { content: ' '; @include abs-pos(0,0,0,0,-1); background: -moz-linear-gradient(top, rgba(0,0,0,0) 0%, rgba(0,0,0,1) 100%); background: -webkit-linear-gradient(top, rgba(0,0,0,0) 0%,rgba(0,0,0,1) 100%); background: linear-gradient(to bottom, rgba(0,0,0,0) 0%,rgba(0,0,0,1) 100%); @include transition-property(background); opacity: .6; } .sc_services_item.with_image .sc_services_item_content.without_image:before { display:none; } .sc_services_item_link { @include abs-cover(10); @include transform(translateZ(60px)); } .sc_services_item_content { @include flex; @include bg-mask(#05080d, 1, 1); @include bg-cover; -webkit-backface-visibility: hidden; backface-visibility: hidden; -webkit-transform-style: preserve-3d; transform-style: preserve-3d; @include box(100%, 100%); } .sc_services_item_content_inner { position: relative; z-index: 1; @include flex; @include flex-direction(column); @include flex-justify-content(stretch); @include flex-align-items(flex-start); @include border-box; width: 100%; max-height:100%; overflow:hidden; padding: 2.8em 2.6em; @include transform(translateZ(60px)); } .sc_services_item_content_inner_top { margin-bottom: 20px; } .sc_services_item_content_inner_bottom { @include flex; @include flex-direction(column); @include flex-justify-content(flex-end); @include flex-grow(1); width: 100%; } .sc_services_item_icon, .sc_services_item_pictogram { position: relative; display: inline-block; @include font(4em, 1em); } .sc_services_item_icon.sc_icon_type_svg svg { @include box(1em, 1em); } .sc_services_item_number { display: inline-block; @include font(1.667em, 1em, 600); letter-spacing: -0.2px; } .sc_services_item_title { @include font(1.556em, 1.3em, 600); margin: 0; } .sc_services_item_title + .sc_services_item_subtitle { margin-top:0.2em; } .sc_services_item_text + .sc_services_item_title { margin-top: 0.25em; } .sc_services_item_price { @include font(1.5em, '', 600); text-shadow: none; margin-bottom: 0.5em; } .sc_services_item_text { @include font(17px, 1.5em); } .sc_services_item_content p { margin:0; } .sc_services_item_content p + p { margin-top:0.2em; } .sc_services_item_price, .sc_services_item_price .amount, .sc_services_item_icon, .sc_services_item_number { color: #ffffff !important; } .sc_services_item_title, .sc_services_item_title a { color: #ffffff !important; } .sc_services_item_title a:hover { color: #ffffff !important; } .sc_services_item_subtitle, .sc_services_item_subtitle a { color: #ffffff !important; } .sc_services_item_subtitle a:hover { color: #ffffff !important; } .sc_services_item_content { color: #ffffff !important; } .sc_services_item_text { color: rgba(255,255,255,.8); } .sc_services_item.with_image .sc_services_item_content.without_image .sc_services_item_text { color: var(--theme-color-text) !important; } .sc_services_item.with_image .sc_services_item_content.without_image .sc_services_item_price, .sc_services_item.with_image .sc_services_item_content.without_image .sc_services_item_price .amount { color: var(--theme-color-text_dark) !important; } &.color_style_link2 .sc_services_item_icon { color: var(--theme-color-text_link2) !important; } &.color_style_link2 .sc_services_item_title a:hover, &.color_style_link2 .sc_services_item_subtitle a:hover { color: var(--theme-color-inverse_link) !important; } &.color_style_link3 .sc_services_item_icon { color: var(--theme-color-text_link3) !important; } &.color_style_link3 .sc_services_item_title a:hover, &.color_style_link3 .sc_services_item_subtitle a:hover { color: var(--theme-color-inverse_link) !important; } [class*="column-"] .sc_services_item.with_image .sc_services_item_content.without_image, .slider-slide .sc_services_item.with_image .sc_services_item_content.without_image { background-color: var(--theme-color-text_link_007); } [class*="column-"]:nth-child(3n-1) .sc_services_item.with_image .sc_services_item_content.without_image, .slider-slide:nth-child(3n-1) .sc_services_item.with_image .sc_services_item_content.without_image { background-color: var(--theme-color-text_link2_007); } [class*="column-"]:nth-child(3n) .sc_services_item.with_image .sc_services_item_content.without_image, .slider-slide:nth-child(3n) .sc_services_item.with_image .sc_services_item_content.without_image { background-color: var(--theme-color-text_link3_007); } .sc_services_item.with_image .sc_services_item_content.without_image .sc_services_item_icon, .sc_services_item.with_image .sc_services_item_content.without_image .sc_services_item_number { color: var(--theme-color-text_dark) !important; } .sc_services_item.with_image .sc_services_item_content.without_image .sc_services_item_title, .sc_services_item.with_image .sc_services_item_content.without_image .sc_services_item_title a { color: var(--theme-color-text_dark) !important; } .sc_services_item.with_image:hover .sc_services_item_content.without_image .sc_services_item_title a, .sc_services_item.with_image .sc_services_item_content.without_image .sc_services_item_title a:hover { color: var(--theme-color-text_dark) !important; } &.color_style_link2 .sc_services_item.with_image:hover .sc_services_item_content.without_image .sc_services_item_title a, &.color_style_link2 .sc_services_item.with_image .sc_services_item_content.without_image .sc_services_item_title a:hover { color: var(--theme-color-text_dark) !important; } &.color_style_link3 .sc_services_item.with_image:hover .sc_services_item_content.without_image .sc_services_item_title a, &.color_style_link3 .sc_services_item.with_image .sc_services_item_content.without_image .sc_services_item_title a:hover { color: var(--theme-color-text_dark) !important; } .sc_services_item.with_image .sc_services_item_content.without_image .sc_services_item_subtitle, .sc_services_item.with_image .sc_services_item_content.without_image .sc_services_item_subtitle a { color: var(--theme-color-text_dark) !important; } &.color_style_link2 .sc_services_item.with_image .sc_services_item_content.without_image .sc_services_item_subtitle, &.color_style_link2 .sc_services_item.with_image .sc_services_item_content.without_image .sc_services_item_subtitle a { color: var(--theme-color-text_dark) !important; } &.color_style_link3 .sc_services_item.with_image .sc_services_item_content.without_image .sc_services_item_subtitle, &.color_style_link3 .sc_services_item.with_image .sc_services_item_content.without_image .sc_services_item_subtitle a { color: var(--theme-color-text_dark) !important; } .sc_services_item.with_image:hover .sc_services_item_content.without_image .sc_services_item_subtitle a, .sc_services_item.with_image .sc_services_item_content.without_image .sc_services_item_subtitle a:hover { color: var(--theme-color-text_dark) !important; } &.color_style_link2 .sc_services_item.with_image:hover .sc_services_item_content.without_image .sc_services_item_subtitle a, &.color_style_link2 .sc_services_item.with_image .sc_services_item_content.without_image .sc_services_item_subtitle a:hover { color: var(--theme-color-text_dark) !important; } &.color_style_link3 .sc_services_item.with_image:hover .sc_services_item_content.without_image .sc_services_item_subtitle a, &.color_style_link3 .sc_services_item.with_image .sc_services_item_content.without_image .sc_services_item_subtitle a:hover { color: var(--theme-color-text_dark) !important; } } /* Style 'Shine' +++++++++++++++++++++++ */ .sc_services_shine { .sc_services_item { @include flex; position: relative; z-index: 1; text-align: left; &:before { content: ' '; @include box(0, 0); padding-top: 80%; display:inline-block; } } .sc_services_item_link { @include abs-cover(10); } .sc_services_item_content { @include flex; position: relative; z-index: 1; background-color: #05080d; @include bg-cover; width: 100%; max-height: 100%; } .sc_services_item.with_image .sc_services_item_content:before { content: ' '; @include abs-pos; z-index: -1; background-color: var(--theme-color-alter_bg_color); opacity: 1; @include transition(background-color .3s ease, opacity .3s ease); will-change: background-color, opacity; } .sc_services_item.with_image:hover .sc_services_item_content:before { background-color: var(--theme-color-text_link); opacity: .7; } .sc_services_item.with_image .sc_services_item_content.without_image:before { display: none; } .sc_services_item_content_inner { position: relative; z-index: 1; @include flex; @include flex-direction(column); @include flex-justify-content(flex-start); @include flex-align-items(flex-start); @include border-box; width: 100%; max-height: 100%; overflow: hidden; padding: 4em 2.8em; } .sc_services_item_icon, .sc_services_item_pictogram { position: relative; display: inline-block; @include font(4.2em, 1em); } .sc_services_item_icon.sc_icon_type_svg svg { @include box(1em, 1em); } .sc_services_item_number { display: inline-block; @include font(4em, 1em, 600); } .sc_services_item_title { @include font(1.556em, 1.3em, 600); margin: 1.1em 0 0; } .sc_services_item_featured_none .sc_services_item_title { margin-top: 0; } .sc_services_item_title + .sc_services_item_subtitle { margin-top:0.4em; } .sc_services_item_title + .sc_services_item_text, .sc_services_item_subtitle + .sc_services_item_text { margin-top:0.8em; } .sc_services_item_price { @include font(1.5em, '', 600); margin-top:0.6em; } .sc_services_item_text { @include font(17px, 1.65em); } .sc_services_item_content p { margin:0; } .sc_services_item_content p + p { margin-top:0.2em; } .sc_services_item .sc_services_item_button { margin-top: 1.5em; } .sc_services_item .sc_services_item_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-alter_dark); z-index: 1; overflow: hidden; } .sc_services_item:hover .sc_services_item_more_link, .sc_services_item .sc_services_item_more_link:hover { color: var(--theme-color-inverse_link); } .sc_services_item .sc_services_item_more_link .link_text { position: relative; margin-right: 0; display: inline-block; vertical-align: middle; text-indent: -110px; visibility: hidden; white-space: nowrap; opacity: 0; @include transition(visibility .4s ease, margin-right .4s ease-out, text-indent .5s ease-out, opacity .4s ease); will-change: visibility, margin-right, text-indent, opacity; } .sc_services_item:hover .sc_services_item_more_link .link_text, .sc_services_item .sc_services_item_more_link: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, opacity .4s ease); } .sc_services_item .sc_services_item_more_link .link_icon { position: relative; display: inline-block; vertical-align: middle; overflow: hidden; @include square(1.4em); } .sc_services_item .sc_services_item_more_link .link_icon:before { @include font(11px, inherit, 400, inherit); content: '\E9A4'; font-family: $theme_icons; display: inline-block; vertical-align: top; color: currentColor; } .sc_services_item .sc_services_item_price, .sc_services_item .sc_services_item_price .amount, .sc_services_item .sc_services_item_number { @include transition(color .3s ease); } .sc_services_item:hover .sc_services_item_price, .sc_services_item:hover .sc_services_item_price .amount, .sc_services_item:hover .sc_services_item_number { color: var(--theme-color-inverse_link) !important; } .sc_services_item .sc_services_item_icon { color: var(--theme-color-text_link); } .sc_services_item:hover .sc_services_item_icon { color: var(--theme-color-inverse_link); } .sc_services_item_price, .sc_services_item_price .amount, .sc_services_item_number { color: var(--theme-color-alter_dark) !important; } .sc_services_item_title, .sc_services_item_title a { color: var(--theme-color-alter_dark) !important; } .sc_services_item:hover .sc_services_item_title, .sc_services_item:hover .sc_services_item_title a, .sc_services_item .sc_services_item_title a:hover { color: var(--theme-color-inverse_link) !important; } .sc_services_item_subtitle, .sc_services_item_subtitle a { color: var(--theme-color-alter_text) !important; } .sc_services_item:hover .sc_services_item_subtitle, .sc_services_item:hover .sc_services_item_subtitle a, .sc_services_item .sc_services_item_subtitle a:hover { color: var(--theme-color-inverse_link) !important; } .sc_services_item_content { color: var(--theme-color-alter_text) !important; } .sc_services_item_text { color: var(--theme-color-alter_dark_08) !important; @include transition(color .3s ease-out); } .sc_services_item:hover .sc_services_item_text { color: var(--theme-color-inverse_link_08) !important; } [class*="column-"] .sc_services_item.with_image .sc_services_item_content.without_image, .slider-slide .sc_services_item.with_image .sc_services_item_content.without_image { background-color: var(--theme-color-text_link_007); } [class*="column-"]:nth-child(3n-1) .sc_services_item.with_image .sc_services_item_content.without_image, .slider-slide:nth-child(3n-1) .sc_services_item.with_image .sc_services_item_content.without_image { background-color: var(--theme-color-text_link2_007); } [class*="column-"]:nth-child(3n) .sc_services_item.with_image .sc_services_item_content.without_image, .slider-slide:nth-child(3n) .sc_services_item.with_image .sc_services_item_content.without_image { background-color: var(--theme-color-text_link3_007); } .sc_services_item.with_image .sc_services_item_content.without_image .sc_services_item_price, .sc_services_item.with_image .sc_services_item_content.without_image .sc_services_item_price .amount, .sc_services_item.with_image .sc_services_item_content.without_image .sc_services_item_number { color: var(--theme-color-text_dark) !important; } .sc_services_item.with_image .sc_services_item_content.without_image .sc_services_item_icon, .sc_services_item.with_image:hover .sc_services_item_content.without_image .sc_services_item_icon, .sc_services_item.with_image .sc_services_item_content.without_image .sc_services_item_number { color: var(--theme-color-text_dark) !important; } .sc_services_item.with_image .sc_services_item_content.without_image .sc_services_item_title, .sc_services_item.with_image .sc_services_item_content.without_image .sc_services_item_title a { color: var(--theme-color-text_dark) !important; } .sc_services_item.with_image:hover .sc_services_item_content.without_image .sc_services_item_title a, .sc_services_item.with_image .sc_services_item_content.without_image .sc_services_item_title a:hover { color: var(--theme-color-text_dark) !important; } .sc_services_item.with_image .sc_services_item_content.without_image .sc_services_item_subtitle, .sc_services_item.with_image .sc_services_item_content.without_image .sc_services_item_subtitle a { color: var(--theme-color-text_dark) !important; } .sc_services_item.with_image:hover .sc_services_item_content.without_image .sc_services_item_subtitle a, .sc_services_item.with_image .sc_services_item_content.without_image .sc_services_item_subtitle a:hover { color: var(--theme-color-text_dark) !important; } .sc_services_item.with_image .sc_services_item_content.without_image .sc_services_item_text { color: var(--theme-color-text) !important; } .sc_services_item.with_image:hover .sc_services_item_content.without_image .sc_services_item_more_link, .sc_services_item.with_image .sc_services_item_content.without_image .sc_services_item_more_link:hover { color: var(--theme-color-text_dark) !important; } &.color_style_link2 .sc_services_item.with_image:hover .sc_services_item_content:before { background-color: var(--theme-color-text_link2); } &.color_style_link2 .sc_services_item .sc_services_item_icon { color: var(--theme-color-text_link2); } &.color_style_link2 .sc_services_item:hover .sc_services_item_icon { color: var(--theme-color-inverse_link); } &.color_style_link2 .sc_services_item_title a:hover, &.color_style_link2 .sc_services_item_subtitle a:hover { color: var(--theme-color-inverse_link) !important; } &.color_style_link2 .sc_services_item.with_image:hover .sc_services_item_content.without_image .sc_services_item_title a, &.color_style_link2 .sc_services_item.with_image .sc_services_item_content.without_image .sc_services_item_title a:hover { color: var(--theme-color-text_dark) !important; } &.color_style_link2 .sc_services_item.with_image .sc_services_item_content.without_image .sc_services_item_subtitle, &.color_style_link2 .sc_services_item.with_image .sc_services_item_content.without_image .sc_services_item_subtitle a { color: var(--theme-color-text_dark) !important; } &.color_style_link2 .sc_services_item.with_image:hover .sc_services_item_content.without_image .sc_services_item_subtitle a, &.color_style_link2 .sc_services_item.with_image .sc_services_item_content.without_image .sc_services_item_subtitle a:hover { color: var(--theme-color-text_dark) !important; } &.color_style_link3 .sc_services_item.with_image:hover .sc_services_item_content:before { background-color: var(--theme-color-text_link3); } &.color_style_link3 .sc_services_item .sc_services_item_icon { color: var(--theme-color-text_link3); } &.color_style_link3 .sc_services_item:hover .sc_services_item_icon { color: var(--theme-color-inverse_link); } &.color_style_link3 .sc_services_item_title a:hover, &.color_style_link3 .sc_services_item_subtitle a:hover { color: var(--theme-color-inverse_link) !important; } &.color_style_link3 .sc_services_item.with_image:hover .sc_services_item_content.without_image .sc_services_item_title a, &.color_style_link3 .sc_services_item.with_image .sc_services_item_content.without_image .sc_services_item_title a:hover { color: var(--theme-color-text_dark) !important; } &.color_style_link3 .sc_services_item.with_image .sc_services_item_content.without_image .sc_services_item_subtitle, &.color_style_link3 .sc_services_item.with_image .sc_services_item_content.without_image .sc_services_item_subtitle a { color: var(--theme-color-text_dark) !important; } &.color_style_link3 .sc_services_item.with_image:hover .sc_services_item_content.without_image .sc_services_item_subtitle a, &.color_style_link3 .sc_services_item.with_image .sc_services_item_content.without_image .sc_services_item_subtitle a:hover { color: var(--theme-color-text_dark) !important; } &.color_style_dark .sc_services_item.with_image .sc_services_item_content:before { background-color: var(--theme-color-text_dark); } &.color_style_dark .sc_services_item .sc_services_item_price, &.color_style_dark .sc_services_item .sc_services_item_price .amount, &.color_style_dark .sc_services_item .sc_services_item_number { color: var(--theme-color-inverse_hover) !important; } &.color_style_dark .sc_services_item:hover .sc_services_item_price, &.color_style_dark .sc_services_item:hover .sc_services_item_price .amount, &.color_style_dark .sc_services_item:hover .sc_services_item_number { color: var(--theme-color-inverse_hover) !important; } &.color_style_dark .sc_services_item .sc_services_item_icon { color: var(--theme-color-inverse_hover); } &.color_style_dark .sc_services_item:hover .sc_services_item_icon { color: var(--theme-color-inverse_hover); } &.color_style_dark .sc_services_item_title, &.color_style_dark .sc_services_item_title a { color: var(--theme-color-inverse_hover) !important; } &.color_style_dark .sc_services_item:hover .sc_services_item_title, &.color_style_dark .sc_services_item:hover .sc_services_item_title a, &.color_style_dark .sc_services_item .sc_services_item_title a:hover { color: var(--theme-color-inverse_hover) !important; } &.color_style_dark .sc_services_item_subtitle, &.color_style_dark .sc_services_item_subtitle a { color: var(--theme-color-inverse_hover) !important; } &.color_style_dark .sc_services_item:hover .sc_services_item_subtitle, &.color_style_dark .sc_services_item:hover .sc_services_item_subtitle a, &.color_style_dark .sc_services_item .sc_services_item_subtitle a:hover { color: var(--theme-color-inverse_hover) !important; } &.color_style_dark .sc_services_item_text { color: var(--theme-color-inverse_hover_08) !important; } &.color_style_dark .sc_services_item:hover .sc_services_item_text { color: var(--theme-color-inverse_hover_08) !important; } &.color_style_dark .sc_services_item .sc_services_item_more_link { color: var(--theme-color-inverse_hover) !important; } &.color_style_dark .sc_services_item:hover .sc_services_item_more_link, &.color_style_dark .sc_services_item .sc_services_item_more_link:hover { color: var(--theme-color-inverse_hover) !important; } } /* Style 'Motley' +++++++++++++++++++++++ */ .sc_services_motley { .elementor-section-full_width & { .sc_services_item:before { padding-top: 74%; } } .sc_services_item { @include flex; position: relative; z-index: 1; text-align: left; &:before { content: ' '; @include box(0, 0); padding-top: 95%; display:inline-block; } } .sc_services_item_link { @include abs-cover(10); } .sc_services_item_content { @include flex; position: relative; z-index: 1; background-color: #05080d; @include bg-cover; width: 100%; max-height: 100%; } .sc_services_item.with_image .sc_services_item_content:before { content: ' '; @include abs-pos; z-index: -1; background-color: var(--theme-color-alter_bg_color); opacity: 1; will-change: opacity; @include transition(opacity .3s ease); } [class*="column-"]:nth-child(3n-1) .sc_services_item.with_image .sc_services_item_content:before, .slider-slide:nth-child(3n-1) .sc_services_item.with_image .sc_services_item_content:before { background-color: var(--theme-color-alter_link); } [class*="column-"]:nth-child(3n-1) .sc_services_item.with_image:hover .sc_services_item_content:before, .slider-slide:nth-child(3n-1) .sc_services_item.with_image:hover .sc_services_item_content:before { opacity: .8; } [class*="column-"]:nth-child(3n-1) .sc_services_item.with_image .sc_services_item_price, [class*="column-"]:nth-child(3n-1) .sc_services_item.with_image .sc_services_item_price .amount, [class*="column-"]:nth-child(3n-1) .sc_services_item.with_image .sc_services_item_number, .slider-slide:nth-child(3n-1) .sc_services_item.with_image .sc_services_item_price, .slider-slide:nth-child(3n-1) .sc_services_item.with_image .sc_services_item_price .amount, .slider-slide:nth-child(3n-1) .sc_services_item.with_image .sc_services_item_number { color: var(--theme-color-inverse_link) !important; } [class*="column-"]:nth-child(3n-1) .sc_services_item.with_image .sc_services_item_icon, .slider-slide:nth-child(3n-1) .sc_services_item.with_image .sc_services_item_icon { color: var(--theme-color-inverse_link) !important; } [class*="column-"]:nth-child(3n-1) .sc_services_item.with_image .sc_services_item_title, [class*="column-"]:nth-child(3n-1) .sc_services_item.with_image .sc_services_item_title a, .slider-slide:nth-child(3n-1) .sc_services_item.with_image .sc_services_item_title, .slider-slide:nth-child(3n-1) .sc_services_item.with_image .sc_services_item_title a { color: var(--theme-color-inverse_link) !important; } [class*="column-"]:nth-child(3n-1) .sc_services_item.with_image .sc_services_item_subtitle, [class*="column-"]:nth-child(3n-1) .sc_services_item.with_image .sc_services_item_subtitle a, .slider-slide:nth-child(3n-1) .sc_services_item.with_image .sc_services_item_subtitle, .slider-slide:nth-child(3n-1) .sc_services_item.with_image .sc_services_item_subtitle a { color: var(--theme-color-inverse_link) !important; } [class*="column-"]:nth-child(3n-1) .sc_services_item.with_image .sc_services_item_text, .slider-slide:nth-child(3n-1) .sc_services_item.with_image .sc_services_item_text { color: var(--theme-color-inverse_link_08) !important; } [class*="column-"]:nth-child(3n-1) .sc_services_item.with_image .sc_services_item_more_link, .slider-slide:nth-child(3n-1) .sc_services_item.with_image .sc_services_item_more_link { color: var(--theme-color-inverse_link) !important; } [class*="column-"]:nth-child(3n) .sc_services_item.with_image .sc_services_item_content:before, .slider-slide:nth-child(3n) .sc_services_item.with_image .sc_services_item_content:before { background-color: var(--theme-color-alter_dark); } [class*="column-"]:nth-child(3n) .sc_services_item.with_image:hover .sc_services_item_content:before, .slider-slide:nth-child(3n) .sc_services_item.with_image:hover .sc_services_item_content:before { opacity: .8; } [class*="column-"]:nth-child(3n) .sc_services_item.with_image .sc_services_item_price, [class*="column-"]:nth-child(3n) .sc_services_item.with_image .sc_services_item_price .amount, [class*="column-"]:nth-child(3n) .sc_services_item.with_image .sc_services_item_number, .slider-slide:nth-child(3n) .sc_services_item.with_image .sc_services_item_price, .slider-slide:nth-child(3n) .sc_services_item.with_image .sc_services_item_price .amount, .slider-slide:nth-child(3n) .sc_services_item.with_image .sc_services_item_number { color: var(--theme-color-inverse_hover) !important; } [class*="column-"]:nth-child(3n) .sc_services_item.with_image .sc_services_item_icon, .slider-slide:nth-child(3n) .sc_services_item.with_image .sc_services_item_icon { color: var(--theme-color-inverse_hover) !important; } [class*="column-"]:nth-child(3n) .sc_services_item.with_image .sc_services_item_title, [class*="column-"]:nth-child(3n) .sc_services_item.with_image .sc_services_item_title a, .slider-slide:nth-child(3n) .sc_services_item.with_image .sc_services_item_title, .slider-slide:nth-child(3n) .sc_services_item.with_image .sc_services_item_title a { color: var(--theme-color-inverse_hover) !important; } [class*="column-"]:nth-child(3n) .sc_services_item.with_image .sc_services_item_subtitle, [class*="column-"]:nth-child(3n) .sc_services_item.with_image .sc_services_item_subtitle a, .slider-slide:nth-child(3n) .sc_services_item.with_image .sc_services_item_subtitle, .slider-slide:nth-child(3n) .sc_services_item.with_image .sc_services_item_subtitle a { color: var(--theme-color-inverse_hover) !important; } [class*="column-"]:nth-child(3n) .sc_services_item.with_image .sc_services_item_text, .slider-slide:nth-child(3n) .sc_services_item.with_image .sc_services_item_text { color: var(--theme-color-inverse_hover_08) !important; } [class*="column-"]:nth-child(3n) .sc_services_item.with_image .sc_services_item_more_link, .slider-slide:nth-child(3n) .sc_services_item.with_image .sc_services_item_more_link { color: var(--theme-color-inverse_hover) !important; } .sc_services_item.with_image .sc_services_item_content.without_image:before { display: none; } .sc_services_item_content_inner { position: relative; z-index: 1; @include flex; @include flex-direction(column); @include flex-justify-content(flex-end); @include flex-align-items(flex-start); @include border-box; width: 100%; max-height: 100%; overflow: hidden; padding: 3.5em 2.8em; } .sc_services_item_content_inner_wrap { position: relative; z-index: 1; width: 100%; max-height: 100%; overflow: hidden; @include border-box; } .sc_services_item.with_more:not(.no_links) .sc_services_item_content_inner_wrap { @include transform(translateY(50px)); will-change: translate; @include transition(transform .3s ease-out); } .sc_services_item.with_more:not(.no_links):hover .sc_services_item_content_inner_wrap { @include transform(translateY(0)); } .sc_services_item_icon, .sc_services_item_pictogram { position: relative; display: inline-block; @include font(4.2em, 1em); } .sc_services_item_icon.sc_icon_type_svg svg { @include box(1em, 1em); } .sc_services_item_number { display: inline-block; @include font(4em, 1em, 600); } .sc_services_item_title { @include font(1.944em, 1.3em, 600); letter-spacing: -0.8px; margin: 0.8em 0 0; } .sc_services_item_featured_none .sc_services_item_title { margin-top: 0; } .sc_services_item_title + .sc_services_item_subtitle { margin-top:0.25em; } .sc_services_item_title + .sc_services_item_text, .sc_services_item_subtitle + .sc_services_item_text { margin-top:0.5em; } .sc_services_item_price { @include font(1.5em, '', 600); margin-top:0.6em; } .sc_services_item_text { @include font(17px, 1.65em); max-height: 4.8em; overflow: hidden; } .sc_services_item_content p { margin:0; } .sc_services_item_content p + p { margin-top:0.2em; } .sc_services_item .sc_services_item_button { margin-top: 1.2em; } .sc_services_item.with_more:not(.no_links) .sc_services_item_button { opacity: 0; will-change: opacity; @include transition(opacity .3s ease-out); } .sc_services_item.with_more:not(.no_links):hover .sc_services_item_button { opacity: 1; } .sc_services_item .sc_services_item_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-alter_dark); z-index: 1; overflow: hidden; } .sc_services_item:hover .sc_services_item_more_link, .sc_services_item .sc_services_item_more_link:hover { color: var(--theme-color-alter_dark); } .sc_services_item .sc_services_item_more_link .link_text { display: none; position: relative; margin-right: 0; vertical-align: middle; text-indent: -110px; visibility: hidden; white-space: nowrap; opacity: 0; @include transition(visibility .4s ease, margin-right .4s ease-out, text-indent .5s ease-out, opacity .4s ease); will-change: visibility, margin-right, text-indent, opacity; } .sc_services_item:hover .sc_services_item_more_link .link_text, .sc_services_item .sc_services_item_more_link: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, opacity .4s ease); } .sc_services_item .sc_services_item_more_link .link_icon { position: relative; display: inline-block; vertical-align: middle; overflow: hidden; @include box(2.4em, 1.4em, 1.4em); text-align: center; } .sc_services_item .sc_services_item_more_link .link_icon:before { @include font(13px, inherit, 400, inherit); content: '\E9B2'; font-family: $theme_icons; display: inline-block; vertical-align: top; color: currentColor; } .sc_services_item .sc_services_item_price, .sc_services_item .sc_services_item_price .amount, .sc_services_item .sc_services_item_number { color: var(--theme-color-alter_dark) !important; @include transition(color .3s ease); } .sc_services_item:hover .sc_services_item_price, .sc_services_item:hover .sc_services_item_price .amount, .sc_services_item:hover .sc_services_item_number { color: var(--theme-color-alter_dark) !important; } .sc_services_item .sc_services_item_icon { color: var(--theme-color-alter_link); } .sc_services_item:hover .sc_services_item_icon { color: var(--theme-color-alter_link); } .sc_services_item_title, .sc_services_item_title a { color: var(--theme-color-alter_dark) !important; } .sc_services_item:hover .sc_services_item_title, .sc_services_item:hover .sc_services_item_title a, .sc_services_item .sc_services_item_title a:hover { color: var(--theme-color-alter_dark) !important; } .sc_services_item_subtitle, .sc_services_item_subtitle a { color: var(--theme-color-alter_text) !important; } .sc_services_item:hover .sc_services_item_subtitle, .sc_services_item:hover .sc_services_item_subtitle a, .sc_services_item .sc_services_item_subtitle a:hover { color: var(--theme-color-alter_text) !important; } .sc_services_item_content { color: var(--theme-color-alter_text) !important; } .sc_services_item_text { color: var(--theme-color-alter_dark_08) !important; @include transition(color .3s ease-out); } .sc_services_item:hover .sc_services_item_text { color: var(--theme-color-alter_dark_08) !important; } [class*="column-"] .sc_services_item.with_image .sc_services_item_content.without_image, .slider-slide .sc_services_item.with_image .sc_services_item_content.without_image { background-color: var(--theme-color-text_link_007); } [class*="column-"]:nth-child(3n-1) .sc_services_item.with_image .sc_services_item_content.without_image, .slider-slide:nth-child(3n-1) .sc_services_item.with_image .sc_services_item_content.without_image { background-color: var(--theme-color-text_link2_007); } [class*="column-"]:nth-child(3n) .sc_services_item.with_image .sc_services_item_content.without_image, .slider-slide:nth-child(3n) .sc_services_item.with_image .sc_services_item_content.without_image { background-color: var(--theme-color-text_link3_007); } .sc_services_item.with_image .sc_services_item_content.without_image .sc_services_item_price, .sc_services_item.with_image .sc_services_item_content.without_image .sc_services_item_price .amount, .sc_services_item.with_image .sc_services_item_content.without_image .sc_services_item_number { color: var(--theme-color-text_dark) !important; } .sc_services_item.with_image .sc_services_item_content.without_image .sc_services_item_icon, .sc_services_item.with_image:hover .sc_services_item_content.without_image .sc_services_item_icon, .sc_services_item.with_image .sc_services_item_content.without_image .sc_services_item_number { color: var(--theme-color-text_dark) !important; } .sc_services_item.with_image .sc_services_item_content.without_image .sc_services_item_title, .sc_services_item.with_image .sc_services_item_content.without_image .sc_services_item_title a { color: var(--theme-color-text_dark) !important; } .sc_services_item.with_image:hover .sc_services_item_content.without_image .sc_services_item_title a, .sc_services_item.with_image .sc_services_item_content.without_image .sc_services_item_title a:hover { color: var(--theme-color-text_dark) !important; } .sc_services_item.with_image .sc_services_item_content.without_image .sc_services_item_subtitle, .sc_services_item.with_image .sc_services_item_content.without_image .sc_services_item_subtitle a { color: var(--theme-color-text_dark) !important; } .sc_services_item.with_image:hover .sc_services_item_content.without_image .sc_services_item_subtitle a, .sc_services_item.with_image .sc_services_item_content.without_image .sc_services_item_subtitle a:hover { color: var(--theme-color-text_dark) !important; } .sc_services_item.with_image .sc_services_item_content.without_image .sc_services_item_text { color: var(--theme-color-text) !important; } .sc_services_item.with_image:hover .sc_services_item_content.without_image .sc_services_item_more_link, .sc_services_item.with_image .sc_services_item_content.without_image .sc_services_item_more_link:hover { color: var(--theme-color-text_dark) !important; } &.color_style_link2 .sc_services_item.with_image:hover .sc_services_item_content:before { background-color: var(--theme-color-alter_bg_color); } &.color_style_link2 .sc_services_item .sc_services_item_price, &.color_style_link2 .sc_services_item .sc_services_item_price .amount, &.color_style_link2 .sc_services_item .sc_services_item_number { color: var(--theme-color-alter_dark) !important; } &.color_style_link2 .sc_services_item .sc_services_item_icon { color: var(--theme-color-alter_link2); } &.color_style_link2 .sc_services_item:hover .sc_services_item_icon { color: var(--theme-color-alter_link2); } &.color_style_link2 .sc_services_item_title a:hover, &.color_style_link2 .sc_services_item_subtitle a:hover { color: var(--theme-color-alter_dark) !important; } &.color_style_link2 [class*="column-"]:nth-child(3n-1) .sc_services_item.with_image .sc_services_item_content:before, &.color_style_link2 .slider-slide:nth-child(3n-1) .sc_services_item.with_image .sc_services_item_content:before { background-color: var(--theme-color-alter_link2); } &.color_style_link2 [class*="column-"]:nth-child(3n-1) .sc_services_item.with_image .sc_services_item_price, &.color_style_link2 [class*="column-"]:nth-child(3n-1) .sc_services_item.with_image .sc_services_item_price .amount, &.color_style_link2 [class*="column-"]:nth-child(3n-1) .sc_services_item.with_image .sc_services_item_number, &.color_style_link2 .slider-slide:nth-child(3n-1) .sc_services_item.with_image .sc_services_item_price, &.color_style_link2 .slider-slide:nth-child(3n-1) .sc_services_item.with_image .sc_services_item_price .amount, &.color_style_link2 .slider-slide:nth-child(3n-1) .sc_services_item.with_image .sc_services_item_number { color: var(--theme-color-inverse_link) !important; } &.color_style_link2 [class*="column-"]:nth-child(3n-1) .sc_services_item.with_image .sc_services_item_icon, &.color_style_link2 .slider-slide:nth-child(3n-1) .sc_services_item.with_image .sc_services_item_icon { color: var(--theme-color-inverse_link) !important; } &.color_style_link2 [class*="column-"]:nth-child(3n-1) .sc_services_item.with_image .sc_services_item_title, &.color_style_link2 [class*="column-"]:nth-child(3n-1) .sc_services_item.with_image .sc_services_item_title a, &.color_style_link2 .slider-slide:nth-child(3n-1) .sc_services_item.with_image .sc_services_item_title, &.color_style_link2 .slider-slide:nth-child(3n-1) .sc_services_item.with_image .sc_services_item_title a { color: var(--theme-color-inverse_link) !important; } &.color_style_link2 [class*="column-"]:nth-child(3n-1) .sc_services_item.with_image .sc_services_item_subtitle, &.color_style_link2 [class*="column-"]:nth-child(3n-1) .sc_services_item.with_image .sc_services_item_subtitle a, &.color_style_link2 .slider-slide:nth-child(3n-1) .sc_services_item.with_image .sc_services_item_subtitle, &.color_style_link2 .slider-slide:nth-child(3n-1) .sc_services_item.with_image .sc_services_item_subtitle a { color: var(--theme-color-inverse_link) !important; } &.color_style_link2 [class*="column-"]:nth-child(3n-1) .sc_services_item.with_image .sc_services_item_text, &.color_style_link2 .slider-slide:nth-child(3n-1) .sc_services_item.with_image .sc_services_item_text { color: var(--theme-color-inverse_link_08) !important; } &.color_style_link2 [class*="column-"]:nth-child(3n-1) .sc_services_item.with_image .sc_services_item_more_link, &.color_style_link2 .slider-slide:nth-child(3n-1) .sc_services_item.with_image .sc_services_item_more_link { color: var(--theme-color-inverse_link) !important; } &.color_style_link2 [class*="column-"]:nth-child(3n) .sc_services_item.with_image .sc_services_item_content:before, &.color_style_link2 .slider-slide:nth-child(3n) .sc_services_item.with_image .sc_services_item_content:before { background-color: var(--theme-color-alter_dark); } &.color_style_link2 [class*="column-"]:nth-child(3n) .sc_services_item.with_image .sc_services_item_price, &.color_style_link2 [class*="column-"]:nth-child(3n) .sc_services_item.with_image .sc_services_item_price .amount, &.color_style_link2 [class*="column-"]:nth-child(3n) .sc_services_item.with_image .sc_services_item_number, &.color_style_link2 .slider-slide:nth-child(3n) .sc_services_item.with_image .sc_services_item_price, &.color_style_link2 .slider-slide:nth-child(3n) .sc_services_item.with_image .sc_services_item_price .amount, &.color_style_link2 .slider-slide:nth-child(3n) .sc_services_item.with_image .sc_services_item_number { color: var(--theme-color-inverse_hover) !important; } &.color_style_link2 [class*="column-"]:nth-child(3n) .sc_services_item.with_image .sc_services_item_icon, &.color_style_link2 .slider-slide:nth-child(3n) .sc_services_item.with_image .sc_services_item_icon { color: var(--theme-color-inverse_hover) !important; } &.color_style_link2 [class*="column-"]:nth-child(3n) .sc_services_item.with_image .sc_services_item_title, &.color_style_link2 [class*="column-"]:nth-child(3n) .sc_services_item.with_image .sc_services_item_title a, &.color_style_link2 .slider-slide:nth-child(3n) .sc_services_item.with_image .sc_services_item_title, &.color_style_link2 .slider-slide:nth-child(3n) .sc_services_item.with_image .sc_services_item_title a { color: var(--theme-color-inverse_hover) !important; } &.color_style_link2 [class*="column-"]:nth-child(3n) .sc_services_item.with_image .sc_services_item_subtitle, &.color_style_link2 [class*="column-"]:nth-child(3n) .sc_services_item.with_image .sc_services_item_subtitle a, &.color_style_link2 .slider-slide:nth-child(3n) .sc_services_item.with_image .sc_services_item_subtitle, &.color_style_link2 .slider-slide:nth-child(3n) .sc_services_item.with_image .sc_services_item_subtitle a { color: var(--theme-color-inverse_hover) !important; } &.color_style_link2 [class*="column-"]:nth-child(3n) .sc_services_item.with_image .sc_services_item_text, &.color_style_link2 .slider-slide:nth-child(3n) .sc_services_item.with_image .sc_services_item_text { color: var(--theme-color-inverse_hover_08) !important; } &.color_style_link2 [class*="column-"]:nth-child(3n) .sc_services_item.with_image .sc_services_item_more_link, &.color_style_link2 .slider-slide:nth-child(3n) .sc_services_item.with_image .sc_services_item_more_link { color: var(--theme-color-inverse_hover) !important; } &.color_style_link2 .sc_services_item.with_image:hover .sc_services_item_content.without_image .sc_services_item_title a, &.color_style_link2 .sc_services_item.with_image .sc_services_item_content.without_image .sc_services_item_title a:hover { color: var(--theme-color-text_dark) !important; } &.color_style_link2 .sc_services_item.with_image .sc_services_item_content.without_image .sc_services_item_subtitle, &.color_style_link2 .sc_services_item.with_image .sc_services_item_content.without_image .sc_services_item_subtitle a { color: var(--theme-color-text_dark) !important; } &.color_style_link2 .sc_services_item.with_image:hover .sc_services_item_content.without_image .sc_services_item_subtitle a, &.color_style_link2 .sc_services_item.with_image .sc_services_item_content.without_image .sc_services_item_subtitle a:hover { color: var(--theme-color-text_dark) !important; } &.color_style_link3 .sc_services_item.with_image:hover .sc_services_item_content:before { background-color: var(--theme-color-alter_bg_color); } &.color_style_link3 .sc_services_item .sc_services_item_price, &.color_style_link3 .sc_services_item .sc_services_item_price .amount, &.color_style_link3 .sc_services_item .sc_services_item_number { color: var(--theme-color-alter_dark) !important; } &.color_style_link3 .sc_services_item .sc_services_item_icon { color: var(--theme-color-alter_link3); } &.color_style_link3 .sc_services_item:hover .sc_services_item_icon { color: var(--theme-color-alter_link3); } &.color_style_link3 .sc_services_item_title a:hover, &.color_style_link3 .sc_services_item_subtitle a:hover { color: var(--theme-color-inverse_link) !important; } &.color_style_link3 [class*="column-"]:nth-child(3n-1) .sc_services_item.with_image .sc_services_item_content:before, &.color_style_link3 .slider-slide:nth-child(3n-1) .sc_services_item.with_image .sc_services_item_content:before { background-color: var(--theme-color-alter_link3); } &.color_style_link3 [class*="column-"]:nth-child(3n-1) .sc_services_item.with_image .sc_services_item_price, &.color_style_link3 [class*="column-"]:nth-child(3n-1) .sc_services_item.with_image .sc_services_item_price .amount, &.color_style_link3 [class*="column-"]:nth-child(3n-1) .sc_services_item.with_image .sc_services_item_number, &.color_style_link3 .slider-slide:nth-child(3n-1) .sc_services_item.with_image .sc_services_item_price, &.color_style_link3 .slider-slide:nth-child(3n-1) .sc_services_item.with_image .sc_services_item_price .amount, &.color_style_link3 .slider-slide:nth-child(3n-1) .sc_services_item.with_image .sc_services_item_number { color: var(--theme-color-inverse_link) !important; } &.color_style_link3 [class*="column-"]:nth-child(3n-1) .sc_services_item.with_image .sc_services_item_icon, &.color_style_link3 .slider-slide:nth-child(3n-1) .sc_services_item.with_image .sc_services_item_icon { color: var(--theme-color-inverse_link) !important; } &.color_style_link3 [class*="column-"]:nth-child(3n-1) .sc_services_item.with_image .sc_services_item_title, &.color_style_link3 [class*="column-"]:nth-child(3n-1) .sc_services_item.with_image .sc_services_item_title a, &.color_style_link3 .slider-slide:nth-child(3n-1) .sc_services_item.with_image .sc_services_item_title, &.color_style_link3 .slider-slide:nth-child(3n-1) .sc_services_item.with_image .sc_services_item_title a { color: var(--theme-color-inverse_link) !important; } &.color_style_link3 [class*="column-"]:nth-child(3n-1) .sc_services_item.with_image .sc_services_item_subtitle, &.color_style_link3 [class*="column-"]:nth-child(3n-1) .sc_services_item.with_image .sc_services_item_subtitle a, &.color_style_link3 .slider-slide:nth-child(3n-1) .sc_services_item.with_image .sc_services_item_subtitle, &.color_style_link3 .slider-slide:nth-child(3n-1) .sc_services_item.with_image .sc_services_item_subtitle a { color: var(--theme-color-inverse_link) !important; } &.color_style_link3 [class*="column-"]:nth-child(3n-1) .sc_services_item.with_image .sc_services_item_text, &.color_style_link3 .slider-slide:nth-child(3n-1) .sc_services_item.with_image .sc_services_item_text { color: var(--theme-color-inverse_link_08) !important; } &.color_style_link3 [class*="column-"]:nth-child(3n-1) .sc_services_item.with_image .sc_services_item_more_link, &.color_style_link3 .slider-slide:nth-child(3n-1) .sc_services_item.with_image .sc_services_item_more_link { color: var(--theme-color-inverse_link) !important; } &.color_style_link3 [class*="column-"]:nth-child(3n) .sc_services_item.with_image .sc_services_item_content:before, &.color_style_link3 .slider-slide:nth-child(3n) .sc_services_item.with_image .sc_services_item_content:before { background-color: var(--theme-color-alter_dark); } &.color_style_link3 [class*="column-"]:nth-child(3n) .sc_services_item.with_image .sc_services_item_price, &.color_style_link3 [class*="column-"]:nth-child(3n) .sc_services_item.with_image .sc_services_item_price .amount, &.color_style_link3 [class*="column-"]:nth-child(3n) .sc_services_item.with_image .sc_services_item_number, &.color_style_link3 .slider-slide:nth-child(3n) .sc_services_item.with_image .sc_services_item_price, &.color_style_link3 .slider-slide:nth-child(3n) .sc_services_item.with_image .sc_services_item_price .amount, &.color_style_link3 .slider-slide:nth-child(3n) .sc_services_item.with_image .sc_services_item_number { color: var(--theme-color-inverse_hover) !important; } &.color_style_link3 [class*="column-"]:nth-child(3n) .sc_services_item.with_image .sc_services_item_icon, &.color_style_link3 .slider-slide:nth-child(3n) .sc_services_item.with_image .sc_services_item_icon { color: var(--theme-color-inverse_hover) !important; } &.color_style_link3 [class*="column-"]:nth-child(3n) .sc_services_item.with_image .sc_services_item_title, &.color_style_link3 [class*="column-"]:nth-child(3n) .sc_services_item.with_image .sc_services_item_title a, &.color_style_link3 .slider-slide:nth-child(3n) .sc_services_item.with_image .sc_services_item_title, &.color_style_link3 .slider-slide:nth-child(3n) .sc_services_item.with_image .sc_services_item_title a { color: var(--theme-color-inverse_hover) !important; } &.color_style_link3 [class*="column-"]:nth-child(3n) .sc_services_item.with_image .sc_services_item_subtitle, &.color_style_link3 [class*="column-"]:nth-child(3n) .sc_services_item.with_image .sc_services_item_subtitle a, &.color_style_link3 .slider-slide:nth-child(3n) .sc_services_item.with_image .sc_services_item_subtitle, &.color_style_link3 .slider-slide:nth-child(3n) .sc_services_item.with_image .sc_services_item_subtitle a { color: var(--theme-color-inverse_hover) !important; } &.color_style_link3 [class*="column-"]:nth-child(3n) .sc_services_item.with_image .sc_services_item_text, &.color_style_link3 .slider-slide:nth-child(3n) .sc_services_item.with_image .sc_services_item_text { color: var(--theme-color-inverse_hover_08) !important; } &.color_style_link3 [class*="column-"]:nth-child(3n) .sc_services_item.with_image .sc_services_item_more_link, &.color_style_link3 .slider-slide:nth-child(3n) .sc_services_item.with_image .sc_services_item_more_link { color: var(--theme-color-inverse_hover) !important; } &.color_style_link3 .sc_services_item.with_image:hover .sc_services_item_content.without_image .sc_services_item_title a, &.color_style_link3 .sc_services_item.with_image .sc_services_item_content.without_image .sc_services_item_title a:hover { color: var(--theme-color-text_dark) !important; } &.color_style_link3 .sc_services_item.with_image .sc_services_item_content.without_image .sc_services_item_subtitle, &.color_style_link3 .sc_services_item.with_image .sc_services_item_content.without_image .sc_services_item_subtitle a { color: var(--theme-color-text_dark) !important; } &.color_style_link3 .sc_services_item.with_image:hover .sc_services_item_content.without_image .sc_services_item_subtitle a, &.color_style_link3 .sc_services_item.with_image .sc_services_item_content.without_image .sc_services_item_subtitle a:hover { color: var(--theme-color-text_dark) !important; } &.color_style_dark .sc_services_item.with_image .sc_services_item_content:before { background-color: var(--theme-color-alter_dark); } &.color_style_dark .sc_services_item.with_image:hover .sc_services_item_content:before { opacity: .8; } &.color_style_dark .sc_services_item .sc_services_item_price, &.color_style_dark .sc_services_item .sc_services_item_price .amount, &.color_style_dark .sc_services_item .sc_services_item_number { color: var(--theme-color-inverse_hover) !important; } &.color_style_dark .sc_services_item:hover .sc_services_item_price, &.color_style_dark .sc_services_item:hover .sc_services_item_price .amount, &.color_style_dark .sc_services_item:hover .sc_services_item_number { color: var(--theme-color-inverse_hover) !important; } &.color_style_dark .sc_services_item .sc_services_item_icon { color: var(--theme-color-inverse_hover); } &.color_style_dark .sc_services_item:hover .sc_services_item_icon { color: var(--theme-color-inverse_hover); } &.color_style_dark .sc_services_item_title, &.color_style_dark .sc_services_item_title a { color: var(--theme-color-inverse_hover) !important; } &.color_style_dark .sc_services_item:hover .sc_services_item_title, &.color_style_dark .sc_services_item:hover .sc_services_item_title a, &.color_style_dark .sc_services_item .sc_services_item_title a:hover { color: var(--theme-color-inverse_hover) !important; } &.color_style_dark .sc_services_item_subtitle, &.color_style_dark .sc_services_item_subtitle a { color: var(--theme-color-inverse_hover) !important; } &.color_style_dark .sc_services_item:hover .sc_services_item_subtitle, &.color_style_dark .sc_services_item:hover .sc_services_item_subtitle a, &.color_style_dark .sc_services_item .sc_services_item_subtitle a:hover { color: var(--theme-color-inverse_hover) !important; } &.color_style_dark .sc_services_item_text { color: var(--theme-color-inverse_hover_08) !important; } &.color_style_dark .sc_services_item:hover .sc_services_item_text { color: var(--theme-color-inverse_hover_08) !important; } &.color_style_dark .sc_services_item .sc_services_item_more_link { color: var(--theme-color-inverse_hover) !important; } &.color_style_dark .sc_services_item:hover .sc_services_item_more_link, &.color_style_dark .sc_services_item .sc_services_item_more_link:hover { color: var(--theme-color-inverse_hover) !important; } &.color_style_dark [class*="column-"]:nth-child(3n-1) .sc_services_item.with_image .sc_services_item_content:before, &.color_style_dark .slider-slide:nth-child(3n-1) .sc_services_item.with_image .sc_services_item_content:before { background-color: var(--theme-color-alter_link); } &.color_style_dark [class*="column-"]:nth-child(3n-1) .sc_services_item.with_image .sc_services_item_price, &.color_style_dark [class*="column-"]:nth-child(3n-1) .sc_services_item.with_image .sc_services_item_price .amount, &.color_style_dark [class*="column-"]:nth-child(3n-1) .sc_services_item.with_image .sc_services_item_number, &.color_style_dark .slider-slide:nth-child(3n-1) .sc_services_item.with_image .sc_services_item_price, &.color_style_dark .slider-slide:nth-child(3n-1) .sc_services_item.with_image .sc_services_item_price .amount, &.color_style_dark .slider-slide:nth-child(3n-1) .sc_services_item.with_image .sc_services_item_number { color: var(--theme-color-inverse_hover) !important; } &.color_style_dark [class*="column-"]:nth-child(3n-1) .sc_services_item.with_image .sc_services_item_icon, &.color_style_dark .slider-slide:nth-child(3n-1) .sc_services_item.with_image .sc_services_item_icon { color: var(--theme-color-inverse_link) !important; } &.color_style_dark [class*="column-"]:nth-child(3n-1) .sc_services_item.with_image .sc_services_item_title, &.color_style_dark [class*="column-"]:nth-child(3n-1) .sc_services_item.with_image .sc_services_item_title a, &.color_style_dark .slider-slide:nth-child(3n-1) .sc_services_item.with_image .sc_services_item_title, &.color_style_dark .slider-slide:nth-child(3n-1) .sc_services_item.with_image .sc_services_item_title a { color: var(--theme-color-inverse_link) !important; } &.color_style_dark [class*="column-"]:nth-child(3n-1) .sc_services_item.with_image .sc_services_item_subtitle, &.color_style_dark [class*="column-"]:nth-child(3n-1) .sc_services_item.with_image .sc_services_item_subtitle a, &.color_style_dark .slider-slide:nth-child(3n-1) .sc_services_item.with_image .sc_services_item_subtitle, &.color_style_dark .slider-slide:nth-child(3n-1) .sc_services_item.with_image .sc_services_item_subtitle a { color: var(--theme-color-inverse_link) !important; } &.color_style_dark [class*="column-"]:nth-child(3n-1) .sc_services_item.with_image .sc_services_item_text, &.color_style_dark .slider-slide:nth-child(3n-1) .sc_services_item.with_image .sc_services_item_text { color: var(--theme-color-inverse_link_08) !important; } &.color_style_dark [class*="column-"]:nth-child(3n-1) .sc_services_item.with_image .sc_services_item_more_link, &.color_style_dark .slider-slide:nth-child(3n-1) .sc_services_item.with_image .sc_services_item_more_link { color: var(--theme-color-inverse_link) !important; } &.color_style_dark [class*="column-"]:nth-child(3n) .sc_services_item.with_image .sc_services_item_content:before, &.color_style_dark .slider-slide:nth-child(3n) .sc_services_item.with_image .sc_services_item_content:before { background-color: var(--theme-color-alter_link2); } &.color_style_dark [class*="column-"]:nth-child(3n) .sc_services_item.with_image .sc_services_item_price, &.color_style_dark [class*="column-"]:nth-child(3n) .sc_services_item.with_image .sc_services_item_price .amount, &.color_style_dark [class*="column-"]:nth-child(3n) .sc_services_item.with_image .sc_services_item_number, &.color_style_dark .slider-slide:nth-child(3n) .sc_services_item.with_image .sc_services_item_price, &.color_style_dark .slider-slide:nth-child(3n) .sc_services_item.with_image .sc_services_item_price .amount, &.color_style_dark .slider-slide:nth-child(3n) .sc_services_item.with_image .sc_services_item_number { color: var(--theme-color-inverse_link) !important; } &.color_style_dark [class*="column-"]:nth-child(3n) .sc_services_item.with_image .sc_services_item_icon, &.color_style_dark .slider-slide:nth-child(3n) .sc_services_item.with_image .sc_services_item_icon { color: var(--theme-color-inverse_link) !important; } &.color_style_dark [class*="column-"]:nth-child(3n) .sc_services_item.with_image .sc_services_item_title, &.color_style_dark [class*="column-"]:nth-child(3n) .sc_services_item.with_image .sc_services_item_title a, &.color_style_dark .slider-slide:nth-child(3n) .sc_services_item.with_image .sc_services_item_title, &.color_style_dark .slider-slide:nth-child(3n) .sc_services_item.with_image .sc_services_item_title a { color: var(--theme-color-inverse_link) !important; } &.color_style_dark [class*="column-"]:nth-child(3n) .sc_services_item.with_image .sc_services_item_subtitle, &.color_style_dark [class*="column-"]:nth-child(3n) .sc_services_item.with_image .sc_services_item_subtitle a, &.color_style_dark .slider-slide:nth-child(3n) .sc_services_item.with_image .sc_services_item_subtitle, &.color_style_dark .slider-slide:nth-child(3n) .sc_services_item.with_image .sc_services_item_subtitle a { color: var(--theme-color-inverse_link) !important; } &.color_style_dark [class*="column-"]:nth-child(3n) .sc_services_item.with_image .sc_services_item_text, &.color_style_dark .slider-slide:nth-child(3n) .sc_services_item.with_image .sc_services_item_text { color: var(--theme-color-inverse_link_08) !important; } &.color_style_dark [class*="column-"]:nth-child(3n) .sc_services_item.with_image .sc_services_item_more_link, &.color_style_dark .slider-slide:nth-child(3n) .sc_services_item.with_image .sc_services_item_more_link { color: var(--theme-color-inverse_link) !important; } } /* Style 'Classic' +++++++++++++++++++++++ */ .sc_services_classic { .sc_services_item { @include flex; position:relative; z-index: 1; text-align: left; &:hover { z-index: 10; } &:before { content: ' '; @include box(0, 0); padding-top: 95%; display:inline-block; } } .sc_services_item.with_image .sc_services_item_content:before { content: ' '; @include abs-pos(0,0,0,0,-1); background: -moz-linear-gradient(top, rgba(0,0,0,0) 0%, rgba(0,0,0,1) 100%); background: -webkit-linear-gradient(top, rgba(0,0,0,0) 0%,rgba(0,0,0,1) 100%); background: linear-gradient(to bottom, rgba(0,0,0,0) 0%,rgba(0,0,0,1) 100%); @include transition(opacity .3s ease); opacity: .6; } .sc_services_item.with_image:hover .sc_services_item_content:before { opacity: 0; @include transition(opacity .3s ease); } .sc_services_item.with_image .sc_services_item_content:after { content: ' '; @include abs-pos(0,0,0,0,-1); background: rgba(31, 36, 46, 1); @include transition(opacity .3s ease); opacity: 0; } .sc_services_item.with_image:hover .sc_services_item_content:after { opacity: 0.9; @include transition(opacity .3s ease); } .sc_services_item.with_image .sc_services_item_content.without_image:before { display:none; } .sc_services_item_link { @include abs-cover(10); } .sc_services_item_content { @include flex; position: relative; z-index: 1; @include bg-cover; background-color: #05080d; width: 100%; max-height:100%; overflow:hidden; } .sc_services_item_content_inner { position: relative; z-index: 1; @include flex; @include flex-direction(column); @include flex-justify-content(stretch); @include flex-align-items(flex-start); @include border-box; width: 100%; max-height:100%; overflow:hidden; padding: 2em 2.2em; } .sc_services_item .sc_services_item_content_inner_top { @include transform(translateY(-15px)); opacity: 0; will-change: transform, opacity; @include transition(transform .3s ease-out, opacity .3s ease-out); } .sc_services_item:hover .sc_services_item_content_inner_top { @include transform(translateY(0)); opacity: 1; } .sc_services_item_content_inner_bottom { @include flex; @include flex-direction(column); @include flex-justify-content(flex-end); @include flex-grow(1); width: 100%; } .sc_services_item_info_wrap { @include flex; @include flex-justify-content(space-between); @include flex-align-items(center); } .sc_services_item_info_wrap + .sc_services_item_text { margin-top: 0.5em; } .sc_services_item_icon, .sc_services_item_pictogram { position: relative; display: inline-block; @include font(4em, 1em); } .sc_services_item_icon.sc_icon_type_svg svg { @include box(1em, 1em); } .sc_services_item_number { margin-top: 0; display: inline-block; @include font(1.556em, 1em, 600); letter-spacing: 0; } .sc_services_item_title_wrap { max-width: 75%; } .sc_services_item_title { @include font(1.556em, 1.2em, 600); margin: 0; } .sc_services_item_title + .sc_services_item_subtitle { margin-top: 0.4em; } .sc_services_item_text + .sc_services_item_title { margin-top: 0.25em; } .sc_services_item_price { @include font(1.5em, '', 600); text-shadow: none; margin-bottom: 0.5em; } .sc_services_item_text { @include font(17px, 1.5em); max-height: 4.8em; overflow: hidden; } .sc_services_item_content p { margin:0; } .sc_services_item_content p + p { margin-top:0.2em; } .sc_services_item .sc_services_item_more_link { padding: 1px; 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: #ffffff; z-index: 1; overflow: hidden; } .sc_services_item:hover .sc_services_item_more_link, .sc_services_item .sc_services_item_more_link:hover { color: #ffffff; } .sc_services_item .sc_services_item_more_link .link_text { display: none; position: relative; margin-right: 0; vertical-align: middle; text-indent: -110px; visibility: hidden; white-space: nowrap; opacity: 0; @include transition(visibility .4s ease, margin-right .4s ease-out, text-indent .5s ease-out, opacity .4s ease); will-change: visibility, margin-right, text-indent, opacity; } .sc_services_item:hover .sc_services_item_more_link .link_text, .sc_services_item .sc_services_item_more_link: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, opacity .4s ease); } .sc_services_item .sc_services_item_more_link .link_icon { position: relative; display: inline-block; vertical-align: middle; overflow: hidden; text-align: center; border: 1px solid #707070; @include box(3.1em, 3.1em, 3.05em); @include border-radius(50%); @include content-box; @include transition(border-color .3s ease); } .sc_services_item:hover .sc_services_item_more_link .link_icon { border-color: #ffffff; } .sc_services_item .sc_services_item_more_link .link_icon:before { @include font(11px, inherit, 400, inherit); content: '\E9A4'; font-family: $theme_icons; display: inline-block; vertical-align: top; color: currentColor; } .sc_services_item_price, .sc_services_item_price .amount, .sc_services_item_icon, .sc_services_item_number { color: #ffffff !important; } .sc_services_item_title, .sc_services_item_title a { color: #ffffff !important; } .sc_services_item_title a:hover { color: #ffffff !important; } .sc_services_item_subtitle, .sc_services_item_subtitle a { color: #ffffff !important; } .sc_services_item_subtitle a:hover { color: #ffffff !important; } .sc_services_item_content { color: #ffffff !important; } .sc_services_item_text { color: rgba(255,255,255,.8); } .sc_services_item.with_image .sc_services_item_content.without_image .sc_services_item_text { color: var(--theme-color-text) !important; } .sc_services_item.with_image .sc_services_item_content.without_image .sc_services_item_price, .sc_services_item.with_image .sc_services_item_content.without_image .sc_services_item_price .amount { color: var(--theme-color-text_dark) !important; } &.color_style_link2 .sc_services_item_icon { color: var(--theme-color-text_link2) !important; } &.color_style_link2 .sc_services_item_title a:hover, &.color_style_link2 .sc_services_item_subtitle a:hover { color: var(--theme-color-inverse_link) !important; } &.color_style_link3 .sc_services_item_icon { color: var(--theme-color-text_link3) !important; } &.color_style_link3 .sc_services_item_title a:hover, &.color_style_link3 .sc_services_item_subtitle a:hover { color: var(--theme-color-inverse_link) !important; } [class*="column-"] .sc_services_item.with_image .sc_services_item_content.without_image, .slider-slide .sc_services_item.with_image .sc_services_item_content.without_image { background-color: var(--theme-color-text_link_007); } [class*="column-"]:nth-child(3n-1) .sc_services_item.with_image .sc_services_item_content.without_image, .slider-slide:nth-child(3n-1) .sc_services_item.with_image .sc_services_item_content.without_image { background-color: var(--theme-color-text_link2_007); } [class*="column-"]:nth-child(3n) .sc_services_item.with_image .sc_services_item_content.without_image, .slider-slide:nth-child(3n) .sc_services_item.with_image .sc_services_item_content.without_image { background-color: var(--theme-color-text_link3_007); } .sc_services_item.with_image .sc_services_item_content.without_image:after { display: none; } .sc_services_item.with_image .sc_services_item_content.without_image .sc_services_item_more_link { color: var(--theme-color-text_dark) !important; } .sc_services_item.with_image .sc_services_item_content.without_image .sc_services_item_more_link .link_icon { border-color: var(--theme-color-bd_color) !important; } .sc_services_item.with_image:hover .sc_services_item_content.without_image .sc_services_item_more_link .link_icon { border-color: var(--theme-color-text_dark) !important; } .sc_services_item.with_image .sc_services_item_content.without_image .sc_services_item_icon, .sc_services_item.with_image .sc_services_item_content.without_image .sc_services_item_number { color: var(--theme-color-text_dark) !important; opacity: 1; } .sc_services_item.with_image .sc_services_item_content.without_image .sc_services_item_title, .sc_services_item.with_image .sc_services_item_content.without_image .sc_services_item_title a { color: var(--theme-color-text_dark) !important; } .sc_services_item.with_image:hover .sc_services_item_content.without_image .sc_services_item_title a, .sc_services_item.with_image .sc_services_item_content.without_image .sc_services_item_title a:hover { color: var(--theme-color-text_dark) !important; } &.color_style_link2 .sc_services_item.with_image:hover .sc_services_item_content.without_image .sc_services_item_title a, &.color_style_link2 .sc_services_item.with_image .sc_services_item_content.without_image .sc_services_item_title a:hover { color: var(--theme-color-text_dark) !important; } &.color_style_link3 .sc_services_item.with_image:hover .sc_services_item_content.without_image .sc_services_item_title a, &.color_style_link3 .sc_services_item.with_image .sc_services_item_content.without_image .sc_services_item_title a:hover { color: var(--theme-color-text_dark) !important; } .sc_services_item.with_image .sc_services_item_content.without_image .sc_services_item_subtitle, .sc_services_item.with_image .sc_services_item_content.without_image .sc_services_item_subtitle a { color: var(--theme-color-text_dark) !important; } &.color_style_link2 .sc_services_item.with_image .sc_services_item_content.without_image .sc_services_item_subtitle, &.color_style_link2 .sc_services_item.with_image .sc_services_item_content.without_image .sc_services_item_subtitle a { color: var(--theme-color-text_dark) !important; } &.color_style_link3 .sc_services_item.with_image .sc_services_item_content.without_image .sc_services_item_subtitle, &.color_style_link3 .sc_services_item.with_image .sc_services_item_content.without_image .sc_services_item_subtitle a { color: var(--theme-color-text_dark) !important; } .sc_services_item.with_image:hover .sc_services_item_content.without_image .sc_services_item_subtitle a, .sc_services_item.with_image .sc_services_item_content.without_image .sc_services_item_subtitle a:hover { color: var(--theme-color-text_dark) !important; } &.color_style_link2 .sc_services_item.with_image:hover .sc_services_item_content.without_image .sc_services_item_subtitle a, &.color_style_link2 .sc_services_item.with_image .sc_services_item_content.without_image .sc_services_item_subtitle a:hover { color: var(--theme-color-text_dark) !important; } &.color_style_link3 .sc_services_item.with_image:hover .sc_services_item_content.without_image .sc_services_item_subtitle a, &.color_style_link3 .sc_services_item.with_image .sc_services_item_content.without_image .sc_services_item_subtitle a:hover { color: var(--theme-color-text_dark) !important; } } /* Style 'Fashion' +++++++++++++++++++++++ */ .sc_services_fashion { .sc_services_item { @include flex; position:relative; z-index: 1; text-align: left; &:before { content: ' '; @include box(0, 0); padding-top: 151%; display:inline-block; } } .sc_services_item.with_image .sc_services_item_content:before { content: ' '; @include abs-pos(0,0,0,0,-1); background: rgba(0,0,0,.3); @include transition(opacity .3s ease-out, background-color .3s ease-out); } .sc_services_item.with_image:hover .sc_services_item_content:before { opacity: .9; background: var(--theme-color-text_link); } .sc_services_item.with_image .sc_services_item_content.without_image:before { display:none; } .sc_services_item_link { @include abs-cover(10); } .sc_services_item_content { @include flex; @include bg-mask(#05080d, 1, 1); @include bg-cover; @include box(100%, 100%); } .sc_services_item_content_inner { position: relative; z-index: 1; @include flex; @include flex-direction(column); @include flex-justify-content(stretch); @include flex-align-items(flex-start); @include border-box; width: 100%; max-height:100%; overflow:hidden; padding: 2.3em 2.3em; } .sc_services_item .sc_services_item_content_inner_top { margin-bottom: 20px; @include transform(translateY(-15px)); opacity: 0; will-change: transform, opacity; @include transition(transform .3s ease-out, opacity .3s ease-out); } .sc_services_item:hover .sc_services_item_content_inner_top { @include transform(translateY(0)); opacity: 1; } .sc_services_item_content_inner_bottom { @include flex; @include flex-direction(column); @include flex-justify-content(flex-end); @include flex-grow(1); width: 100%; } .sc_services_item.with_subtitle .sc_services_item_content_inner_bottom { will-change: transform; @include transition(transform .3s ease-out); @include transform(translateY(30px)); } .sc_services_item.with_subtitle:hover .sc_services_item_content_inner_bottom { @include transform(translateY(0)); } .sc_services_item_icon, .sc_services_item_pictogram { position: relative; display: inline-block; @include font(2.8em, 1em); } .sc_services_item_icon.sc_icon_type_svg svg { @include box(1em, 1em); } .sc_services_item_number { display: inline-block; @include font(24px, 1em, 600); letter-spacing: -0.2px; } .sc_services_item_title { @include font(1.556em, 1.3em, 600); margin: 0; } .sc_services_item_title + .sc_services_item_subtitle { margin-top: 0.3em; } .sc_services_item_subtitle { opacity: 0; will-change: opacity; @include transition(opacity .3s ease-out); } .sc_services_item:hover .sc_services_item_subtitle { opacity: 1; } .sc_services_item_price { @include font(1.5em, '', 600); text-shadow: none; margin-bottom: 0.5em; } .sc_services_item_text { @include font(17px, 1.5em); } .sc_services_item_text + .sc_services_item_title, .sc_services_item_text + .sc_services_item_subtitle { margin-top: 0.3em; } .sc_services_item_content p { margin:0; } .sc_services_item_content p + p { margin-top:0.2em; } .sc_services_item_price, .sc_services_item_price .amount, .sc_services_item_icon, .sc_services_item_number { color: #ffffff !important; } .sc_services_item_title, .sc_services_item_title a { color: #ffffff !important; } .sc_services_item_title a:hover { color: #ffffff !important; } .sc_services_item_subtitle, .sc_services_item_subtitle a { color: rgba(255,255,255,.8) !important; } .sc_services_item_subtitle a:hover { color: rgba(255,255,255,.8) !important; } .sc_services_item_content { color: #ffffff !important; } .sc_services_item_text { color: rgba(255,255,255,.8); } .sc_services_item.with_image .sc_services_item_content.without_image .sc_services_item_text { color: var(--theme-color-text) !important; } .sc_services_item.with_image .sc_services_item_content.without_image .sc_services_item_price, .sc_services_item.with_image .sc_services_item_content.without_image .sc_services_item_price .amount { color: var(--theme-color-text_dark) !important; } [class*="column-"] .sc_services_item.with_image .sc_services_item_content.without_image, .slider-slide .sc_services_item.with_image .sc_services_item_content.without_image { background-color: var(--theme-color-text_link_007); } [class*="column-"]:nth-child(3n-1) .sc_services_item.with_image .sc_services_item_content.without_image, .slider-slide:nth-child(3n-1) .sc_services_item.with_image .sc_services_item_content.without_image { background-color: var(--theme-color-text_link2_007); } [class*="column-"]:nth-child(3n) .sc_services_item.with_image .sc_services_item_content.without_image, .slider-slide:nth-child(3n) .sc_services_item.with_image .sc_services_item_content.without_image { background-color: var(--theme-color-text_link3_007); } .sc_services_item.with_image .sc_services_item_content.without_image .sc_services_item_icon, .sc_services_item.with_image .sc_services_item_content.without_image .sc_services_item_number { color: var(--theme-color-text_dark) !important; } .sc_services_item.with_image .sc_services_item_content.without_image .sc_services_item_subtitle, .sc_services_item.with_image .sc_services_item_content.without_image .sc_services_item_subtitle a { color: var(--theme-color-text_dark) !important; } .sc_services_item.with_image:hover .sc_services_item_content.without_image .sc_services_item_subtitle a, .sc_services_item.with_image .sc_services_item_content.without_image .sc_services_item_subtitle a:hover { color: var(--theme-color-text_dark) !important; } .sc_services_item.with_image .sc_services_item_content.without_image .sc_services_item_title, .sc_services_item.with_image .sc_services_item_content.without_image .sc_services_item_title a { color: var(--theme-color-text_dark) !important; } .sc_services_item.with_image:hover .sc_services_item_content.without_image .sc_services_item_title a, .sc_services_item.with_image .sc_services_item_content.without_image .sc_services_item_title a:hover { color: var(--theme-color-text_dark) !important; } &.color_style_link2 .sc_services_item.with_image:hover .sc_services_item_content:before { background: var(--theme-color-text_link2) !important; } &.color_style_link2 .sc_services_item.with_image .sc_services_item_price, &.color_style_link2 .sc_services_item.with_image .sc_services_item_price .amount, &.color_style_link2 .sc_services_item.with_image .sc_services_item_number { color: var(--theme-color-inverse_link) !important; } &.color_style_link2 .sc_services_item.with_image .sc_services_item_icon { color: var(--theme-color-inverse_link) !important; } &.color_style_link2 .sc_services_item.with_image:hover .sc_services_item_icon { color: var(--theme-color-inverse_link) !important; } &.color_style_link2 .sc_services_item.with_image .sc_services_item_title, &.color_style_link2 .sc_services_item.with_image .sc_services_item_title a { color: var(--theme-color-inverse_link) !important; } &.color_style_link2 .sc_services_item.with_image .sc_services_item_subtitle, &.color_style_link2 .sc_services_item.with_image .sc_services_item_subtitle a { color: var(--theme-color-inverse_link_08) !important; } &.color_style_link2 .sc_services_item.with_image:hover .sc_services_item_title, &.color_style_link2 .sc_services_item.with_image:hover .sc_services_item_title a, &.color_style_link2 .sc_services_item.with_image .sc_services_item_title a:hover { color: var(--theme-color-inverse_link) !important; } &.color_style_link2 .sc_services_item.with_image:hover .sc_services_item_subtitle, &.color_style_link2 .sc_services_item.with_image:hover .sc_services_item_subtitle a, &.color_style_link2 .sc_services_item.with_image .sc_services_item_subtitle a:hover { color: var(--theme-color-inverse_link_08) !important; } &.color_style_link2 .sc_services_item.with_image .sc_services_item_text { color: var(--theme-color-inverse_link_08) !important; } &.color_style_link2 .sc_services_item.with_image:hover .sc_services_item_content.without_image .sc_services_item_title a, &.color_style_link2 .sc_services_item.with_image .sc_services_item_content.without_image .sc_services_item_title a:hover { color: var(--theme-color-text_dark) !important; } &.color_style_link2 .sc_services_item.with_image .sc_services_item_content.without_image .sc_services_item_subtitle, &.color_style_link2 .sc_services_item.with_image .sc_services_item_content.without_image .sc_services_item_subtitle a { color: var(--theme-color-text_dark) !important; } &.color_style_link2 .sc_services_item.with_image:hover .sc_services_item_content.without_image .sc_services_item_subtitle a, &.color_style_link2 .sc_services_item.with_image .sc_services_item_content.without_image .sc_services_item_subtitle a:hover { color: var(--theme-color-text_dark) !important; } &.color_style_link3 .sc_services_item.with_image:hover .sc_services_item_content:before { background: var(--theme-color-text_link3) !important; } &.color_style_link3 .sc_services_item.with_image .sc_services_item_price, &.color_style_link3 .sc_services_item.with_image .sc_services_item_price .amount, &.color_style_link3 .sc_services_item.with_image .sc_services_item_number { color: var(--theme-color-inverse_link) !important; } &.color_style_link3 .sc_services_item.with_image .sc_services_item_icon { color: var(--theme-color-inverse_link) !important; } &.color_style_link3 .sc_services_item.with_image:hover .sc_services_item_icon { color: var(--theme-color-inverse_link) !important; } &.color_style_link3 .sc_services_item.with_image .sc_services_item_title, &.color_style_link3 .sc_services_item.with_image .sc_services_item_title a { color: var(--theme-color-inverse_link) !important; } &.color_style_link3 .sc_services_item.with_image:hover .sc_services_item_title, &.color_style_link3 .sc_services_item.with_image:hover .sc_services_item_title a, &.color_style_link3 .sc_services_item.with_image .sc_services_item_title a:hover { color: var(--theme-color-inverse_link) !important; } &.color_style_link3 .sc_services_item.with_image .sc_services_item_subtitle, &.color_style_link3 .sc_services_item.with_image .sc_services_item_subtitle a { color: var(--theme-color-inverse_link_08) !important; } &.color_style_link3 .sc_services_item.with_image:hover .sc_services_item_subtitle, &.color_style_link3 .sc_services_item.with_image:hover .sc_services_item_subtitle a, &.color_style_link3 .sc_services_item.with_image .sc_services_item_subtitle a:hover { color: var(--theme-color-inverse_link_08) !important; } &.color_style_link3 .sc_services_item.with_image .sc_services_item_text { color: var(--theme-color-inverse_link_08) !important; } &.color_style_link3 .sc_services_item.with_image:hover .sc_services_item_content.without_image .sc_services_item_title a, &.color_style_link3 .sc_services_item.with_image .sc_services_item_content.without_image .sc_services_item_title a:hover { color: var(--theme-color-text_dark) !important; } &.color_style_link3 .sc_services_item.with_image .sc_services_item_content.without_image .sc_services_item_subtitle, &.color_style_link3 .sc_services_item.with_image .sc_services_item_content.without_image .sc_services_item_subtitle a { color: var(--theme-color-text_dark) !important; } &.color_style_link3 .sc_services_item.with_image:hover .sc_services_item_content.without_image .sc_services_item_subtitle a, &.color_style_link3 .sc_services_item.with_image .sc_services_item_content.without_image .sc_services_item_subtitle a:hover { color: var(--theme-color-text_dark) !important; } &.color_style_dark .sc_services_item.with_image:hover .sc_services_item_content:before { background: var(--theme-color-text_dark) !important; } &.color_style_dark .sc_services_item.with_image .sc_services_item_price, &.color_style_dark .sc_services_item.with_image .sc_services_item_price .amount, &.color_style_dark .sc_services_item.with_image .sc_services_item_number { color: var(--theme-color-inverse_hover) !important; } &.color_style_dark .sc_services_item.with_image .sc_services_item_icon { color: var(--theme-color-inverse_hover) !important; } &.color_style_dark .sc_services_item.with_image:hover .sc_services_item_icon { color: var(--theme-color-inverse_hover) !important; } &.color_style_dark .sc_services_item.with_image .sc_services_item_title, &.color_style_dark .sc_services_item.with_image .sc_services_item_title a { color: var(--theme-color-inverse_hover) !important; } &.color_style_dark .sc_services_item.with_image:hover .sc_services_item_title, &.color_style_dark .sc_services_item.with_image:hover .sc_services_item_title a, &.color_style_dark .sc_services_item.with_image .sc_services_item_title a:hover { color: var(--theme-color-inverse_hover) !important; } &.color_style_dark .sc_services_item.with_image .sc_services_item_subtitle, &.color_style_dark .sc_services_item.with_image .sc_services_item_subtitle a { color: var(--theme-color-inverse_hover_08) !important; } &.color_style_dark .sc_services_item.with_image:hover .sc_services_item_subtitle, &.color_style_dark .sc_services_item.with_image:hover .sc_services_item_subtitle a, &.color_style_dark .sc_services_item.with_image .sc_services_item_subtitle a:hover { color: var(--theme-color-inverse_hover_08) !important; } &.color_style_dark .sc_services_item.with_image .sc_services_item_text { color: var(--theme-color-inverse_hover_08) !important; } } /* Style 'Backward' */ .sc_services_backward { .trx_addons_columns_wrap.columns_padding_bottom:not(.columns_in_single_row) .sc_services_item { padding-bottom: var(--theme-var-grid_gap); } .sc_services_item { color: var(--theme-color-text); background-color: transparent; overflow: hidden; } .sc_services_item:hover .post_featured.hover_link img { @include transform(scale(1.07, 1.07)); } .sc_services_item_info { padding: 4px 0 0 0; text-align: left; } .sc_services_item_info + .sc_services_item_thumb { margin-top: 3.5em; } .sc_services_item_content { @include font(17px, 1.65em); margin-top: 1.25em; } .sc_services_item_content p:last-child { margin-bottom: 0; } .sc_services_item_thumb { margin-bottom: 0; } .sc_services_item_number { display: inline-block; @include font(4em, 1em, 400); margin-top: 0.3em; color: var(--theme-color-text_dark); } .sc_services_item_icon, .sc_services_item_pictogram { position: relative; display: inline-block; font-size: 4.4em; @include box(auto, auto, 1em); margin-top: 0.3em; border: none; @include border-radius(0); } .sc_services_item_title { margin: 0; @include font(1.944em, 1.214em); } .sc_services_item_subtitle, .sc_services_item_subtitle a { color: var(--theme-color-text); } .sc_services_item:hover .sc_services_item_subtitle, .sc_services_item:hover .sc_services_item_subtitle a, .sc_services_item .sc_services_item_subtitle a:hover { color: var(--theme-color-text); } .sc_services_item_title + .sc_services_item_subtitle { margin-top: 0.45em; } .sc_services_item .sc_services_item_title, .sc_services_item .sc_services_item_title a { color: var(--theme-color-text_dark); } .sc_services_item:hover .sc_services_item_title, .sc_services_item:hover .sc_services_item_title a, .sc_services_item .sc_services_item_title a:hover { color: var(--theme-color-text_dark); } .sc_services_item .sc_services_item_button { margin: 1.2em 0 0; } .sc_services_item .sc_services_item_more_link { position: relative; z-index: 1; display: inline-block; @include font(14px, 21px, 700); text-transform: uppercase; letter-spacing: 1.4px; color: var(--theme-color-text_dark); overflow: hidden; } .sc_services_item:hover .sc_services_item_more_link, .sc_services_item .sc_services_item_more_link:hover { color: var(--theme-color-text_dark); } .sc_services_item .sc_services_item_more_link .link_text { display: inline-block; position: relative; margin-right: 0; vertical-align: middle; text-indent: -110px; visibility: hidden; white-space: nowrap; opacity: 0; @include transition(visibility .4s ease, margin-right .4s ease-out, text-indent .5s ease-out, opacity .4s ease); will-change: visibility, margin-right, text-indent, opacity; } .sc_services_item:hover .sc_services_item_more_link .link_text, .sc_services_item .sc_services_item_more_link:hover .link_text { opacity: 1; text-indent: 0; margin-right: 10px; visibility: visible; @include transition(visibility .4s ease, margin-right .3s ease-out, text-indent .4s ease-out, opacity .4s ease); } .sc_services_item .sc_services_item_more_link .link_icon { position: relative; display: inline-block; vertical-align: middle; overflow: hidden; @include box(1.4em, 1.4em, 1.4em); text-align: center; @include border-box; } .sc_services_item .sc_services_item_more_link .link_icon:before { @include font(9px, inherit, 400, inherit); content: '\E9A4'; font-family: $theme_icons; display: inline-block; vertical-align: top; color: currentColor; } .sc_services_item_icon { color: var(--theme-color-text_link); } .sc_services_item:hover .sc_services_item_icon { color: var(--theme-color-text_dark); } &.color_style_link2 .sc_services_item_icon { color: var(--theme-color-text_link2); } &.color_style_link2 .sc_services_item:hover .sc_services_item_icon { color: var(--theme-color-text_dark); } &.color_style_link3 .sc_services_item_icon { color: var(--theme-color-text_link3); } &.color_style_link3 .sc_services_item:hover .sc_services_item_icon { color: var(--theme-color-text_dark); } &.color_style_dark .sc_services_item_icon { color: var(--theme-color-text_dark); } &.color_style_dark .sc_services_item:hover .sc_services_item_icon { color: var(--theme-color-text_link); } &.color_style_link2 .sc_services_item_subtitle, &.color_style_link2 .sc_services_item_subtitle a { color: var(--theme-color-text); } &.color_style_link2 .sc_services_item:hover .sc_services_item_subtitle, &.color_style_link2 .sc_services_item:hover .sc_services_item_subtitle a, &.color_style_link2 .sc_services_item .sc_services_item_subtitle a:hover { color: var(--theme-color-text); } &.color_style_link3 .sc_services_item_subtitle, &.color_style_link3 .sc_services_item_subtitle a { color: var(--theme-color-text); } &.color_style_link3 .sc_services_item:hover .sc_services_item_subtitle, &.color_style_link3 .sc_services_item:hover .sc_services_item_subtitle a, &.color_style_link3 .sc_services_item .sc_services_item_subtitle a:hover { color: var(--theme-color-text); } &.color_style_dark .sc_services_item_subtitle, &.color_style_dark .sc_services_item_subtitle a { color: var(--theme-color-text); } &.color_style_dark .sc_services_item:hover .sc_services_item_subtitle, &.color_style_dark .sc_services_item:hover .sc_services_item_subtitle a, &.color_style_dark .sc_services_item .sc_services_item_subtitle a:hover { color: var(--theme-color-text); } } /* Style 'Accent' */ .sc_services_accent { .sc_services_item { padding: 4.4em 2.6em; color: var(--theme-color-alter_text); background-color: var(--theme-color-alter_bg_color); will-change: color, background-color; @include transition(color .3s ease, background-color .3s ease); } .sc_services_item:not(.with_image):hover { color: var(--theme-color-inverse_link_08); background-color: var(--theme-color-alter_link); } .sc_services_item.with_image { padding: 2.6em; } .sc_services_item:hover .post_featured.hover_link img { @include transform(scale(1.07, 1.07)); } .sc_services_item_content { @include font(17px, 1.65em); margin-top: 0.8em; color: var(--theme-color-alter_text); will-change: color; @include transition(color .3s ease); } .sc_services_item:not(.with_image):hover .sc_services_item_content { color: var(--theme-color-inverse_link_08); } .sc_services_item_content p:last-child { margin-bottom: 0; } .sc_services_item_number { display: inline-block; @include font(4em, 1em, 400); margin-top: 0; color: var(--theme-color-alter_dark); will-change: color; @include transition(color .3s ease); } .sc_services_item:not(.with_image):hover .sc_services_item_number { color: var(--theme-color-inverse_link); } .sc_services_item_featured_left .sc_services_item_number, .sc_services_item_featured_right .sc_services_item_number { @include font(3em, 1em); margin-top: 0; @include abs-lt(0, -5px); } .sc_services_item_featured_left .sc_services_item_icon, .sc_services_item_featured_right .sc_services_item_icon { font-size:3.4em; margin-top: 0; @include abs-lt; } .sc_services_item_featured_right .sc_services_item_thumb, .sc_services_item_featured_right .sc_services_item_icon, .sc_services_item_featured_right .sc_services_item_pictogram, .sc_services_item_featured_right .sc_services_item_number { left: auto; right: 0; } .sc_services_item_featured_right .sc_services_item_info { margin-right: 5em; } .sc_services_item_icon, .sc_services_item_pictogram { position: relative; display: inline-block; font-size: 4.1em; @include box(auto, auto, 1em); margin: 0; } .sc_services_item_number + .sc_services_item_info, .sc_services_item_icon + .sc_services_item_info, .sc_services_item_pictogram + .sc_services_item_info { margin-top: 2em; } .sc_services_item_title { @include font(1.556em, 1.214em); margin: 0; } .sc_services_item_subtitle, .sc_services_item_subtitle a { color: var(--theme-color-alter_text); } .sc_services_item:hover .sc_services_item_subtitle, .sc_services_item:hover .sc_services_item_subtitle a, .sc_services_item .sc_services_item_subtitle a:hover { color: var(--theme-color-alter_text); } .sc_services_item:not(.with_image):hover .sc_services_item_subtitle, .sc_services_item:not(.with_image):hover .sc_services_item_subtitle a, .sc_services_item:not(.with_image) .sc_services_item_subtitle a:hover { color: var(--theme-color-inverse_link); } .sc_services_item_title + .sc_services_item_subtitle { margin-top: 0.45em; } .sc_services_item .sc_services_item_title, .sc_services_item .sc_services_item_title a { color: var(--theme-color-alter_dark); } .sc_services_item:hover .sc_services_item_title, .sc_services_item:hover .sc_services_item_title a, .sc_services_item .sc_services_item_title a:hover { color: var(--theme-color-alter_dark); } .sc_services_item:not(.with_image):hover .sc_services_item_title, .sc_services_item:not(.with_image):hover .sc_services_item_title a, .sc_services_item:not(.with_image) .sc_services_item_title a:hover { color: var(--theme-color-inverse_link); } .sc_services_item_link { @include abs-cover(10); } .sc_services_item .sc_services_item_button { margin: 1.1em 0 0; } .sc_services_item .sc_services_item_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-alter_dark); z-index: 1; overflow: hidden; } .sc_services_item:hover .sc_services_item_more_link, .sc_services_item .sc_services_item_more_link:hover { color: var(--theme-color-alter_dark); } .sc_services_item:not(.with_image):hover .sc_services_item_more_link, .sc_services_item:not(.with_image) .sc_services_item_more_link:hover { color: var(--theme-color-inverse_link); } .sc_services_item .sc_services_item_more_link .link_text { display: none; position: relative; margin-right: 0; vertical-align: middle; text-indent: -110px; visibility: hidden; white-space: nowrap; opacity: 0; @include transition(visibility .4s ease, margin-right .4s ease-out, text-indent .5s ease-out, opacity .4s ease); will-change: visibility, margin-right, text-indent, opacity; } .sc_services_item.with_image .sc_services_item_more_link .link_text { display: inline-block; } .sc_services_item:hover .sc_services_item_more_link .link_text, .sc_services_item .sc_services_item_more_link:hover .link_text { opacity: 1; text-indent: 0; margin-right: 10px; visibility: visible; @include transition(visibility .4s ease, margin-right .3s ease-out, text-indent .4s ease-out, opacity .4s ease); } .sc_services_item .sc_services_item_more_link .link_icon { position: relative; display: inline-block; vertical-align: middle; overflow: hidden; @include box(1.4em, 1.4em, 1.4em); text-align: center; @include border-box; } .sc_services_item .sc_services_item_more_link .link_icon:before { @include font(11px, inherit, 400, inherit); content: '\E9A4'; font-family: $theme_icons; display: inline-block; vertical-align: top; color: currentColor; } .sc_services_item_icon { color: var(--theme-color-alter_link); } .sc_services_item:hover .sc_services_item_icon { color: var(--theme-color-inverse_link); } &.color_style_link2 .sc_services_item:not(.with_image):hover { background-color: var(--theme-color-alter_link2); } &.color_style_link2 .sc_services_item_icon { color: var(--theme-color-alter_link2); } &.color_style_link2 .sc_services_item:hover .sc_services_item_icon { color: var(--theme-color-inverse_link); } &.color_style_link2 .sc_services_item_subtitle, &.color_style_link2 .sc_services_item_subtitle a { color: var(--theme-color-alter_text); } &.color_style_link2 .sc_services_item:hover .sc_services_item_subtitle, &.color_style_link2 .sc_services_item:hover .sc_services_item_subtitle a, &.color_style_link2 .sc_services_item .sc_services_item_subtitle a:hover { color: var(--theme-color-alter_text); } &.color_style_link2 .sc_services_item:not(.with_image):hover .sc_services_item_subtitle, &.color_style_link2 .sc_services_item:not(.with_image):hover .sc_services_item_subtitle a, &.color_style_link2 .sc_services_item:not(.with_image) .sc_services_item_subtitle a:hover { color: var(--theme-color-inverse_link); } &.color_style_link3 .sc_services_item:not(.with_image):hover { background-color: var(--theme-color-alter_link3); } &.color_style_link3 .sc_services_item_icon { color: var(--theme-color-alter_link3); } &.color_style_link3 .sc_services_item:hover .sc_services_item_icon { color: var(--theme-color-inverse_link); } &.color_style_link3 .sc_services_item_subtitle, &.color_style_link3 .sc_services_item_subtitle a { color: var(--theme-color-alter_text); } &.color_style_link3 .sc_services_item:hover .sc_services_item_subtitle, &.color_style_link3 .sc_services_item:hover .sc_services_item_subtitle a, &.color_style_link3 .sc_services_item .sc_services_item_subtitle a:hover { color: var(--theme-color-alter_text); } &.color_style_link3 .sc_services_item:not(.with_image):hover .sc_services_item_subtitle, &.color_style_link3 .sc_services_item:not(.with_image):hover .sc_services_item_subtitle a, &.color_style_link3 .sc_services_item:not(.with_image) .sc_services_item_subtitle a:hover { color: var(--theme-color-inverse_link); } &.color_style_dark .sc_services_item:not(.with_image):hover { color: var(--theme-color-inverse_hover_08); background-color: var(--theme-color-alter_dark); } &.color_style_dark .sc_services_item_icon { color: var(--theme-color-alter_dark); } &.color_style_dark .sc_services_item:hover .sc_services_item_icon { color: var(--theme-color-inverse_hover); } &.color_style_dark .sc_services_item:not(.with_image):hover .sc_services_item_content { color: var(--theme-color-inverse_hover_08); } &.color_style_dark .sc_services_item:not(.with_image):hover .sc_services_item_more_link, &.color_style_dark .sc_services_item:not(.with_image) .sc_services_item_more_link:hover { color: var(--theme-color-inverse_hover); } &.color_style_dark .sc_services_item:not(.with_image):hover .sc_services_item_title, &.color_style_dark .sc_services_item:not(.with_image):hover .sc_services_item_title a, &.color_style_dark .sc_services_item:not(.with_image) .sc_services_item_title a:hover { color: var(--theme-color-inverse_hover); } &.color_style_dark .sc_services_item_subtitle, &.color_style_dark .sc_services_item_subtitle a { color: var(--theme-color-alter_text); } &.color_style_dark .sc_services_item:hover .sc_services_item_subtitle, &.color_style_dark .sc_services_item:hover .sc_services_item_subtitle a, &.color_style_dark .sc_services_item .sc_services_item_subtitle a:hover { color: var(--theme-color-alter_text); } &.color_style_dark .sc_services_item:not(.with_image):hover .sc_services_item_subtitle, &.color_style_dark .sc_services_item:not(.with_image):hover .sc_services_item_subtitle a, &.color_style_dark .sc_services_item:not(.with_image) .sc_services_item_subtitle a:hover { color: var(--theme-color-inverse_hover); } &.color_style_dark .sc_services_item:not(.with_image):hover .sc_services_item_number { color: var(--theme-color-inverse_hover); } } /* Style 'Unusual' */ .sc_services_unusual { .sc_services_item:hover .post_featured.hover_link img { @include transform(scale(1.07, 1.07)); } .sc_services_item_thumb { margin-bottom: 1.2em; } .sc_services_item_info { overflow: hidden; } .sc_services_item_header { padding-bottom: 1.5em; position: relative; z-index: 1; } .sc_services_item_header:before, .sc_services_item_header:after { content: ''; display: block; height: 1px; width: 100%; @include abs-lb; background-color: var(--theme-color-bd_color); } .sc_services_item_header:after { width: 0; background-color: var(--theme-color-text_dark); will-change: width; @include transition(width .4s ease); } .sc_services_item:hover .sc_services_item_header:after { width: 100%; } .sc_services_item_title_wrap { @include flex; @include flex-justify-content(space-between); @include flex-align-items(center); } .sc_services_item_title_wrap + .sc_services_item_subtitle, .sc_services_item_title_wrap + .sc_services_item_price { margin-top: 0.5em; } .sc_services_item_subtitle + .sc_services_item_price { margin-top: 0.5em; } .sc_services_item_content { @include font(17px, 1.65em); margin-top: 1em; } .sc_services_item_content p:last-child { margin-bottom: 0; } .sc_services_item_title { margin: 0; @include font(1.556em, 1.214em); -ms-text-overflow: ellipsis; text-overflow: ellipsis; overflow: hidden; white-space: nowrap; } .sc_services_item_title, .sc_services_item_title a { width: 100%; @include flex; @include flex-align-items(center); } .sc_services_item_title_text { padding: 1px 0; width: 100%; display: inline-block; -ms-text-overflow: ellipsis; text-overflow: ellipsis; overflow: hidden; white-space: nowrap; } .sc_services_item_price { @include font(1.2em, 1.3em, 500); color: var(--theme-color-text_dark); } .sc_services_item_number { padding: 1px 0; margin-right: 0; display: inline-block; @include font(inherit, inherit, inherit); color: inherit; opacity: 0; text-indent: -50px; white-space: nowrap; will-change: text-indent, opacity, margin-right; @include transition(text-indent .4s ease-out, opacity .4s ease-out, margin-right .2s ease-out); } .sc_services_item:hover .sc_services_item_number { opacity: 1; text-indent: 0; margin-right: 0.45em; } .sc_services_item_icon, .sc_services_item_pictogram { position: relative; display: inline-block; font-size: 4em; @include box(auto, auto, 1em); } .sc_services_item_icon + .sc_services_item_info, .sc_services_item_pictogram + .sc_services_item_info { margin-top: 1.2em; } .sc_services_item_subtitle, .sc_services_item_subtitle a { color: var(--theme-color-text); } .sc_services_item:hover .sc_services_item_subtitle, .sc_services_item:hover .sc_services_item_subtitle a, .sc_services_item .sc_services_item_subtitle a:hover { color: var(--theme-color-text); } .sc_services_item_title + .sc_services_item_subtitle { margin-top: 0.45em; } .sc_services_item .sc_services_item_title, .sc_services_item .sc_services_item_title a { color: var(--theme-color-text_dark); } .sc_services_item:hover .sc_services_item_title, .sc_services_item:hover .sc_services_item_title a, .sc_services_item .sc_services_item_title a:hover { color: var(--theme-color-text_dark); } .sc_services_item .sc_services_item_button { width: 25%; text-align: right; } .sc_services_item .sc_services_item_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; } .sc_services_item:hover .sc_services_item_more_link, .sc_services_item .sc_services_item_more_link:hover { color: var(--theme-color-text_dark); } .sc_services_item .sc_services_item_more_link .link_text { display: none; position: relative; margin-right: 0; vertical-align: middle; text-indent: -110px; visibility: hidden; white-space: nowrap; opacity: 0; @include transition(visibility .4s ease, margin-right .4s ease-out, text-indent .5s ease-out, opacity .4s ease); will-change: visibility, margin-right, text-indent, opacity; } .sc_services_item:hover .sc_services_item_more_link .link_text, .sc_services_item .sc_services_item_more_link:hover .link_text { opacity: 1; text-indent: 0; margin-right: 10px; visibility: visible; @include transition(visibility .4s ease, margin-right .3s ease-out, text-indent .4s ease-out, opacity .4s ease); } .sc_services_item .sc_services_item_more_link .link_icon { position: relative; display: inline-block; vertical-align: middle; overflow: hidden; @include box(2.3em, 2.3em, 2.25em); text-align: center; border: 1px solid var(--theme-color-bd_color); @include border-box; @include border-radius(50%); will-change: border-color; @include transition(border-color .3s .1s ease-out); } .sc_services_item:hover .sc_services_item_more_link .link_icon { border-color: var(--theme-color-text_dark); } .sc_services_item .sc_services_item_more_link .link_icon:before { @include font(9px, inherit, 400, inherit); content: '\E9A4'; font-family: $theme_icons; display: inline-block; vertical-align: top; color: currentColor; } .sc_services_item_icon { color: var(--theme-color-text_link); } .sc_services_item:hover .sc_services_item_icon { color: var(--theme-color-text_dark); } &.color_style_link2 .sc_services_item_icon { color: var(--theme-color-text_link2); } &.color_style_link2 .sc_services_item:hover .sc_services_item_icon { color: var(--theme-color-text_dark); } &.color_style_link2 .sc_services_item_subtitle a { color: var(--theme-color-text); } &.color_style_link2 .sc_services_item_subtitle a:hover { color: var(--theme-color-text); } &.color_style_link3 .sc_services_item_icon { color: var(--theme-color-text_link3); } &.color_style_link3 .sc_services_item:hover .sc_services_item_icon { color: var(--theme-color-text_dark); } &.color_style_link3 .sc_services_item_subtitle a { color: var(--theme-color-text); } &.color_style_link3 .sc_services_item_subtitle a:hover { color: var(--theme-color-text); } &.color_style_dark .sc_services_item_icon { color: var(--theme-color-text_dark); } &.color_style_dark .sc_services_item:hover .sc_services_item_icon { color: var(--theme-color-text_link); } &.color_style_dark .sc_services_item_subtitle a { color: var(--theme-color-text); } &.color_style_dark .sc_services_item_subtitle a:hover { color: var(--theme-color-text); } } /* Style 'Price' */ .sc_services_price { .trx_addons_columns_wrap .trx_addons_column-1_4 .sc_services_item_title_wrap, .trx_addons_columns_wrap .trx_addons_column-1_5 .sc_services_item_title_wrap, .trx_addons_columns_wrap .trx_addons_column-1_6 .sc_services_item_title_wrap { @include flex-justify-content(flex-start); @include flex-align-items(flex-start); @include flex-direction(column); .sc_services_item_price_dots { margin: 10px 0 20px; } .sc_services_item_title { min-width: inherit !important; max-width: none !important; } .sc_services_item_price { max-width: none !important; } } .trx_addons_columns_wrap { margin-right: -50px; > [class*="trx_addons_column-"] { padding-right: 50px; } } .trx_addons_columns_wrap.columns_padding_bottom:not(.columns_in_single_row) { margin-bottom: -50px; } .trx_addons_columns_wrap.columns_padding_bottom > [class*="trx_addons_column-"], .trx_addons_columns_wrap > [class*="trx_addons_column-"].columns_padding_bottom { padding-bottom: 50px; } .trx_addons_columns_wrap.columns_padding_bottom.columns_in_single_row > [class*="trx_addons_column-"] { padding-bottom: 0; } .sc_services_item + .sc_services_item { margin-top: var(--theme-var-grid_gap); } .sc_services_item:hover .post_featured.hover_link img { @include transform(scale(1.07, 1.07)); } .sc_services_item_content { @include font(17px, 1.65em); margin-top: 0.6em; } .sc_services_item_content p:last-child { margin-bottom: 0; } .sc_services_item_number { display: inline-block; @include font(3.5em, 1em, 400); color: var(--theme-color-text_dark); } .sc_services_item_icon, .sc_services_item_pictogram { position: relative; display: inline-block; font-size: 4em; @include box(auto, auto, 1em); } .sc_services_item_number + .sc_services_item_info, .sc_services_item_icon + .sc_services_item_info, .sc_services_item_pictogram + .sc_services_item_info { margin-top: 1.5em; } .sc_services_item_title_wrap { width: 100%; @include flex; @include flex-justify-content(space-between); @include flex-align-items(center); } .sc_item_columns_4 .sc_services_item_title_wrap, .sc_item_columns_5 .sc_services_item_title_wrap, .sc_item_columns_6 .sc_services_item_title_wrap { flex-wrap: wrap; } .sc_item_columns_4 .sc_services_item_price_dots, .sc_item_columns_5 .sc_services_item_price_dots, .sc_item_columns_6 .sc_services_item_price_dots { margin: 0 0 10px; } .sc_services_item_title_wrap + .sc_services_item_subtitle { margin-top: 0.6em; } .sc_services_item_price_dots { display: block; margin: 0 20px; position: relative; z-index: 1; line-height: 1; width: 100%; min-width: 20px; white-space: nowrap; text-overflow: ellipsis; overflow: hidden; @include border-box; } .sc_services_item_price_dots:after { content: '. . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .'; display: block; font-size: 20px; color: var(--theme-color-text_light); } .sc_services_item_price { @include font(1.389em, 1em, 600); color: var(--theme-color-text_link); flex-shrink: 0; max-width: 110px; } .sc_services_item_title { @include font(1.333em, 1.214em); margin: 0; flex-shrink: 0; min-width: 15%; max-width: 60%; } .sc_services_item_subtitle, .sc_services_item_subtitle a { color: var(--theme-color-text); } .sc_services_item:hover .sc_services_item_subtitle, .sc_services_item:hover .sc_services_item_subtitle a, .sc_services_item .sc_services_item_subtitle a:hover { color: var(--theme-color-text); } .sc_services_item_title + .sc_services_item_subtitle { margin-top: 0.45em; } .sc_services_item .sc_services_item_title, .sc_services_item .sc_services_item_title a { color: var(--theme-color-text_dark); } .sc_services_item:hover .sc_services_item_title, .sc_services_item:hover .sc_services_item_title a, .sc_services_item .sc_services_item_title a:hover { color: var(--theme-color-text_dark); } .sc_services_item .sc_services_item_button { margin: 1.1em 0 0; } .sc_services_item .sc_services_item_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; } .sc_services_item:hover .sc_services_item_more_link, .sc_services_item .sc_services_item_more_link:hover { color: var(--theme-color-text_dark); } .sc_services_item .sc_services_item_more_link .link_text { display: inline-block; position: relative; margin-right: 0; vertical-align: middle; text-indent: -110px; visibility: hidden; white-space: nowrap; opacity: 0; @include transition(visibility .4s ease, margin-right .4s ease-out, text-indent .5s ease-out, opacity .4s ease); will-change: visibility, margin-right, text-indent, opacity; } .sc_services_item:hover .sc_services_item_more_link .link_text, .sc_services_item .sc_services_item_more_link:hover .link_text { opacity: 1; text-indent: 0; margin-right: 10px; visibility: visible; @include transition(visibility .4s ease, margin-right .3s ease-out, text-indent .4s ease-out, opacity .4s ease); } .sc_services_item .sc_services_item_more_link .link_icon { position: relative; display: inline-block; vertical-align: middle; overflow: hidden; @include box(2.3em, 2.3em, 2.25em); text-align: center; border: 1px solid var(--theme-color-text_dark_02); @include border-box; @include border-radius(50%); } .sc_services_item .sc_services_item_more_link .link_icon:before { @include font(9px, inherit, 400, inherit); content: '\E9A4'; font-family: $theme_icons; display: inline-block; vertical-align: top; color: currentColor; } .sc_services_item_icon { color: var(--theme-color-text_link); } .sc_services_item:hover .sc_services_item_icon { color: var(--theme-color-text_dark); } &.color_style_link2 .sc_services_item_icon { color: var(--theme-color-text_link2); } &.color_style_link2 .sc_services_item:hover .sc_services_item_icon { color: var(--theme-color-text_dark); } &.color_style_link2 .sc_services_item_price { color: var(--theme-color-text_link2); } &.color_style_link2 .sc_services_item_subtitle, &.color_style_link2 .sc_services_item_subtitle a { color: var(--theme-color-text); } &.color_style_link2 .sc_services_item:hover .sc_services_item_subtitle, &.color_style_link2 .sc_services_item:hover .sc_services_item_subtitle a, &.color_style_link2 .sc_services_item .sc_services_item_subtitle a:hover { color: var(--theme-color-text); } &.color_style_link3 .sc_services_item_icon { color: var(--theme-color-text_link3); } &.color_style_link3 .sc_services_item:hover .sc_services_item_icon { color: var(--theme-color-text_dark); } &.color_style_link3 .sc_services_item_price { color: var(--theme-color-text_link3); } &.color_style_link3 .sc_services_item_subtitle, &.color_style_link3 .sc_services_item_subtitle a { color: var(--theme-color-text); } &.color_style_link3 .sc_services_item:hover .sc_services_item_subtitle, &.color_style_link3 .sc_services_item:hover .sc_services_item_subtitle a, &.color_style_link3 .sc_services_item .sc_services_item_subtitle a:hover { color: var(--theme-color-text); } &.color_style_dark .sc_services_item_icon { color: var(--theme-color-text_dark); } &.color_style_dark .sc_services_item:hover .sc_services_item_icon { color: var(--theme-color-text_link); } &.color_style_dark .sc_services_item_price { color: var(--theme-color-text_dark); } &.color_style_dark.sc_services_item_subtitle, &.color_style_dark .sc_services_item_subtitle a { color: var(--theme-color-text); } &.color_style_dark .sc_services_item:hover .sc_services_item_subtitle, &.color_style_dark .sc_services_item:hover .sc_services_item_subtitle a, &.color_style_dark .sc_services_item .sc_services_item_subtitle a:hover { color: var(--theme-color-text); } } /* Style 'Price 2' */ .sc_services_price2 { .trx_addons_columns_wrap.columns_padding_bottom:not(.columns_in_single_row) { margin-bottom: calc(-1 * var(--theme-var-grid_gap)); } .sc_services_item { position: relative; z-index: 1; } .sc_services_item_divider { margin-top: 0.7em; display: block; position: relative; z-index: 1; width: 100%; line-height: 1; white-space: nowrap; text-overflow: ellipsis; overflow: hidden; @include border-box; } .sc_services_item_divider:after { content: '. . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .'; font-size: 20px; display: block; color: var(--theme-color-text_light); } .sc_services_item + .sc_services_item { margin-top: var(--theme-var-grid_gap); } .sc_services_item:hover .post_featured.hover_link img { @include transform(scale(1.07, 1.07)); } .sc_services_item_content { @include font(17px, 1.65em); margin-top: 0.5em; } .sc_services_item_content p:last-child { margin-bottom: 0; } .sc_services_item_number { display: inline-block; @include font(3.5em, 1em, 400); color: var(--theme-color-text_dark); } .sc_services_item_icon, .sc_services_item_pictogram { position: relative; display: inline-block; font-size: 4em; @include box(auto, auto, 1em); } .sc_services_item_number + .sc_services_item_info, .sc_services_item_icon + .sc_services_item_info, .sc_services_item_pictogram + .sc_services_item_info { margin-top: 1.5em; } .sc_services_item_title_wrap { width: 100%; @include flex; @include flex-justify-content(space-between); @include flex-align-items(center); } .sc_services_item_title_wrap + .sc_services_item_subtitle { margin-top: 0.6em; } .sc_services_item_price { @include font(1.389em, 1em, 600); color: var(--theme-color-text_link); flex-shrink: 0; } .sc_services_item_title { @include font(1.333em, 1.214em); margin: 0; flex-shrink: 0; max-width: 75%; } .sc_services_item_subtitle, .sc_services_item_subtitle a { color: var(--theme-color-text); } .sc_services_item:hover .sc_services_item_subtitle, .sc_services_item:hover .sc_services_item_subtitle a, .sc_services_item .sc_services_item_subtitle a:hover { color: var(--theme-color-text); } .sc_services_item_title + .sc_services_item_subtitle { margin-top: 0.45em; } .sc_services_item .sc_services_item_title, .sc_services_item .sc_services_item_title a { color: var(--theme-color-text_dark); } .sc_services_item:hover .sc_services_item_title, .sc_services_item:hover .sc_services_item_title a, .sc_services_item .sc_services_item_title a:hover { color: var(--theme-color-text_dark); } .sc_services_item .sc_services_item_button { margin: 1.1em 0 0; } .sc_services_item .sc_services_item_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; } .sc_services_item:hover .sc_services_item_more_link, .sc_services_item .sc_services_item_more_link:hover { color: var(--theme-color-text_dark); } .sc_services_item .sc_services_item_more_link .link_text { display: inline-block; position: relative; margin-right: 0; vertical-align: middle; text-indent: -110px; visibility: hidden; white-space: nowrap; opacity: 0; @include transition(visibility .4s ease, margin-right .4s ease-out, text-indent .5s ease-out, opacity .4s ease); will-change: visibility, margin-right, text-indent, opacity; } .sc_services_item:hover .sc_services_item_more_link .link_text, .sc_services_item .sc_services_item_more_link:hover .link_text { opacity: 1; text-indent: 0; margin-right: 10px; visibility: visible; @include transition(visibility .4s ease, margin-right .3s ease-out, text-indent .4s ease-out, opacity .4s ease); } .sc_services_item .sc_services_item_more_link .link_icon { position: relative; display: inline-block; vertical-align: middle; overflow: hidden; @include box(2.3em, 2.3em, 2.25em); text-align: center; border: 1px solid var(--theme-color-text_dark_02); @include border-box; @include border-radius(50%); } .sc_services_item .sc_services_item_more_link .link_icon:before { @include font(9px, inherit, 400, inherit); content: '\E9A4'; font-family: $theme_icons; display: inline-block; vertical-align: top; color: currentColor; } .sc_services_item_icon { color: var(--theme-color-text_link); } .sc_services_item:hover .sc_services_item_icon { color: var(--theme-color-text_dark); } &.color_style_link2 .sc_services_item_icon { color: var(--theme-color-text_link2); } &.color_style_link2 .sc_services_item:hover .sc_services_item_icon { color: var(--theme-color-text_dark); } &.color_style_link2 .sc_services_item_price { color: var(--theme-color-text_link2); } &.color_style_link2 .sc_services_item_subtitle, &.color_style_link2 .sc_services_item_subtitle a { color: var(--theme-color-text); } &.color_style_link2 .sc_services_item:hover .sc_services_item_subtitle, &.color_style_link2 .sc_services_item:hover .sc_services_item_subtitle a, &.color_style_link2 .sc_services_item .sc_services_item_subtitle a:hover { color: var(--theme-color-text); } &.color_style_link3 .sc_services_item_icon { color: var(--theme-color-text_link3); } &.color_style_link3 .sc_services_item:hover .sc_services_item_icon { color: var(--theme-color-text_dark); } &.color_style_link3 .sc_services_item_price { color: var(--theme-color-text_link3); } &.color_style_link3 .sc_services_item_subtitle, &.color_style_link3 .sc_services_item_subtitle a { color: var(--theme-color-text); } &.color_style_link3 .sc_services_item:hover .sc_services_item_subtitle, &.color_style_link3 .sc_services_item:hover .sc_services_item_subtitle a, &.color_style_link3 .sc_services_item .sc_services_item_subtitle a:hover { color: var(--theme-color-text); } &.color_style_dark .sc_services_item_icon { color: var(--theme-color-text_dark); } &.color_style_dark .sc_services_item:hover .sc_services_item_icon { color: var(--theme-color-text_link); } &.color_style_dark .sc_services_item_price { color: var(--theme-color-text_dark); } &.color_style_dark.sc_services_item_subtitle, &.color_style_dark .sc_services_item_subtitle a { color: var(--theme-color-text); } &.color_style_dark .sc_services_item:hover .sc_services_item_subtitle, &.color_style_dark .sc_services_item:hover .sc_services_item_subtitle a, &.color_style_dark .sc_services_item .sc_services_item_subtitle a:hover { color: var(--theme-color-text); } } /* Style Panel ++++++++++++++++*/ .sc_services_panel { .sc_services_content .sc_services_item + .sc_services_item { border: none; border-top: 1px solid rgba(255, 255, 255, 0.3); } .sc_services_columns_wrap { overflow: hidden; [class*="trx_addons_column-"] { .sc_services_item { border: none !important; } position: relative; &:before { content: ""; display: block; @include abs-pos(-1px, 0, 0, -1px, 1); border-top: 1px solid; border-left: 1px solid; border-color: rgba(255, 255, 255, 0.3); } } } .sc_services_columns_wrap [class*="trx_addons_column-"], .sc_item_posts_container [class*="trx_addons_column-"] { padding: 0 !important; } .sc_services_item .sc_services_item_content { @include flex; @include abs-pos; height: 100%; width: 100%; margin-top: 0; } .sc_services_item_content_inner { position: relative; z-index: 1; @include flex; @include flex-direction(column); @include flex-justify-content(stretch); @include flex-align-items(flex-start); @include border-box; width: 100%; max-height: 100%; overflow: hidden; padding: 2em 2.2em 2.4em; } .sc_services_item .sc_services_item_content_inner_top { @include transform(translateY(-15px)); opacity: 0; will-change: transform, opacity; @include transition(transform .3s ease-out, opacity .3s ease-out); } .sc_services_item:hover .sc_services_item_content_inner_top { @include transform(translateY(0)); opacity: 1; } .sc_services_item_content_inner_bottom { @include flex-grow(1); @include flex; @include flex-direction(column); @include flex-justify-content(flex-end); position: relative; z-index: 1; width: 100%; max-height: 100%; overflow: hidden; @include border-box; } .sc_services_item.with_more:not(.no_links) .sc_services_item_content_inner_bottom { @include transform(translateY(50px)); will-change: transform; @include transition(transform .3s ease-out); } .sc_services_item.with_more:not(.no_links):hover .sc_services_item_content_inner_bottom { @include transform(translateY(0)); } .sc_services_item { .sc_services_item_thumb { margin: 0; @include square(4em); @include border-radius(50%); border: 1px solid rgba(255,255,255,.2); } .sc_services_item_number { display: inline-block; @include font(24px, 1em, 600); letter-spacing: -0.2px; color: #fcfcfc; } .sc_services_item_icon, .sc_services_item_pictogram { position: relative; display: inline-block; @include font(2.8em, 1em); @include border-radius(0); @include box(auto, auto); } .sc_services_item_icon { color: #fcfcfc; } .sc_services_item_icon.sc_icon_type_svg svg { @include box(1em, 1em); } .sc_services_item_title { @include font(1.556em, 1.3em, 600); margin: 0; } .sc_services_item_title, .sc_services_item_title a { color: #fcfcfc; } .sc_services_item_title + .sc_services_item_subtitle { margin-top: 0.3em; } .sc_services_item_text { @include font(17px, 1.65em); max-height: 4.8em; overflow: hidden; color: rgba(255,255,255, .8); p:last-child { margin-bottom: 0; } } .sc_services_item_header + .sc_services_item_text { margin-top: 0.6em; } .sc_services_item_price { @include font(1.2em, '', 600); text-shadow: none; margin-bottom: 0.5em; } .sc_services_item_button { margin-top: 1em; opacity: 0; @include transition(opacity .3s ease-out !important); } &:hover .sc_services_item_button { opacity: 1; } .sc_services_item_more_link { position: relative; display: inline-block; top: auto; left: auto; height: auto; width: auto; @include font(14px, 21px, 700); color: #fcfcfc; z-index: 1; overflow: hidden; .link_text { display: inline-block; position: relative; margin-right: 0; vertical-align: middle; text-indent: -110px; visibility: hidden; white-space: nowrap; opacity: 0; @include transition(visibility .4s ease, margin-right .4s ease-out, text-indent .5s ease-out, opacity .4s ease); will-change: visibility, margin-right, text-indent, opacity; } .link_icon { position: relative; display: inline-block; vertical-align: middle; overflow: hidden; @include box(1.4em, 1.4em, 1.4em); text-align: center; @include border-box; &:before { @include font(9px, inherit, 400, inherit); content: '\E9A4'; font-family: $theme_icons; display: inline-block; vertical-align: top; color: currentColor; } } } &:hover .sc_services_item_more_link, .sc_services_item_more_link:hover { color: #fcfcfc; } .sc_services_item_more_link .link_text, &:hover .sc_services_item_more_link .link_text, .sc_services_item_more_link:hover .link_text { opacity: 1; text-indent: 0; margin-right: 10px; visibility: visible; @include transition(visibility .4s ease, margin-right .3s ease-out, text-indent .4s ease-out, opacity .4s ease); } .sc_services_item_thumb, &:hover .sc_services_item_thumb, .sc_services_item_pictogram, &:hover .sc_services_item_pictogram, .sc_services_item_icon, &:hover .sc_services_item_icon, .sc_services_item_number, &:hover .sc_services_item_number, .sc_services_item_title, &:hover .sc_services_item_title, .sc_services_item_subtitle, &:hover .sc_services_item_subtitle, .sc_services_item_meta, &:hover .sc_services_item_meta, .sc_services_item_content, &:hover .sc_services_item_content, .sc_services_item_button, &:hover .sc_services_item_button { @include transform(none); @include transition(none); } position: relative; padding: 0; &:before { content: ''; width: 0; height: 0; padding-top: 114%; display: inline-block; } &:after { content:''; display: block; @include abs-pos; z-index: -1; background-color: var(--theme-color-inverse_dark); @include transition(opacity .3s ease-out); opacity: 0; } } .sc_services_panel_thumbs { background-color: #000; &:before { background: -moz-linear-gradient(top, rgba(0,0,0,0) 0%, rgba(0,0,0,1) 100%); background: -webkit-linear-gradient(top, rgba(0,0,0,0) 0%,rgba(0,0,0,1) 100%); background: linear-gradient(to bottom, rgba(0,0,0,0) 0%,rgba(0,0,0,1) 100%); opacity: .7; } } .sc_services_item_link { @include abs-cover(10); } } /* Socials */ .socials_wrap:not(.socials_type_list) .social_item .social_icon { background-color: var(--theme-color-alter_bg_color); } .socials_wrap:not(.socials_type_list) .social_item .social_icon, .socials_wrap:not(.socials_type_list) .social_item .social_icon i { color: var(--theme-color-alter_dark); } .socials_wrap:not(.socials_type_list) .social_item:hover .social_icon { background-color: var(--theme-color-alter_bg_color); } .socials_wrap:not(.socials_type_list) .social_item:hover .social_icon, .socials_wrap:not(.socials_type_list) .social_item:hover .social_icon i { color: var(--theme-color-alter_link); } [class*="scheme_"].sidebar .socials_wrap:not(.socials_type_list) .social_item .social_icon { color: var(--theme-color-alter_dark); background-color: var(--theme-color-bg_color); } [class*="scheme_"].sidebar .socials_wrap:not(.socials_type_list) .social_item:hover .social_icon { color: var(--theme-color-alter_hover); background-color: var(--theme-color-bg_color); } [class*="scheme_"].sidebar .sc_layouts_row_type_compact .socials_wrap .social_item .social_icon, [class*="scheme_"].footer_wrap .sc_layouts_row_type_compact .socials_wrap .social_item .social_icon { color: var(--theme-color-text_dark); background-color: transparent !important; } [class*="scheme_"].sidebar .sc_layouts_row_type_compact .socials_wrap .social_item:hover .social_icon, [class*="scheme_"].footer_wrap .sc_layouts_row_type_compact .socials_wrap .social_item:hover .social_icon { color: var(--theme-color-text_link); background-color: transparent !important; } /* Super Title */ .sc_supertitle_no_icon { background-color: var(--theme-color-text_link); } /* Testimonials */ .sc_testimonials_item_content:before { content: '\e8b6'; font-family:$theme_icons; } .sc_testimonials_item_author_subtitle { color: var(--theme-color-text_light); } .sc_testimonials_simple .sc_testimonials_item_author_data:before { background-color: var(--theme-color-text_light); } .sc_testimonials_simple [class*="column"] .sc_testimonials_item_author_data { border-color: var(--theme-color-text_light); } .sc_testimonials_rating_stars_default, .sc_testimonials_rating_stars_hover { color: var(--theme-color-text_hover); } [class*="scheme_"].sidebar .sc_testimonials_rating_stars_default, [class*="scheme_"].sidebar .sc_testimonials_rating_stars_hover { color: var(--theme-color-alter_hover); } .color_style_link2 .sc_testimonials_rating_stars_default, .color_style_link2 .sc_testimonials_rating_stars_hover { color: var(--theme-color-text_hover2); } .color_style_link3 .sc_testimonials_rating_stars_default, .color_style_link3 .sc_testimonials_rating_stars_hover { color: var(--theme-color-text_hover3); } .color_style_dark .sc_testimonials_rating_stars_default, .color_style_dark .sc_testimonials_rating_stars_hover { color: var(--theme-color-text_dark); } /* Utils --------------------------------------------------- */ /* Loading mask */ .sc_blogger .trx_addons_loading { background-color: var(--theme-color-bg_color_02); } ul.sc_layouts_submenu .sc_blogger .trx_addons_loading { background-color: var(--theme-color-extra_bg_color_05); } /* Mouse helper */ .trx_addons_mouse_helper { background-color: var(--theme-color-text_link); color: var(--theme-color-inverse_link); &.trx_addons_mouse_helper_active { background-color: var(--theme-color-text_link); color: var(--theme-color-inverse_link); } } /* Scroll to top */ .menu_side_right .scroll_to_top_style_default { left: 2em; right: auto; } /* Scroll to top */ .trx_addons_scroll_to_top { z-index: 7999; // 8002 } .scroll_to_top_style_default { @include square(2.8em); @include border-radius(0); color: var(--theme-color-inverse_hover); border-color: var(--theme-color-text_dark); background-color: var(--theme-color-text_dark); &:before { position: relative; top: -1px; @include font(11px, '', 400); font-family: $theme_icons; content: '\EA08'; } &:hover { color: var(--theme-color-inverse_link); border-color: var(--theme-color-text_link); background-color: var(--theme-color-text_link); } } /* Scroll to Top Style "Modern" */ .scroll_to_top_style_modern { bottom: 0; right: 60px; @include box(110px, 30px, 20px); text-align: left; white-space: nowrap; @include transform-origin(100% 50%); @include transform(rotate(-90deg) translate(100%, -50%)); color: var(--theme-color-text_dark); background-color: transparent; border-color: transparent; will-change: color, opacity, bottom; @include transition(color .3s ease, opacity .3s ease-out, bottom .3s ease-out); opacity: 0; &:hover { color: var(--theme-color-text_link); background-color: transparent; border-color: transparent; } &.show { bottom: 60px; opacity: 1; } .scroll_to_top_text, .scroll_to_top_icon { display: inline-block; vertical-align: middle; } .scroll_to_top_text { @include font(13px, '', 500); } .scroll_to_top_icon { margin-left: 15px; position: relative; overflow: hidden; &:after { margin-left: -15px; display: inline-block; vertical-align: middle; font-size: 12px; font-family: $theme_icons; content: '\E9E2'; color: currentColor; will-change: margin-left; @include transition(margin-left .3s ease-out); } } &:hover .scroll_to_top_icon:after { margin-left: 0; } } /* Scroll progress */ .scroll_progress_wrap .scroll_progress_status { background-color: var(--theme-color-text_dark); } /* Magnific Popup */ .mfp-content .sc_layouts_popup { max-height: 80vh; max-width: 80vw; } /* Login, Register and custom popups and panels from Layouts Builder */ .sc_layouts_panel { @include box-shadow(0 0 10px 0 rgba(0,0,0,.03)); } .sc_layouts_popup { @include box-shadow(0 0 10px 0 rgba(0,0,0,.15)); } .trx_addons_popup, [class*="scheme_"].trx_addons_popup, .sc_layouts_popup, [class*="scheme_"].sc_layouts_popup, .sc_layouts_panel_inner, [class*="scheme_"].sc_layouts_panel_inner { background-color: var(--theme-color-alter_bg_color); border-color: var(--theme-color-alter_bd_color); color: var(--theme-color-alter_text); } .trx_addons_popup button.mfp-close { background-color: var(--theme-color-alter_bg_hover); border-color: var(--theme-color-alter_bd_hover); color:var(--theme-color-alter_text); } .trx_addons_popup .trx_addons_tabs_titles li.trx_addons_tabs_title { background-color:var(--theme-color-alter_bg_hover); border-color: var(--theme-color-alter_bd_hover); } .trx_addons_popup .trx_addons_tabs_titles li.trx_addons_tabs_title.ui-tabs-active { background-color:var(--theme-color-alter_bg_color); border-bottom-color: transparent; } .trx_addons_popup .trx_addons_tabs_titles li.trx_addons_tabs_title a, .trx_addons_popup .trx_addons_tabs_titles li.trx_addons_tabs_title a > i { color:var(--theme-color-alter_text); } .trx_addons_popup li.trx_addons_tabs_title a:hover, .trx_addons_popup .trx_addons_tabs_titles li.trx_addons_tabs_title a:hover > i { color:var(--theme-color-alter_link); } .trx_addons_popup .trx_addons_tabs_titles li.trx_addons_tabs_title[data-disabled="true"] a, .trx_addons_popup .trx_addons_tabs_titles li.trx_addons_tabs_title[data-disabled="true"] a > i, .trx_addons_popup .trx_addons_tabs_titles li.trx_addons_tabs_title[data-disabled="true"] a:hover, .trx_addons_popup .trx_addons_tabs_titles li.trx_addons_tabs_title[data-disabled="true"] a:hover > i { color:var(--theme-color-alter_light); } .trx_addons_popup .trx_addons_tabs_titles li.trx_addons_tabs_title.ui-tabs-active a, .trx_addons_popup .trx_addons_tabs_titles li.trx_addons_tabs_title.ui-tabs-active a > i, .trx_addons_popup .trx_addons_tabs_titles li.trx_addons_tabs_title.ui-tabs-active a:hover, .trx_addons_popup .trx_addons_tabs_titles li.trx_addons_tabs_title.ui-tabs-active a:hover > i { color:var(--theme-color-alter_dark); } /* Profiler */ .trx_addons_profiler { background-color: var(--theme-color-alter_bg_color); border-color: var(--theme-color-alter_bd_hover); } .trx_addons_profiler_title { color: var(--theme-color-alter_dark); } .trx_addons_profiler table td, .trx_addons_profiler table th { border-color: var(--theme-color-alter_bd_color); } .trx_addons_profiler table td { color: var(--theme-color-alter_text); } .trx_addons_profiler table th { background-color: var(--theme-color-alter_bg_hover); color: var(--theme-color-alter_dark); } /* Range slider */ .trx_addons_range_slider_label_min { color: var(--theme-color-alter_text); } .trx_addons_range_slider_label_max { color: var(--theme-color-alter_text); } div.ui-slider { background-color: var(--theme-color-alter_bg_color); border-color: var(--theme-color-alter_bd_color); } div.ui-slider .ui-slider-handle { border-color: var(--theme-color-alter_bd_hover); background-color: var(--theme-color-alter_bg_hover); } div.ui-slider .ui-slider-range { background-color: var(--theme-color-alter_bg_hover); } /* Layout Title Link */ .sc_layouts_title_link { margin: 2.5em 0 0.5em; } /* Title */ h1.sc_item_title { line-height: 1em; } h2.sc_item_title { line-height: 1.021em; } h3.sc_item_title { line-height: 1.086em; } h4.sc_item_title { line-height: 1.214em; } h5.sc_item_title { line-height: 1.417em; } h6.sc_item_title { line-height: 1.474em; } .sc_item_title i { font-family: inherit; } .sc_item_subtitle { font-size: 14px; line-height: 18px; font-weight: 700; font-style: normal; text-transform: uppercase; letter-spacing: 1.4px; opacity: 1; } .sc_item_subtitle_above { margin-bottom: 1.4em; } .sc_item_descr { margin-bottom: 0; font-size: 1rem; p { margin: 0; + p { margin-top: 1em; } } } .sc_item_title.sc_item_title_style_accent i { @include flex; justify-content: center; flex-direction: revert; align-items: center; } h1.sc_item_title_tag:not(.sc_align_center) { margin-left: -1px; } h1.sc_item_title_tag.sc_align_right:not(.sc_align_center) { margin-right: -1px; } h2.sc_item_title_tag:not(.sc_align_center) { margin-left: -1px; } h2.sc_item_title_tag.sc_align_right:not(.sc_align_center) { margin-right: -1px; } .slider-slide h1.sc_item_title_tag { margin-left: 0 !important; } h1.sc_item_title_tag + .sc_item_descr, h1.sc_item_title_tag + .sc_item_slider, h1.sc_item_title_tag + .sc_item_columns, h1.sc_item_title_tag + .sc_item_content { margin-top: 1.4em; } h2.sc_item_title_tag + .sc_item_descr, h2.sc_item_title_tag + .sc_item_slider, h2.sc_item_title_tag + .sc_item_columns, h2.sc_item_title_tag + .sc_item_content { margin-top: 1.35em; } .sc_title_default h5.sc_item_title_tag + .sc_title_subtitle { text-transform: none; font-size: 17px; font-weight: 400; letter-spacing: 0; color: var(--theme-color-text); } .sc_item_title + .sc_item_button, .sc_item_title + .sc_item_button_image, .sc_item_subtitle + .sc_item_button, .sc_item_subtitle + .sc_item_button_image, .sc_item_descr + .sc_item_button, .sc_item_descr + .sc_item_button_image, .sc_item_content + .sc_item_button, .sc_item_content + .sc_item_button_image, .sc_item_slider + .sc_item_button, .sc_item_slider + .sc_item_button_image, .sc_item_columns + .sc_item_button, .sc_item_columns + .sc_item_button_image, .sc_item_pagination + .sc_item_button, .sc_item_pagination + .sc_item_button_image { margin-top: 2.1em; } .sc_item_subtitle.sc_item_title_style_shadow + .sc_item_title { position: relative; z-index: 1; } .sc_item_title_style_gradient .trx_addons_text_gradient, .sc_item_title_style_gradient .sc_item_title_text { padding-bottom: 8px; } .sc_item_title[data-mouse-helper*="highlight"] { padding-bottom: 8px; margin-bottom: -8px; } .sc_item_title_style_gradient[data-mouse-helper*="highlight"] .trx_addons_text_gradient { opacity: 0.7; } .sc_title { .sc_button.sc_button.sc_button_simple { overflow: visible; } } /* accent */ .sc_title_accent .sc_button_wrap { position: relative; z-index: 1; } .sc_title_accent { .sc_item_subtitle { position: relative; display: inline-block; padding-left: 70px; &:before { content: ""; display: block; width: 50px; height: 1px; @include abs-lc(); margin-top: 1px; background-color: var(--theme-color-text_link); } &.sc_align_center { padding: 10px 0 0 0; width: 100%; &:before { left: auto; right: auto; @include abs-ct(); } } &.sc_align_right { padding: 0 70px 0 0; width: 100%; &:before { left: auto; right: 0; } } } } /* icon */ .sc_item_subtitle.sc_item_title_style_icon { position: relative; &:before { color: var(--theme-color-text_dark); content: '\e9a7'; display: block; font-family: $theme_icons; font-size: 18px; margin-bottom: 20px; font-weight: 400; } } /* icon bottom */ .sc_item_title_style_icon_bottom.sc_item_title { position: relative; &:after { color: var(--theme-color-text_dark); content: '\e9a7'; display: block; font-family: $theme_icons; font-size: 18px; line-height: 20px; margin-top: 30px; font-weight: 400; } } /* Price */ .sc_price_item { color: var(--theme-color-alter_text); background-color: var(--theme-color-alter_bg_color); border-color: var(--theme-color-alter_bd_color); @include transition-colors; } .sc_price_item .sc_price_item_icon { color: var(--theme-color-alter_dark); } .sc_price_item .sc_price_item_label { font-size: 11px; font-weight: 500; letter-spacing: 1px; z-index: 9; background-color: var(--theme-color-extra_link); color: var(--theme-color-inverse_link); } .sc_price_item .sc_price_item_subtitle { color: var(--theme-color-alter_text); } .sc_price_item .sc_price_item_title, .sc_price_item .sc_price_item_title a { color: var(--theme-color-alter_dark); } .sc_price_item .sc_price_item_price { color: var(--theme-color-alter_dark); } .sc_price_item .sc_price_item_description, .sc_price_item .sc_price_item_details { color: var(--theme-color-alter_text); } .sc_price_slider .sc_price_item, .sc_price_columns_wrap .sc_price_item { height: auto; } /* Color style */ .sc_price_item { .sc_price_item_link { color: var(--theme-color-inverse_hover); background-color: var(--theme-color-text_dark); @include box-shadow(none); } .sc_price_item_link:hover, .sc_price_item_link:focus { @include theme_button_colors_hover; @include box-shadow(none); } } .sc_price_item:hover .sc_price_item_link { @include theme_button_colors; @include box-shadow(none); } .sc_price_item.sc_price_active { .sc_price_item_link { @include theme_button_colors; @include box-shadow(none); } } /* Button color for Default and Metro - if selected Color style */ .sc_price_item { .color_style_link2 & .sc_price_item_link { color: var(--theme-color-inverse_link); } .color_style_link3 & .sc_price_item_link { color: var(--theme-color-inverse_link); } } .sc_price .sc_price_item .sc_price_item_link.sc_price_item_link_over { opacity: 0 !important; background: none !important; margin: 0; } /* Price Default */ .sc_price_default { .sc_price_item .sc_price_item_inner { padding: 0; } .sc_price_item_image + .sc_price_item_info { padding-top: 40px; padding-bottom: 40px; } .with_bg_color .sc_price_item_image + .sc_price_item_info { padding-top: 33px; padding-bottom: 20px; } .sc_price_item.sc_price_active { @include box-shadow(0 23px 90px rgba(0,0,0,0.05)); z-index: 9; } .sc_price_item_info { padding: 4em 2em 4.4em; } .sc_price_item_icon { margin-top: 3em; > span { font-size: 3em; line-height: 1em; font-weight: 400; } } .sc_price_item_icon + .sc_price_item_info { padding-top: 1.5em; padding-bottom: 2.8em; } .sc_price_item_title { font-size: 24px; line-height: 1.25em; font-weight: 600; text-transform: uppercase; letter-spacing: 0; margin: 0; + .sc_price_item_subtitle { margin-top: 8px; } } .sc_price_item_subtitle { font-size: 17px; line-height: 1.3em; font-weight: 400; text-transform: none; letter-spacing: 0; margin: 0; } .sc_price_item_description, .sc_price_item_details { font-size: 15px; line-height: 1.6em; font-weight: 400; font-style: normal; letter-spacing: 0; margin: 0.65em 0; ul { padding: 0; list-style-type: none; li + li { margin-top: 8px; } } } .sc_price_item_price { font-size: 57px; line-height: 1; font-weight: 600; letter-spacing: 0; .sc_price_item_price_before { font-size: 20px; font-weight: 600; vertical-align: top; line-height: 1.85em; margin-right: 4px; } .sc_price_item_price_after { font-size: 17px; font-weight: 400; color: var(--theme-color-alter_text); } + .sc_price_item_details { margin-top: 30px; } } .sc_price_item_subtitle + .sc_price_item_price, .sc_price_item_title + .sc_price_item_price { margin-top: 20px; } .sc_price_item_subtitle + .sc_price_item_link, .sc_price_item_title + .sc_price_item_link, .sc_price_item_description + .sc_price_item_link, .sc_price_item_details + .sc_price_item_link { margin-top: 24px; } .sc_price_item_default.with_image { .sc_price_item_icon, .sc_price_item_title, .sc_price_item_price, .sc_price_item_price_after, .sc_price_item_subtitle { color: var(--theme-color-inverse_link); } .sc_price_item_description, .sc_price_item_details { color: #ccc; } } } /* Price Light */ .sc_price_light { .trx_addons_columns_wrap { margin: 0 !important; > [class*="trx_addons_column-"] { padding: 0 !important; margin: 0 !important; } } .sc_price_item_inner, .sc_price_item.with_image .sc_price_item_inner { padding: 50px; } .sc_price_item { z-index: 1; } .sc_price_item.sc_price_active { @include box-shadow(0 23px 90px rgba(0,0,0,0.05)); z-index: 9; } .sc_price_item_info { padding: 0; } .sc_price_item_image { margin-top: 1.5em; } .sc_price_item_icon { margin-top: 1.5em; > span { font-size: 3em; line-height: 1em; font-weight: 400; } } .sc_price_item_title { font-size: 24px; line-height: 1.25em; font-weight: 600; text-transform: uppercase; letter-spacing: 0; margin: 0; + .sc_price_item_subtitle { margin-top: 8px; } } .sc_price_item_subtitle { font-size: 17px; line-height: 1.3em; font-weight: 400; text-transform: none; letter-spacing: 0; margin: 0; } .sc_price_item_description, .sc_price_item_details { font-size: 17px; line-height: 1.6em; font-weight: 400; font-style: normal; letter-spacing: 0; margin: 0.65em 0; ul { padding: 0; list-style-type: none; li:after { content: '\e9a2'; font-family: $theme_icons; font-size: 11px; margin-left: 12px; position: relative; top: -1px; color: var(--theme-color-alter_link); } li + li { margin-top: 8px; } } } .sc_price_item_details { padding-top: 48px; border-top: 1px solid var(--theme-color-alter_bd_color); } .sc_price_active .sc_price_item_price { color: var(--theme-color-alter_link); } .sc_price_item_price { font-size: 57px; line-height: 1; font-weight: 600; letter-spacing: 0; margin-top: 15px; .sc_price_item_price_before { font-size: 20px; font-weight: 600; vertical-align: top; line-height: 2.0em; margin-right: 4px; } .sc_price_item_price_after { font-size: 17px; font-weight: 400; display: block; margin-top: 16px; color: var(--theme-color-alter_light); } + .sc_price_item_details { margin-top: 48px; } } .sc_price_item_subtitle + .sc_price_item_price, .sc_price_item_title + .sc_price_item_price { margin-top: 20px; } .sc_price_item_subtitle + .sc_price_item_link, .sc_price_item_title + .sc_price_item_link, .sc_price_item_description + .sc_price_item_link, .sc_price_item_details + .sc_price_item_link { margin-top: 32px; } .sc_price_item.sc_price_active { .sc_price_item_link { color: var(--theme-color-inverse_link); border-color: var(--theme-color-text_link) !important; background-color: var(--theme-color-text_link) !important; @include box-shadow(none); } } .sc_price_item { &:hover .sc_price_item_link { color: var(--theme-color-inverse_link); border-color: var(--theme-color-text_link) !important; background-color: var(--theme-color-text_link) !important; @include box-shadow(none); } .sc_price_item_link { color: var(--theme-color-text_dark); border-color: var(--theme-color-text_dark); background-color: var(--theme-color-alter_bg_color); @include box-shadow(none); } .sc_price_item_link:hover, .sc_price_item_link:focus { color: var(--theme-color-inverse_link); border-color: var(--theme-color-text_hover) !important; background-color: var(--theme-color-text_hover) !important; @include box-shadow(none); } } } /* Price Simple */ .sc_price_simple { .sc_price_item_inner, .sc_price_item.with_image .sc_price_item_inner { padding: 50px 30px; } .sc_price_item.sc_price_active { @include box-shadow(0 12px 40px rgba(0,0,0,0.03)); z-index: 9; } .sc_price_item_info { padding: 0; } .sc_price_item_image { margin-top: 1.5em; } .sc_price_item_icon { margin-top: 1.5em; > span { font-size: 3em; line-height: 1em; font-weight: 400; } } .sc_price_item_title { font-size: 24px; line-height: 1.25em; font-weight: 600; text-transform: uppercase; letter-spacing: 0; margin: 0; + .sc_price_item_subtitle { margin-top: 8px; } } .sc_price_item_subtitle { font-size: 17px; line-height: 1.3em; font-weight: 400; text-transform: none; letter-spacing: 0; margin: 0; } .sc_price_item_description, .sc_price_item_details { font-size: 18px; line-height: 1.6em; font-weight: 400; font-style: normal; letter-spacing: 0; margin: 0.65em 0; color: var(--theme-color-alter_dark); ul { padding: 0; list-style-type: none; li:after { content: '\e9a2'; font-family: $theme_icons; font-size: 11px; margin-left: 12px; position: relative; top: -1px; color: var(--theme-color-alter_link); } li + li { margin-top: 8px; } } } .sc_price_item_info > .sc_price_item_details:last-child { margin-bottom: 0; } .sc_price_active .sc_price_item_price { color: var(--theme-color-alter_link); } .sc_price_item_price { font-size: 57px; line-height: 1; font-weight: 600; letter-spacing: 0; margin-top: 15px; .sc_price_item_price_before { font-size: 20px; font-weight: 600; vertical-align: top; line-height: 2.0em; margin-right: 4px; } .sc_price_item_price_after { font-size: 17px; font-weight: 400; display: block; margin-top: 16px; color: var(--theme-color-alter_light); } + .sc_price_item_details { margin-top: 35px; } } .sc_price_item_subtitle + .sc_price_item_price, .sc_price_item_title + .sc_price_item_price { margin-top: 20px; } .sc_price_item_subtitle + .sc_price_item_link, .sc_price_item_title + .sc_price_item_link, .sc_price_item_description + .sc_price_item_link, .sc_price_item_details + .sc_price_item_link { margin-top: 28px; } .sc_price_item.sc_price_active { .sc_price_item_link { color: var(--theme-color-inverse_link); border-color: var(--theme-color-text_link) !important; background-color: var(--theme-color-text_link) !important; @include box-shadow(none); } } .sc_price_item { &:hover .sc_price_item_link { color: var(--theme-color-inverse_link); border-color: var(--theme-color-text_link) !important; background-color: var(--theme-color-text_link) !important; @include box-shadow(none); } .sc_price_item_link { color: var(--theme-color-text_dark); border-color: var(--theme-color-text_dark); background-color: var(--theme-color-alter_bg_color); @include box-shadow(none); } .sc_price_item_link:hover, .sc_price_item_link:focus { color: var(--theme-color-inverse_link); border-color: var(--theme-color-text_hover) !important; background-color: var(--theme-color-text_hover) !important; @include box-shadow(none); } } } /* Price Simple + shadow */ .sc_price_simple_shadow { .sc_price_item_inner, .sc_price_item.with_image .sc_price_item_inner { padding: 60px 30px 70px; } .sc_price_item { @include box-shadow(0 23px 90px rgba(0,0,0,0.05)); z-index: 1; &.sc_price_active { z-index: 9; } } .sc_price_item_info { padding: 0; } .sc_price_item_image { margin-top: 1.5em; } .sc_price_item_icon { margin-top: 1.5em; > span { font-size: 3em; line-height: 1em; font-weight: 400; } } .sc_price_item_title { font-size: 24px; line-height: 1.25em; font-weight: 600; text-transform: uppercase; letter-spacing: 0; margin: 0; + .sc_price_item_subtitle { margin-top: 8px; } } .sc_price_item_subtitle { font-size: 17px; line-height: 1.3em; font-weight: 400; text-transform: none; letter-spacing: 0; margin: 0; } .sc_price_item_description, .sc_price_item_details { font-size: 17px; line-height: 1.6em; font-weight: 400; font-style: normal; letter-spacing: 0; margin: 0.65em 0; color: var(--theme-color-alter_text); ul { padding: 0; list-style-type: none; li:after { content: '\e9a2'; font-family: $theme_icons; font-size: 11px; margin-left: 12px; position: relative; top: -1px; color: var(--theme-color-alter_link); } li + li { margin-top: 8px; } } } .sc_price_item_info > .sc_price_item_details:last-child { margin-bottom: 0; } .sc_price_item:hover .sc_price_item_price { color: var(--theme-color-alter_link); } .sc_price_item_price { @include transition-all(0.3s); font-size: 57px; line-height: 1; font-weight: 600; letter-spacing: 0; margin-top: 22px; .sc_price_item_price_before { font-size: 20px; font-weight: 600; vertical-align: top; line-height: 2.0em; margin-right: 4px; } .sc_price_item_price_after { font-size: 17px; font-weight: 400; display: block; margin-top: 16px; color: var(--theme-color-alter_light); } + .sc_price_item_details { margin-top: 39px; } } .sc_price_item_subtitle + .sc_price_item_price, .sc_price_item_title + .sc_price_item_price { margin-top: 20px; } .sc_price_item_subtitle + .sc_price_item_link, .sc_price_item_title + .sc_price_item_link, .sc_price_item_description + .sc_price_item_link, .sc_price_item_details + .sc_price_item_link { margin-top: 28px; } .sc_price_item.sc_price_active { .sc_price_item_link { color: var(--theme-color-inverse_link); border-color: var(--theme-color-text_link) !important; background-color: var(--theme-color-text_link) !important; @include box-shadow(none); } } .sc_price_item { &:hover .sc_price_item_link { color: var(--theme-color-inverse_link); border-color: var(--theme-color-text_link) !important; background-color: var(--theme-color-text_link) !important; @include box-shadow(none); } .sc_price_item_link { color: var(--theme-color-text_dark); border-color: var(--theme-color-text_dark); background-color: var(--theme-color-alter_bg_color); @include box-shadow(none); } .sc_price_item_link:hover, .sc_price_item_link:focus { color: var(--theme-color-inverse_link); border-color: var(--theme-color-text_hover) !important; background-color: var(--theme-color-text_hover) !important; @include box-shadow(none); } } .sc_price_item.with_image:not(.with_bg_color) { .sc_price_item_inner { position: relative; &:before { content: ''; position: absolute; top: 0; left: 0; width: 100%; height: 100%; background-color: var(--theme-color-text_link2); opacity: 0.9; z-index: -1; } .sc_price_item_description, .sc_price_item_details { ul { li:after { color: var(--theme-color-inverse_link); } } } .sc_price_item_description, .sc_price_item_details, .sc_price_item_subtitle, .sc_price_item_price .sc_price_item_price_after, .sc_price_item_price, .sc_price_item_icon > span, .sc_price_item_info, .sc_price_item_title { color: var(--theme-color-inverse_link); } .sc_price_item_link { color: var(--theme-color-inverse_link) !important; border-color: var(--theme-color-inverse_link) !important; background-color: transparent !important; @include box-shadow(none); &:hover { color: var(--theme-color-inverse_dark) !important; border-color: var(--theme-color-inverse_link) !important; background-color: var(--theme-color-inverse_link) !important; } } } &:hover { .sc_price_item_link { color: var(--theme-color-inverse_link) !important; border-color: var(--theme-color-inverse_link) !important; background-color: transparent !important; } } } } /* Price Plain */ .sc_price_plain { .sc_price_item_inner, .sc_price_item.with_image .sc_price_item_inner { padding: 66px 60px 75px; } .sc_price_item { text-align: left; @include box-shadow(0 23px 90px rgba(0,0,0,0.05)); z-index: 1; &.sc_price_active { z-index: 9; } } .sc_price_item_info { padding: 0; } .sc_price_item_image { margin-top: 1.5em; } .sc_price_item_icon { margin-top: 1.5em; > span { font-size: 3em; line-height: 1em; font-weight: 400; } } .sc_price_item_title { font-size: 24px; line-height: 1.25em; font-weight: 600; text-transform: uppercase; letter-spacing: 0; margin: 0; + .sc_price_item_subtitle { margin-top: 8px; } } .sc_price_item_subtitle { font-size: 17px; line-height: 1.3em; font-weight: 400; text-transform: none; letter-spacing: 0; margin: 0; } .sc_price_item_description, .sc_price_item_details { font-size: 17px; line-height: 1.6em; font-weight: 400; font-style: normal; letter-spacing: 0; margin: 0.65em 0; color: var(--theme-color-alter_text); ul { padding: 0; list-style-type: none; li:after { content: '\e9a2'; font-family: $theme_icons; font-size: 11px; margin-left: 12px; position: relative; top: -1px; color: var(--theme-color-alter_link); } li + li { margin-top: 8px; } } } .sc_price_item_info > .sc_price_item_details:last-child { margin-bottom: 0; } .sc_price_item:hover .sc_price_item_price { color: var(--theme-color-alter_link); } .sc_price_item_price { @include transition-all(0.3s); font-size: 57px; line-height: 1; font-weight: 600; letter-spacing: 0; margin-top: 22px; .sc_price_item_price_before { font-size: 20px; font-weight: 600; vertical-align: top; line-height: 2.0em; margin-right: 4px; } .sc_price_item_price_after { font-size: 17px; font-weight: 400; display: block; margin-top: 16px; color: var(--theme-color-alter_light); } + .sc_price_item_details { margin-top: 30px; } } .sc_price_item_subtitle + .sc_price_item_price, .sc_price_item_title + .sc_price_item_price { margin-top: 20px; } .sc_price_item_subtitle + .sc_price_item_link, .sc_price_item_title + .sc_price_item_link, .sc_price_item_description + .sc_price_item_link, .sc_price_item_details + .sc_price_item_link { margin-top: 24px; } .sc_price_item.sc_price_active { .sc_price_item_link { color: var(--theme-color-inverse_link); border-color: var(--theme-color-text_link) !important; background-color: var(--theme-color-text_link) !important; @include box-shadow(none); } } .sc_price_item { &:not(.sc_price_active) .sc_price_item_link { padding-left: 40px; padding-right: 40px; } .sc_price_item_link { padding-left: 57px; padding-right: 57px; } } .sc_price_item { &:hover .sc_price_item_link { color: var(--theme-color-inverse_link); border-color: var(--theme-color-text_link) !important; background-color: var(--theme-color-text_link) !important; @include box-shadow(none); } .sc_price_item_link { color: var(--theme-color-text_dark); border-color: var(--theme-color-text_dark); background-color: var(--theme-color-alter_bg_color); @include box-shadow(none); } .sc_price_item_link:hover, .sc_price_item_link:focus { color: var(--theme-color-inverse_link); border-color: var(--theme-color-text_hover) !important; background-color: var(--theme-color-text_hover) !important; @include box-shadow(none); } } .sc_price_item_label { @include box(12em, 2em, 2em); left: auto; right: -3em; top: 2em; @include transform(rotate(45deg)); } } /* Price Focus */ .sc_price_focus { .trx_addons_columns_wrap { margin: 0 !important; > [class*="trx_addons_column-"] { padding: 0 !important; margin: 0 !important; } } .sc_price_item_inner, .sc_price_item.with_image .sc_price_item_inner { padding: 55px 45px 64px; } .sc_price_item { @include box-shadow(0 23px 40px rgba(0,0,0,0.03)); z-index: 1; } .sc_price_item.sc_price_active { @include box-shadow(0 23px 90px rgba(0,0,0,0.05)); z-index: 9; margin: -20px 0 0; padding: 20px 0; } .sc_price_item_info { padding: 0; } .sc_price_item_image { margin-top: 1.5em; } .sc_price_item_icon { margin-top: 1.5em; > span { font-size: 3em; line-height: 1em; font-weight: 400; } } .sc_price_item_title { font-size: 24px; line-height: 1.25em; font-weight: 600; text-transform: uppercase; letter-spacing: 0; margin: 0; + .sc_price_item_subtitle { margin-top: 8px; } } .sc_price_item_subtitle { font-size: 17px; line-height: 1.3em; font-weight: 400; text-transform: none; letter-spacing: 0; margin: 0; } .sc_price_item_description, .sc_price_item_details { font-size: 17px; line-height: 1.6em; font-weight: 400; font-style: normal; letter-spacing: 0; margin: 0.65em 0; ul { padding: 0; list-style-type: none; li:after { content: '\e9a2'; font-family: $theme_icons; font-size: 11px; margin-left: 12px; position: relative; top: -1px; color: var(--theme-color-alter_link); } li + li { margin-top: 8px; } } } .sc_price_item_details { padding-top: 40px; border-top: 1px solid var(--theme-color-alter_bd_color); } .sc_price_item_price { font-size: 57px; line-height: 1; font-weight: 600; letter-spacing: 0; margin-top: 15px; .sc_price_item_price_before { font-size: 20px; font-weight: 600; vertical-align: top; line-height: 2.0em; margin-right: 4px; } .sc_price_item_price_after { font-size: 17px; font-weight: 400; display: block; margin-top: 20px; color: var(--theme-color-alter_light); } + .sc_price_item_details { margin-top: 46px; } } .sc_price_item_subtitle + .sc_price_item_price, .sc_price_item_title + .sc_price_item_price { margin-top: 20px; } .sc_price_item_subtitle + .sc_price_item_link, .sc_price_item_title + .sc_price_item_link, .sc_price_item_description + .sc_price_item_link, .sc_price_item_details + .sc_price_item_link { margin-top: 32px; } .sc_price_item.sc_price_active { .sc_price_item_link { color: var(--theme-color-inverse_link); border-color: var(--theme-color-text_link) !important; background-color: var(--theme-color-text_link) !important; @include box-shadow(none); } } .sc_price_item { &:hover .sc_price_item_link { color: var(--theme-color-inverse_link); border-color: var(--theme-color-text_link) !important; background-color: var(--theme-color-text_link) !important; @include box-shadow(none); } .sc_price_item_link { color: var(--theme-color-text_dark); border-color: var(--theme-color-text_dark); background-color: var(--theme-color-alter_bg_color); @include box-shadow(none); padding-left: 56px; padding-right: 56px; } .sc_price_item_link:hover, .sc_price_item_link:focus { color: var(--theme-color-inverse_link); border-color: var(--theme-color-text_hover) !important; background-color: var(--theme-color-text_hover) !important; @include box-shadow(none); } } } /* Price Metro */ .sc_price_metro { .sc_price_item_inner, .sc_price_item.with_image .sc_price_item_inner { padding: 65px 50px; } .sc_price_item { @include box-shadow(0 23px 90px rgba(0,0,0,0.04)); z-index: 1; } .sc_price_item.sc_price_active { @include box-shadow(0 23px 90px rgba(0,0,0,0.05)); z-index: 9; } .sc_price_item_info { padding: 0; } .sc_price_item_image { margin-top: 1.5em; } .sc_price_item_icon { margin-top: 1.5em; > span { font-size: 3em; line-height: 1em; font-weight: 400; } } .sc_price_item_title { font-size: 24px; line-height: 1.25em; font-weight: 600; text-transform: uppercase; letter-spacing: 0; margin: 0; + .sc_price_item_subtitle { margin-top: 8px; } } .sc_price_item_subtitle { font-size: 17px; line-height: 1.3em; font-weight: 400; text-transform: none; letter-spacing: 0; margin: 0; } .sc_price_item_description, .sc_price_item_details { font-size: 17px; line-height: 1.4em; font-weight: 400; font-style: normal; letter-spacing: 0; margin: 0.65em 0; ul { padding: 0 0 0 17px; list-style-type: none; li { position: relative; } li:before { font-size: 22px; left: -16px; top: 1px; display: inline-block !important; position: absolute; content: '\e83c'; font-family: $theme_icons; color: var(--theme-color-alter_dark); } li + li { margin-top: 10px; } } } .sc_price_item_details { padding-top: 44px; text-align: left; border-top: 1px solid var(--theme-color-alter_bd_color); } .sc_price_item_price { font-size: 57px; line-height: 1; font-weight: 600; letter-spacing: 0; margin-top: 15px; .sc_price_item_price_before { font-size: 20px; font-weight: 600; vertical-align: top; line-height: 2.0em; margin-right: 4px; } .sc_price_item_price_after { font-size: 17px; font-weight: 400; display: block; margin-top: 20px; color: var(--theme-color-alter_light); } + .sc_price_item_details { margin-top: 38px; } } .sc_price_item_subtitle + .sc_price_item_price, .sc_price_item_title + .sc_price_item_price { margin-top: 20px; } .sc_price_item { .sc_price_item_link { @include box-shadow(none !important); @include border-radius(0 !important); width: 100%; display: block; border: none; margin: 0; padding-left: 10px; padding-right: 10px; &:not(.sc_price_item_link_over) { margin-top: -20px; z-index: 9; position: relative; } } } } /* Countdown */ .sc_countdown.sc_countdown_circle, .sc_countdown.sc_countdown_default { margin-bottom: 0 !important; } .sc_countdown_default .sc_countdown_digits span { color: var(--theme-color-text_dark); background: none; } .sc_countdown_circle .sc_countdown_digits { color: var(--theme-color-alter_link); border-color: var(--theme-color-alter_bd_color); background-color: var(--theme-color-alter_bg_color); } /* default */ .sc_countdown_default { .sc_countdown_inner { display: inline-flex; flex-direction: row; align-items: center; align-content: center; flex-wrap: wrap; .sc_countdown_item { float: none; } } .sc_countdown_digits, .sc_countdown_separator { line-height: 1em; height: 1em; font-weight: 600; overflow: visible; float: none; color: var(--theme-color-text_dark); } .sc_countdown_separator { font-weight: 600; margin: 0 40px; font-size: 50px; } &.aligncenter .sc_countdown_separator { margin: 0 48px; } .sc_countdown_digits { margin-bottom: 21px; font-size: 57px; } .sc_countdown_digits span { width: 0.6em; + span { margin: 0; } } .sc_countdown_label { font-weight: 600; font-size: 19px; line-height: 1.1em; text-transform: uppercase; letter-spacing: 1.4px; padding-top: 22px; position: relative; display: inline-block; color: var(--theme-color-text_dark); &:before { width: 31px; height: 2px; background: var(--theme-color-text_dark_02); content: ""; display: block; @include abs-ct(); } } } /* Messages */ form .trx_addons_message_box { min-width: auto; max-width: 90%; } .trx_addons_message_box { width: auto; min-width: auto; max-width: 50%; border: none; padding: 18px 30px; @include box-sizing(border-box); @include border-radius(5px); @include box-shadow(none); position: fixed; z-index: 999999; top: auto; left: auto; bottom: 30px; right: 30px; font-size: 14px; line-height: 18px; font-weight: 400; @include transform(none); color: #000000; background-color: #ffffff; @include box-shadow(0 3px 21px rgba(0, 0, 0, 0.05) !important); &.trx_addons_message_box_error { color: #ffffff; background-color: #FF5B4A; } &.trx_addons_message_box_success { color: #ffffff; background-color: #89D86B; } .trx_addons_error_item { margin-bottom: 0 !important; } .fixed_blocks_sticky .sidebar &, [class*="elementor"].animated & { position: relative; bottom: auto; right: auto; max-width: 100%; margin-top: 1.5em; } } /* Skills */ .sc_skills_digits .sc_skills_unit { margin-left: 0; } /* counters */ .sc_skills_counter.sc_align_left { text-align: left; } .sc_skills_counter.sc_align_center { text-align: center; } .sc_skills_counter.sc_align_right { text-align: right; } .sc_skills_counter .sc_skills_icon { @include font(4em, 1em); text-align: inherit; color:var(--theme-color-text_light); } .sc_skills_counter .sc_skills_total { @include font(4.444em, 1em, 600); text-align: inherit; color:var(--theme-color-text_dark); } .sc_skills_counter .sc_skills_item_title { @include font(17px, 1.65em, 400, normal); text-align: inherit; } .sc_skills_counter .sc_skills_image + .sc_skills_total, .sc_skills_counter .sc_skills_icon + .sc_skills_total { margin-top: 0.3em; } .sc_skills_counter .sc_skills_item + .sc_skills_item_title { margin-top: 0.8em; } .sc_skills_counter .sc_skills_column + .sc_skills_column:before { background-color: var(--theme-color-bd_color); } /* counters alter */ .sc_skills_counter_alter.sc_align_left { text-align: left; } .sc_skills_counter_alter.sc_align_center { text-align: center; } .sc_skills_counter_alter.sc_align_right { text-align: right; } .sc_skills_counter_alter.with_divider .sc_skills_columns .sc_skills_column .sc_skills_item_wrap:after { content: ''; display: block; height: 45px; width: 1px; position: absolute; right: 0; top: 50%; @include transform(translateY(-50%)); background-color: var(--theme-color-text_dark_05); } .sc_skills_counter_alter.with_divider .sc_skills_columns .sc_skills_column:last-child .sc_skills_item_wrap:after { display: none; } .sc_skills_counter_alter.with_divider .sc_skills_columns .trx_addons_column-1_2:nth-child(2n) .sc_skills_item_wrap:after, .sc_skills_counter_alter.with_divider .sc_skills_columns .trx_addons_column-1_3:nth-child(3n) .sc_skills_item_wrap:after, .sc_skills_counter_alter.with_divider .sc_skills_columns .trx_addons_column-1_4:nth-child(4n) .sc_skills_item_wrap:after, .sc_skills_counter_alter.with_divider .sc_skills_columns .trx_addons_column-1_5:nth-child(5n) .sc_skills_item_wrap:after, .sc_skills_counter_alter.with_divider .sc_skills_columns .trx_addons_column-1_6:nth-child(6n) .sc_skills_item_wrap:after, .sc_skills_counter_alter.with_divider .sc_skills_columns .trx_addons_column-1_7:nth-child(7n) .sc_skills_item_wrap:after, .sc_skills_counter_alter.with_divider .sc_skills_columns .trx_addons_column-1_8:nth-child(8n) .sc_skills_item_wrap:after, .sc_skills_counter_alter.with_divider .sc_skills_columns .trx_addons_column-1_9:nth-child(9n) .sc_skills_item_wrap:after, .sc_skills_counter_alter.with_divider .sc_skills_columns .trx_addons_column-1_10:nth-child(10n) .sc_skills_item_wrap:after, .sc_skills_counter_alter.with_divider .sc_skills_columns .trx_addons_column-1_11:nth-child(11n) .sc_skills_item_wrap:after, .sc_skills_counter_alter.with_divider .sc_skills_columns .trx_addons_column-1_12:nth-child(12n) .sc_skills_item_wrap:after { display: none; } .sc_skills_counter_alter.with_divider.sc_align_left .sc_skills_columns .sc_skills_column .sc_skills_item_wrap:after { right: 0; } .sc_skills_counter_alter.with_divider.sc_align_center .sc_skills_columns .sc_skills_column .sc_skills_item_wrap:after { right: calc(-1 * var(--theme-var-grid_gap) / 2); } .sc_skills_counter_alter.with_divider.sc_align_right .sc_skills_columns .sc_skills_column .sc_skills_item_wrap:after { right: calc(-1 * var(--theme-var-grid_gap)); } .sc_skills_counter_alter .sc_skills_item_wrap { max-width: none; position: relative; } .sc_skills_counter_alter .sc_skills_icon { position: relative; display: block; @include font(3.8em, 1em); color: var(--theme-color-text_dark); } .sc_skills_counter_alter .sc_skills_total { display: block; margin: 0; @include font(3.611em, 1em, 600); letter-spacing: -0.1px; color:var(--theme-color-text_dark); } .sc_skills_counter_alter .sc_skills_item_title { @include font(19px, 1.65em, 600, normal); text-transform: uppercase; letter-spacing: 0; color:var(--theme-color-text_dark_08); } .sc_skills_counter_alter .sc_skills_image + .sc_skills_total, .sc_skills_counter_alter .sc_skills_icon + .sc_skills_total { margin-top: 0.25em; } .sc_skills_counter_alter .sc_skills_item + .sc_skills_item_title { margin-top: 0.45em; } /* counters alter */ .sc_skills_counter_alter .sc_skills_image { text-align: center; img { @include border-round; @include square(4.83em); } } .sc_skills_counter_alter .sc_skills_icon.sc_skills_char { text-align: center; &:before, & > span:before { content: attr(data-char); font-weight: 700; } & > span { display:inline-block; opacity: 0; @include abs-lt; width: auto; } } .sc_skills_counter_alter .sc_icon_type_svg svg, .sc_skills_counter_alter .sc_icon_type_svg object { @include box(1em, 1em); } /* counters extra */ .sc_skills_counter_extra .sc_skills_item_wrap { max-width: none; } .sc_skills_counter_extra.sc_align_left { text-align: left; } .sc_skills_counter_extra.sc_align_center { text-align: center; } .sc_skills_counter_extra.sc_align_right { text-align: right; } .sc_skills_counter_extra .sc_skills_icon { position: relative; display: block; @include font(3.8em, 1em); color: var(--theme-color-text_dark); } .sc_skills_counter_extra .sc_skills_total { display: block; margin: 0; @include font(3.611em, 1em, 600); letter-spacing: -0.1px; color:var(--theme-color-text_dark); } .sc_skills_counter_extra .sc_skills_item_title { @include font(21px, 1.4em, 600, normal); text-transform: uppercase; letter-spacing: 0; color:var(--theme-color-text_dark); } .sc_skills_counter_extra .sc_skills_image + .sc_skills_total, .sc_skills_counter_extra .sc_skills_icon + .sc_skills_total { margin-top: 0.1em; } .sc_skills_counter_extra .sc_skills_item_title + .sc_skills_item { margin-top: 0.5em; } .sc_skills_counter_extra.sc_skills_counter_style_odometer.sc_align_left { .sc_skills_digits { margin-left: -5px; } } .sc_skills_counter_extra .sc_skills_image { text-align: center; img { @include border-round; @include square(4.83em); } } .sc_skills_counter_extra .sc_skills_icon.sc_skills_char { text-align: center; &:before, & > span:before { content: attr(data-char); font-weight: 700; } & > span { display:inline-block; opacity: 0; @include abs-lt; width: auto; } } .sc_skills_counter_extra .sc_icon_type_svg svg, .sc_skills_counter_extra .sc_icon_type_svg object { @include box(1em, 1em); } /* counters modern */ .sc_skills_counter_modern .sc_skills_columns .sc_skills_column .sc_skills_item_wrap:after { content: ''; display: block; height: 60px; width: 1px; position: absolute; right: calc( -1 * var(--theme-var-grid_gap) / 2 ); top: 50%; @include transform(translateY(-50%)); background-color: var(--theme-color-bd_color); } .sc_skills_counter_modern .sc_skills_columns .sc_skills_column:last-child .sc_skills_item_wrap:after { display: none; } .sc_skills_counter_modern .sc_skills_columns .trx_addons_column-1_2:nth-child(2n) .sc_skills_item_wrap:after, .sc_skills_counter_modern .sc_skills_columns .trx_addons_column-1_3:nth-child(3n) .sc_skills_item_wrap:after, .sc_skills_counter_modern .sc_skills_columns .trx_addons_column-1_4:nth-child(4n) .sc_skills_item_wrap:after, .sc_skills_counter_modern .sc_skills_columns .trx_addons_column-1_5:nth-child(5n) .sc_skills_item_wrap:after, .sc_skills_counter_modern .sc_skills_columns .trx_addons_column-1_6:nth-child(6n) .sc_skills_item_wrap:after, .sc_skills_counter_modern .sc_skills_columns .trx_addons_column-1_7:nth-child(7n) .sc_skills_item_wrap:after, .sc_skills_counter_modern .sc_skills_columns .trx_addons_column-1_8:nth-child(8n) .sc_skills_item_wrap:after, .sc_skills_counter_modern .sc_skills_columns .trx_addons_column-1_9:nth-child(9n) .sc_skills_item_wrap:after, .sc_skills_counter_modern .sc_skills_columns .trx_addons_column-1_10:nth-child(10n) .sc_skills_item_wrap:after, .sc_skills_counter_modern .sc_skills_columns .trx_addons_column-1_11:nth-child(11n) .sc_skills_item_wrap:after, .sc_skills_counter_modern .sc_skills_columns .trx_addons_column-1_12:nth-child(12n) .sc_skills_item_wrap:after { display: none; } .sc_skills_counter_modern .sc_skills_item_wrap { @include flex; @include flex-direction(column); @include flex-justify-content(center); @include flex-align-items(center); min-height: 8.2em; max-width: none; position: relative; } .sc_skills_counter_modern .sc_skills_icon { margin-bottom: 0.2em; position: relative; z-index: 1; display: block; text-align: center; @include font(3.8em, 1em); color: var(--theme-color-text_dark); } .sc_skills_counter_modern .sc_skills_total { display: block; position: absolute; top: calc(50% - 10px); left: 50%; z-index: 0; @include transform(translate(-50%, -50%)); width: 100%; text-align: center; margin: 0; @include font(10em, 1em, 600); letter-spacing: 0; color:var(--theme-color-alter_bg_hover); opacity: 1; white-space: nowrap; } .sc_skills_counter_modern .sc_skills_item_title { position: relative; z-index: 1; text-align: center; @include font(24px, 1.4em, 600, normal); text-transform: uppercase; letter-spacing: 0; color:var(--theme-color-text_dark); } .sc_skills_counter_modern .sc_skills_image { margin-bottom: 0.2em; text-align: center; img { @include border-round; @include square(4.83em); } } .sc_skills_counter_modern .sc_skills_icon.sc_skills_char { text-align: center; &:before, & > span:before { content: attr(data-char); font-weight: 700; } & > span { display:inline-block; opacity: 0; @include abs-lt; width: auto; } } .sc_skills_counter_modern .sc_icon_type_svg svg, .sc_skills_counter_modern .sc_icon_type_svg object { @include box(1em, 1em); } /* counters simple */ .sc_skills_counter_simple.with_divider .sc_skills_item_wrap { min-height: 123px; @include flex; @include flex-direction(column); @include flex-justify-content(center); } .sc_skills_counter_simple.with_divider .sc_skills_columns .sc_skills_column .sc_skills_item_wrap:after { content: ''; display: block; height: 123px; width: 1px; position: absolute; right: 0; top: 50%; @include transform(translateY(-50%)); background-color: var(--theme-color-bd_color); } .sc_skills_counter_simple.with_divider .sc_skills_columns .sc_skills_column:last-child .sc_skills_item_wrap:after { display: none; } .sc_skills_counter_simple.with_divider .sc_skills_columns .trx_addons_column-1_2:nth-child(2n) .sc_skills_item_wrap:after, .sc_skills_counter_simple.with_divider .sc_skills_columns .trx_addons_column-1_3:nth-child(3n) .sc_skills_item_wrap:after, .sc_skills_counter_simple.with_divider .sc_skills_columns .trx_addons_column-1_4:nth-child(4n) .sc_skills_item_wrap:after, .sc_skills_counter_simple.with_divider .sc_skills_columns .trx_addons_column-1_5:nth-child(5n) .sc_skills_item_wrap:after, .sc_skills_counter_simple.with_divider .sc_skills_columns .trx_addons_column-1_6:nth-child(6n) .sc_skills_item_wrap:after, .sc_skills_counter_simple.with_divider .sc_skills_columns .trx_addons_column-1_7:nth-child(7n) .sc_skills_item_wrap:after, .sc_skills_counter_simple.with_divider .sc_skills_columns .trx_addons_column-1_8:nth-child(8n) .sc_skills_item_wrap:after, .sc_skills_counter_simple.with_divider .sc_skills_columns .trx_addons_column-1_9:nth-child(9n) .sc_skills_item_wrap:after, .sc_skills_counter_simple.with_divider .sc_skills_columns .trx_addons_column-1_10:nth-child(10n) .sc_skills_item_wrap:after, .sc_skills_counter_simple.with_divider .sc_skills_columns .trx_addons_column-1_11:nth-child(11n) .sc_skills_item_wrap:after, .sc_skills_counter_simple.with_divider .sc_skills_columns .trx_addons_column-1_12:nth-child(12n) .sc_skills_item_wrap:after { display: none; } .sc_skills_counter_simple.with_divider.sc_align_left .sc_skills_columns .sc_skills_column .sc_skills_item_wrap:after { right: 0; } .sc_skills_counter_simple.with_divider.sc_align_center .sc_skills_columns .sc_skills_column .sc_skills_item_wrap:after { right: calc(-1 * var(--theme-var-grid_gap) / 2); } .sc_skills_counter_simple.with_divider.sc_align_right .sc_skills_columns .sc_skills_column .sc_skills_item_wrap:after { right: calc(-1 * var(--theme-var-grid_gap)); } .sc_skills_counter_simple .sc_skills_item_wrap { max-width: none; position: relative; } .sc_skills_counter_simple.sc_align_left { text-align: left; } .sc_skills_counter_simple.sc_align_center { text-align: center; } .sc_skills_counter_simple.sc_align_right { text-align: right; } .sc_skills_counter_simple .sc_skills_icon { @include font(4em, 1em); color:var(--theme-color-text_dark); } .sc_skills_counter_simple .sc_skills_total { @include font(3.611em, 1em, 500); letter-spacing: -0.3px; color:var(--theme-color-text_dark); } .sc_skills_counter_simple .sc_skills_item_title { @include font(19px, 1.65em, 600, normal); letter-spacing: 0; text-transform: uppercase; color:var(--theme-color-text_dark); } .sc_skills_counter_simple .sc_skills_image + .sc_skills_total, .sc_skills_counter_simple .sc_skills_icon + .sc_skills_total { margin-top: 0.25em; } .sc_skills_counter_simple .sc_skills_item + .sc_skills_item_title { margin-top: 0.25em; } .sc_skills_counter_simple .sc_skills_image { text-align: center; img { @include border-round; @include square(4.83em); } } .sc_skills_counter_simple .sc_skills_icon.sc_skills_char { text-align: center; &:before, & > span:before { content: attr(data-char); font-weight: 700; } & > span { display:inline-block; opacity: 0; @include abs-lt; width: auto; } } .sc_skills_counter_simple .sc_icon_type_svg svg, .sc_skills_counter_simple .sc_icon_type_svg object { @include box(1em, 1em); } /* pie */ .sc_skills_pie.sc_skills_compact_off .sc_skills_item_wrap { @include flex; @include flex-align-items(center); } .sc_skills_pie.sc_skills_compact_off .sc_skills_item { position: relative; width: 50%; line-height: 0; } .sc_skills_pie.sc_skills_compact_off .sc_skills_total { @include font(1.556em, 1.1em, 600); color:var(--theme-color-text_dark); top: calc(50% - 1px); } .sc_skills_pie.sc_skills_compact_off .sc_skills_item_title { margin-top: 0; width: 50%; @include font(1.333em, 1.18em, 600); letter-spacing: 0; text-transform: uppercase; text-align: left; color:var(--theme-color-text_dark); } .sc_skills_pie.sc_skills_compact_off .sc_skills_item + .sc_skills_item_title { margin-left: 0.7em; } /* Icons */ .footer_wrap .sc_icons .sc_icons_icon + .sc_icons_item_title { margin-top:1em; margin-bottom:2em; } [class*="scheme_"].footer_wrap .sc_icons .sc_icons_item_title { color: var(--theme-color-text_dark); } [class*="scheme_"].footer_wrap .sc_icons .sc_icons_item_description { color: var(--theme-color-text); } .sc_icons { .sc_icons_item + .sc_icons_item { margin-top: var(--theme-var-grid_gap); } .sc_icons_item_linked:hover .sc_icons_icon > span { @include animation(none); } .sc_icons_item_linked .sc_icons_icon > svg, .sc_icons_item_linked:hover .sc_icons_icon > svg { @include transform(none); } .sc_icons_image img { max-width: 100%; } .sc_icons_item_linked .sc_icons_image img, .sc_icons_item_linked:hover .sc_icons_image img { @include transform(none); } .sc_icons_item .sc_icons_item_more_link { position: relative; display: inline-block; top: auto; left: auto; height: auto; width: auto; @include font(14px, 20px, 700); text-transform: uppercase; letter-spacing: 1px; color: var(--theme-color-text_dark); z-index: 1; overflow: hidden; } .sc_icons_item .sc_icons_item_more_link .link_text { position: relative; margin-right: 0; margin-top: 1px; display: inline-block; vertical-align: middle; text-indent: -110px; visibility: hidden; white-space: nowrap; opacity: 0; @include transition(visibility .4s ease, margin-right .4s ease-out, text-indent .5s ease-out, opacity .4s ease); will-change: visibility, margin-right, text-indent, opacity; } .sc_icons_item:hover .sc_icons_item_more_link .link_text, .sc_icons_item .sc_icons_item_more_link: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, opacity .4s ease); } .sc_icons_item .sc_icons_item_more_link .link_icon { position: relative; display: inline-block; vertical-align: middle; overflow: hidden; @include square(1.4em); } .sc_icons_item .sc_icons_item_more_link .link_icon:before { @include font(11px, inherit, 400, inherit); content: '\E9A4'; font-family: $theme_icons; display: inline-block; vertical-align: top; color: currentColor; } .sc_icons_item .sc_icons_item_title + .sc_icons_item_more_link, .sc_icons_item .sc_icons_item_description + .sc_icons_item_more_link { margin-top: 1.7em; } .sc_icons_item.sc_icons_item_linked.with_more .sc_icons_item_link { display: block; position: absolute; z-index: -1; top: 0; left: 0; width: 100%; height: 100%; } .sc_icons_icon { color: var(--theme-color-text_link); } .sc_icons_icon:before, .sc_icons_icon > span:before { font-size: 4em; } .sc_icons_item_linked:hover .sc_icons_icon { color: var(--theme-color-text_dark); } .sc_icons_icon + .sc_icons_item_details, .sc_icons_image + .sc_icons_item_details { margin-top: 1.3em; } &.color_style_link2 .sc_icons_icon { color: var(--theme-color-text_link2); } &.color_style_link3 .sc_icons_icon { color: var(--theme-color-text_link3); } &.color_style_dark .sc_icons_icon { color: var(--theme-color-text_dark); } .sc_icons_item_title, .sc_icons_item_title a { color: var(--theme-color-text_dark); } .sc_icons_item_title[style*="color"] { > a:active, > a:hover, > a { color: inherit !important; } } .sc_icons_item:hover .sc_icons_item_title, .sc_icons_item:hover .sc_icons_item_title a, .sc_icons_item .sc_icons_item_title a:hover { color: var(--theme-color-text_dark); } &.color_style_link2 .sc_icons_item:hover .sc_icons_item_title, &.color_style_link2 .sc_icons_item:hover .sc_icons_item_title a, &.color_style_link2 .sc_icons_item .sc_icons_item_title a:hover { color: var(--theme-color-text_dark); } &.color_style_link3 .sc_icons_item:hover .sc_icons_item_title, &.color_style_link3 .sc_icons_item:hover .sc_icons_item_title a, &.color_style_link3 .sc_icons_item .sc_icons_item_title a:hover { color: var(--theme-color-text_dark); } &.color_style_dark .sc_icons_item:hover .sc_icons_item_title, &.color_style_dark .sc_icons_item:hover .sc_icons_item_title a, &.color_style_dark .sc_icons_item .sc_icons_item_title a:hover { color: var(--theme-color-text_dark); } } .sc_icons_item_title { @include font(1.556em, 1.2em, 600); text-transform: uppercase; letter-spacing: 0; } .sc_icons_item_description { @include font(17px, 1.6em); color: var(--theme-color-text); } .sc_icons_item_description ul { list-style-type: none; padding-left: 0; } .sc_icons_item_description ul > li { @include flex; @include flex-justify-content(flex-start); @include flex-align-items(center); position: relative; margin: 8px 0; } .sc_align_center .sc_icons_item_description ul > li { @include flex-justify-content(center); } .sc_align_right .sc_icons_item_description ul > li { @include flex-justify-content(flex-end); } .sc_icons_item_description ul > li:first-child { margin-top: 0; } .sc_icons_item_description ul > li:last-child { margin-bottom: 0; } .sc_icons_item_description ul > li:before { margin-right: 10px; @include font(27px, inherit, 400); font-family: $theme_icons; content: '\E83C'; display: inline-block; position: relative; z-index: 1; color: var(--theme-color-text_link); } .sc_icons_item_description p:last-child, .sc_icons_item_description ul:last-child { margin-bottom: 0; } .sc_icons_item_title + .sc_icons_item_description { margin-top: 0.9em; } .sc_icons_item_description a { color: var(--theme-color-text); } .sc_icons_item_description a:hover { color: var(--theme-color-text_dark); } .sc_icon_type_svg svg, .sc_icon_type_svg object { @include box(4em, 4em); vertical-align: middle; } .sc_icons_size_small .sc_icons_icon:before, .sc_icons_size_small .sc_icons_icon > span:before { font-size: 3em; } .sc_icons_size_small .sc_icon_type_svg svg, .sc_icons_size_small .sc_icon_type_svg object { @include box(3em, 3em); } .sc_icons_size_large .sc_icons_icon:before, .sc_icons_size_large .sc_icons_icon > span:before { font-size: 5em; } .sc_icons_size_large .sc_icon_type_svg svg, .sc_icons_size_large .sc_icon_type_svg object { @include box(5em, 5em); } /* Style 'Partners' */ .sc_icons_partners { .sc_icons_item .sc_icons_image img { max-width: 37%; opacity: .2; will-change: opacity; @include transition(opacity .3s ease); } .sc_icons_item:hover .sc_icons_image img { opacity: 1; } .sc_icons_item_linked:hover .sc_icons_image img { @include transform(none); } } /* Style 'Modern' */ .sc_icons_modern { .sc_icons_item { @include flex; @include flex-direction(row); @include flex-justify-content(flex-start); @include flex-align-items(flex-start); } .sc_icons_item + .sc_icons_item { margin-top: 42px; } .sc_icons_item_details { padding-left: 0; min-height: auto; } &.sc_icons_size_large .sc_icons_item_details, &.sc_icons_size_small .sc_icons_item_details { padding-left: 0; min-height: auto; } &.sc_align_right .sc_icons_item_details, &.sc_icons_size_small.sc_align_right .sc_icons_item_details, &.sc_icons_size_large.sc_align_right .sc_icons_item_details { padding-left: 0; padding-right:0; } .sc_icons_icon, .sc_icons_image { position: relative; top: auto; left: auto; display: inline-block; @include square(6.4em); @include border-radius(50%); flex: 0 0 auto; } .sc_icons_image { max-width: none; @include flex; @include flex-justify-content(center); @include flex-align-items(center); background-color: var(--theme-color-alter_bg_hover); img { max-width: 60%; height: auto; } } .sc_icons_icon > span { display: inline-block; @include abs-lt; @include square(6.4em); } .sc_icons_icon:before, .sc_icons_icon > span:before { line-height: inherit !important; } .sc_icons_item_title + .sc_icons_item_description { margin-top: 0.9em; } .sc_icons_icon + .sc_icons_item_details, .sc_icons_image + .sc_icons_item_details { margin-left: 1.8em; margin-top: 1em; } &.sc_align_right .sc_icons_icon + .sc_icons_item_details, &.sc_align_right .sc_icons_image + .sc_icons_item_details { margin-left: 0; margin-right: 1.8em; } &.sc_icons_size_small .sc_icons_icon, &.sc_icons_size_small .sc_icons_image { @include square(5.4em); max-width: 5.4em; } &.sc_icons_size_small .sc_icons_icon > span { @include square(5.4em); } &.sc_icons_size_small .sc_icons_icon:before, &.sc_icons_size_small .sc_icons_icon > span:before { line-height: inherit !important; } &.sc_icons_size_large .sc_icons_icon, &.sc_icons_size_large .sc_icons_image { @include square(7.4em); } &.sc_icons_size_large .sc_icons_icon > span { @include square(7.4em); } &.sc_icons_size_large .sc_icons_icon:before, &.sc_icons_size_large .sc_icons_icon > span:before { line-height: inherit !important; } &.sc_align_center .sc_icons_item { @include flex-justify-content(center); } &.sc_align_right .sc_icons_item { @include flex-justify-content(flex-end); } &.sc_align_right .sc_icons_item .sc_icons_item_details { order: 1; } &.sc_align_right .sc_icons_item .sc_icons_icon, &.sc_align_right .sc_icons_item .sc_icons_image { order: 2; } .sc_icons_icon { color: var(--theme-color-alter_link); background-color: var(--theme-color-alter_bg_hover); } &.color_style_link2 .sc_icons_icon { color: var(--theme-color-alter_link2); } &.color_style_link3 .sc_icons_icon { color: var(--theme-color-alter_link3); } &.color_style_dark .sc_icons_icon { color: var(--theme-color-alter_dark); } } /* Style 'Light' */ .sc_icons_light { .sc_icons_item_title { @include font(1.333em, 1.2em); } .sc_icons_icon + .sc_icons_item_details, .sc_icons_image + .sc_icons_item_details { margin-top: 2em; } .sc_icons_icon:before, .sc_icons_icon > span:before { font-size: 3.2em; } .sc_icon_type_svg svg, .sc_icon_type_svg object { @include box(3.2em, 3.2em); } &.sc_icons_size_small .sc_icons_icon:before, &.sc_icons_size_small .sc_icons_icon > span:before { font-size: 2.2em; } &.sc_icons_size_small .sc_icon_type_svg svg, &.sc_icons_size_small .sc_icon_type_svg object { @include box(2.2em, 2.2em); } &.sc_icons_size_large .sc_icons_icon:before, &.sc_icons_size_large .sc_icons_icon > span:before { font-size: 4.2em; } &.sc_icons_size_large .sc_icon_type_svg svg, &.sc_icons_size_large .sc_icon_type_svg object { @include box(4.2em, 4.2em); } } /* Style 'Alter' */ .sc_icons_alter { .sc_icons_item { @include flex; @include flex-direction(row); @include flex-justify-content(flex-start); @include flex-align-items(flex-start); } .sc_icons_item .sc_icons_item_title + .sc_icons_item_more_link, .sc_icons_item .sc_icons_item_description + .sc_icons_item_more_link { margin-top: 1.2em; } .sc_icons_item_details { padding-right: 3%; padding-left: 0; min-height: auto; } &.sc_icons_size_large .sc_icons_item_details, &.sc_icons_size_small .sc_icons_item_details { padding-left: 0; min-height: auto; } &.sc_align_center .sc_icons_item_details, &.sc_icons_size_small.sc_align_center .sc_icons_item_details, &.sc_icons_size_large.sc_align_center .sc_icons_item_details { padding-right: 0; } &.sc_align_right .sc_icons_item_details, &.sc_icons_size_small.sc_align_right .sc_icons_item_details, &.sc_icons_size_large.sc_align_right .sc_icons_item_details { padding-left: 3%; padding-right:0; } .sc_icons_image img { max-width: 3.6em; } .sc_icons_icon + .sc_icons_item_details, .sc_icons_image + .sc_icons_item_details { margin-left: 1em; margin-top: 1.2em; } &.sc_icons_size_small .sc_icons_icon + .sc_icons_item_details, &.sc_icons_size_small .sc_icons_image + .sc_icons_item_details { margin-left: 1.4em; margin-top: 0; } &.sc_icons_size_large .sc_icons_icon + .sc_icons_item_details, &.sc_icons_size_large .sc_icons_image + .sc_icons_item_details { margin-left: 1.8em; margin-top: 1.3em; } .sc_icons_item_title, &.sc_icons_size_small .sc_icons_item_title { @include font(1.333em, 1.2em); } &.sc_icons_size_large .sc_icons_item_title { @include font(1.556em, 1.2em); } &.sc_align_right .sc_icons_icon + .sc_icons_item_details, &.sc_align_right .sc_icons_image + .sc_icons_item_details { margin-left: 0; margin-right: 1em; } &.sc_align_center .sc_icons_item { @include flex-justify-content(center); } &.sc_align_right .sc_icons_item { @include flex-justify-content(flex-end); } &.sc_align_right .sc_icons_item .sc_icons_item_details { order: 1; } &.sc_align_right .sc_icons_item .sc_icons_icon, &.sc_align_right .sc_icons_item .sc_icons_image { order: 2; } .sc_icons_icon:before, .sc_icons_icon > span:before { font-size: 3.6em; } .sc_icon_type_svg svg, .sc_icon_type_svg object { @include box(3.6em, 3.6em); } &.sc_icons_size_small .sc_icons_icon:before, &.sc_icons_size_small .sc_icons_icon > span:before { font-size: 2.8em; } &.sc_icons_size_small .sc_icon_type_svg svg, &.sc_icons_size_small .sc_icon_type_svg object { @include box(2.8em, 2.8em); } &.sc_icons_size_large .sc_icons_icon:before, &.sc_icons_size_large .sc_icons_icon > span:before { font-size: 4em; } &.sc_icons_size_large .sc_icon_type_svg svg, &.sc_icons_size_large .sc_icon_type_svg object { @include box(4em, 4em); } } /* Style 'Hover' */ .sc_icons_hover { margin: 0 -1.6em; .sc_icons_item { padding: 2em 1.6em; @include flex; @include flex-direction(row); @include flex-justify-content(flex-start); @include flex-align-items(flex-start); @include box-shadow(none); @include transition(box-shadow .3s ease-out); will-change: box-shadow; } .sc_icons_item:hover { @include box-shadow(0 3px 30px rgba(0,0,0, .05)); } .sc_icons_item_title + .sc_icons_item_description { margin-top: 0.8em; } .sc_icons_item .sc_icons_item_title + .sc_icons_item_more_link, .sc_icons_item .sc_icons_item_description + .sc_icons_item_more_link { margin-top: 1.4em; } .sc_icons_item.sc_icons_item_linked.with_more .sc_icons_item_link { z-index: 10; } .sc_icons_item_details { padding-left: 0; min-height: auto; } &.sc_icons_size_large .sc_icons_item_details, &.sc_icons_size_small .sc_icons_item_details { padding-left: 0; min-height: auto; } &.sc_align_right .sc_icons_item_details, &.sc_icons_size_small.sc_align_right .sc_icons_item_details, &.sc_icons_size_large.sc_align_right .sc_icons_item_details { padding-left: 0; padding-right: 0; } .sc_icons_image img { max-width: 4.2em; } .sc_icons_icon + .sc_icons_item_details, .sc_icons_image + .sc_icons_item_details { margin-left: 1.8em; margin-top: 0.7em; } &.sc_icons_size_small .sc_icons_icon + .sc_icons_item_details, &.sc_icons_size_small .sc_icons_image + .sc_icons_item_details { margin-left: 1.4em; margin-top: 0; } &.sc_icons_size_small .sc_icons_item_title { @include font(1.333em, 1.2em); } &.sc_align_right .sc_icons_icon + .sc_icons_item_details, &.sc_align_right .sc_icons_image + .sc_icons_item_details { margin-left: 0; margin-right: 1.8em; } &.sc_align_center .sc_icons_item { @include flex-justify-content(center); } &.sc_align_right .sc_icons_item { @include flex-justify-content(flex-end); } &.sc_align_right .sc_icons_item .sc_icons_item_details { order: 1; } &.sc_align_right .sc_icons_item .sc_icons_icon, &.sc_align_right .sc_icons_item .sc_icons_image { order: 2; } .sc_icons_icon:before, .sc_icons_icon > span:before { font-size: 4.2em; } .sc_icon_type_svg svg, .sc_icon_type_svg object { @include box(4.2em, 4.2em); } &.sc_icons_size_small .sc_icons_icon:before, &.sc_icons_size_small .sc_icons_icon > span:before { font-size: 2.8em; } &.sc_icons_size_small .sc_icon_type_svg svg, &.sc_icons_size_small .sc_icon_type_svg object { @include box(2.8em, 2.8em); } &.sc_icons_size_large .sc_icons_icon:before, &.sc_icons_size_large .sc_icons_icon > span:before { font-size: 5.2em; } &.sc_icons_size_large .sc_icon_type_svg svg, &.sc_icons_size_large .sc_icon_type_svg object { @include box(5.2em, 5.2em); } .sc_icons_item_linked:hover .sc_icons_icon { color: var(--theme-color-text_link); } &.color_style_link2 .sc_icons_item_linked:hover .sc_icons_icon { color: var(--theme-color-text_link2); } &.color_style_link2 .sc_icons_item .sc_icons_item_more_link:hover { color: var(--theme-color-text_dark); } &.color_style_link3 .sc_icons_item_linked:hover .sc_icons_icon { color: var(--theme-color-text_link3); } &.color_style_link3 .sc_icons_item .sc_icons_item_more_link:hover { color: var(--theme-color-text_dark); } &.color_style_dark .sc_icons_item_linked:hover .sc_icons_icon { color: var(--theme-color-text_dark); } &.color_style_dark .sc_icons_item .sc_icons_item_more_link:hover { color: var(--theme-color-text_dark); } } /* Style 'Hover 2' */ .sc_icons_hover2 { .sc_icons_item { padding: 2.5em 1.6em 3em; @include flex; @include flex-direction(row); @include flex-justify-content(flex-start); @include flex-align-items(flex-start); @include box-shadow(none); background-color: var(--theme-color-alter_bg_color); @include transition(box-shadow .3s ease-out); will-change: box-shadow; } .sc_icons_item:hover { @include box-shadow(0 10px 20px rgba(0,0,0, .05)); } .sc_icons_item_title + .sc_icons_item_description { margin-top: 0.8em; } .sc_icons_item .sc_icons_item_title + .sc_icons_item_more_link, .sc_icons_item .sc_icons_item_description + .sc_icons_item_more_link { margin-top: 1.4em; } .sc_icons_item.sc_icons_item_linked.with_more .sc_icons_item_link { z-index: 10; } .sc_icons_item_details { padding-right: 3%; padding-left: 0; min-height: auto; } &.sc_icons_size_large .sc_icons_item_details, &.sc_icons_size_small .sc_icons_item_details { padding-left: 0; min-height: auto; } &.sc_align_center .sc_icons_item_details, &.sc_icons_size_small.sc_align_center .sc_icons_item_details, &.sc_icons_size_large.sc_align_center .sc_icons_item_details { padding-right: 0; } &.sc_align_right .sc_icons_item_details, &.sc_icons_size_small.sc_align_right .sc_icons_item_details, &.sc_icons_size_large.sc_align_right .sc_icons_item_details { padding-left: 3%; padding-right:0; } .sc_icons_image img { max-width: 3.8em; } .sc_icons_icon + .sc_icons_item_details, .sc_icons_image + .sc_icons_item_details { margin-left: 1.4em; margin-top: 0.7em; } &.sc_icons_size_small .sc_icons_icon + .sc_icons_item_details, &.sc_icons_size_small .sc_icons_image + .sc_icons_item_details { margin-left: 1.4em; margin-top: 0; } &.sc_icons_size_small .sc_icons_item_title { @include font(1.333em, 1.2em); } &.sc_align_right .sc_icons_icon + .sc_icons_item_details, &.sc_align_right .sc_icons_image + .sc_icons_item_details { margin-left: 0; margin-right: 1.4em; } &.sc_align_center .sc_icons_item { @include flex-justify-content(center); } &.sc_align_right .sc_icons_item { @include flex-justify-content(flex-end); } &.sc_align_right .sc_icons_item .sc_icons_item_details { order: 1; } &.sc_align_right .sc_icons_item .sc_icons_icon, &.sc_align_right .sc_icons_item .sc_icons_image { order: 2; } .sc_icons_icon:before, .sc_icons_icon > span:before { font-size: 3.8em; } .sc_icon_type_svg svg, .sc_icon_type_svg object { @include box(3.8em, 3.8em); } &.sc_icons_size_small .sc_icons_icon:before, &.sc_icons_size_small .sc_icons_icon > span:before { font-size: 2.8em; } &.sc_icons_size_small .sc_icon_type_svg svg, &.sc_icons_size_small .sc_icon_type_svg object { @include box(2.8em, 2.8em); } &.sc_icons_size_large .sc_icons_icon:before, &.sc_icons_size_large .sc_icons_icon > span:before { font-size: 5.8em; } &.sc_icons_size_large .sc_icon_type_svg svg, &.sc_icons_size_large .sc_icon_type_svg object { @include box(5.8em, 5.8em); } .sc_icons_item_linked:hover .sc_icons_icon { color: var(--theme-color-text_link); } &.color_style_link2 .sc_icons_item_linked:hover .sc_icons_icon { color: var(--theme-color-text_link2); } &.color_style_link2 .sc_icons_item .sc_icons_item_more_link:hover { color: var(--theme-color-text_dark); } &.color_style_link3 .sc_icons_item_linked:hover .sc_icons_icon { color: var(--theme-color-text_link3); } &.color_style_link3 .sc_icons_item .sc_icons_item_more_link:hover { color: var(--theme-color-text_dark); } &.color_style_dark .sc_icons_item_linked:hover .sc_icons_icon { color: var(--theme-color-text_dark); } &.color_style_dark .sc_icons_item .sc_icons_item_more_link:hover { color: var(--theme-color-text_dark); } } /* Style 'Simple' */ .sc_icons_simple { .sc_icons_item { @include flex; @include flex-direction(row); @include flex-justify-content(flex-start); @include flex-align-items(flex-start); } .sc_icons_item + .sc_icons_item { margin-top: 1.2em; } .sc_icons_item .sc_icons_item_more_link .link_text, .sc_icons_item:hover .sc_icons_item_more_link .link_text, .sc_icons_item .sc_icons_item_more_link:hover .link_text { opacity: 1; text-indent: 0; margin-right: 0; visibility: visible; @include transition(initial); will-change: initial; } .sc_icons_item .sc_icons_item_more_link .link_icon { display: none; } .sc_icons_item .sc_icons_item_title + .sc_icons_item_more_link, .sc_icons_item .sc_icons_item_description + .sc_icons_item_more_link { margin-top: 0.5em; } .sc_icons_icon, .sc_icons_image { flex: 0 0 auto; @include square(1.8em); } .sc_icons_icon > span { @include square(1.8em); } .sc_icons_icon:before, .sc_icons_icon > span:before { font-size: 1.8em; line-height: inherit !important; } .sc_icon_type_svg svg, .sc_icon_type_svg object { @include box(1.8em, 1.8em); } .sc_icons_item_details { line-height: 1; } .sc_icons_icon + .sc_icons_item_details, .sc_icons_image + .sc_icons_item_details { margin-left: 0.8em; margin-top: 0; } .sc_icons_item_description { @include font(17px, 1.7em); } &.sc_align_right .sc_icons_icon + .sc_icons_item_details, &.sc_align_right .sc_icons_image + .sc_icons_item_details { margin-left: 0; margin-right: 0.8em; } &.sc_align_center .sc_icons_item { @include flex-justify-content(center); } &.sc_align_right .sc_icons_item { @include flex-justify-content(flex-end); } &.sc_align_right .sc_icons_item .sc_icons_item_details { order: 1; } &.sc_align_right .sc_icons_item .sc_icons_icon, &.sc_align_right .sc_icons_item .sc_icons_image { order: 2; } &.sc_icons_size_small .sc_icons_icon, &.sc_icons_size_small .sc_icons_image { @include square(1.6em); } &.sc_icons_size_small .sc_icons_icon + .sc_icons_item_details, &.sc_icons_size_small .sc_icons_image + .sc_icons_item_details { margin-top: 0; } &.sc_icons_size_small .sc_icons_icon > span { @include square(1.6em); } &.sc_icons_size_small .sc_icons_icon:before, &.sc_icons_size_small .sc_icons_icon > span:before { font-size: 1.3em; line-height: inherit !important; } &.sc_icons_size_small .sc_icon_type_svg svg, &.sc_icons_size_small .sc_icon_type_svg object { @include box(1.3em, 1.3em); } &.sc_icons_size_large .sc_icons_icon, &.sc_icons_size_large .sc_icons_image { @include square(2em); } &.sc_icons_size_large .sc_icons_icon + .sc_icons_item_details, &.sc_icons_size_large .sc_icons_image + .sc_icons_item_details { margin-top: 3px; } &.sc_icons_size_large .sc_icons_icon > span { @include square(2em); } &.sc_icons_size_large .sc_icons_icon:before, &.sc_icons_size_large .sc_icons_icon > span:before { font-size: 2em; line-height: inherit !important; } &.sc_icons_size_large .sc_icon_type_svg svg, &.sc_icons_size_large .sc_icon_type_svg object { @include box(2em, 2em); } .sc_icons_item .sc_icons_item_more_link { @include font(20px, 24px, 600); letter-spacing: 0; } } /* Style 'Bordered' */ .sc_icons_bordered { .sc_icons_item { @include flex; @include flex-direction(row); @include flex-justify-content(flex-start); @include flex-align-items(flex-start); } .sc_icons_item .sc_icons_item_more_link .link_text, .sc_icons_item:hover .sc_icons_item_more_link .link_text, .sc_icons_item .sc_icons_item_more_link:hover .link_text { opacity: 1; text-indent: 0; margin-right: 0; visibility: visible; @include transition(initial); will-change: initial; } .sc_icons_item .sc_icons_item_more_link .link_icon { display: none; } .sc_icons_item .sc_icons_item_title + .sc_icons_item_more_link, .sc_icons_item .sc_icons_item_description + .sc_icons_item_more_link { margin-top: 1.2em; } .sc_icons_item .sc_icons_icon { color: var(--theme-color-text_dark); } .sc_icons_item:hover .sc_icons_icon { color: var(--theme-color-text_link); } .sc_icons_item_linked:hover .sc_icons_icon { color: var(--theme-color-text_link); } &.color_style_link2 .sc_icons_item .sc_icons_icon { color: var(--theme-color-alter_link2); } &.color_style_link2 .sc_icons_item:hover .sc_icons_icon { color: var(--theme-color-alter_dark); } &.color_style_link3 .sc_icons_item .sc_icons_icon { color: var(--theme-color-alter_link3); } &.color_style_link3 .sc_icons_item:hover .sc_icons_icon { color: var(--theme-color-alter_dark); } &.color_style_dark .sc_icons_item .sc_icons_icon { color: var(--theme-color-alter_dark); } &.color_style_dark .sc_icons_item:hover .sc_icons_icon { color: var(--theme-color-alter_link); } .sc_icons_icon, .sc_icons_image { @include flex; @include flex-justify-content(center); @include flex-align-items(center); flex: 0 0 auto; @include square(4.2em); border: 1px solid var(--theme-color-bd_color); @include border-radius(50%); } .sc_icons_image img { max-width: 50%; } .sc_icons_icon > span { @include square(4.2em); } .sc_icons_icon:before, .sc_icons_icon > span:before { font-size: 1.8em; line-height: inherit !important; } .sc_icon_type_svg svg, .sc_icon_type_svg object { @include box(1.8em, 1.8em); } .sc_icons_item_details { line-height: 1; } .sc_icons_icon + .sc_icons_item_details, .sc_icons_image + .sc_icons_item_details { margin-left: 1em; margin-top: 1em; } .sc_icons_item_title { @include font(1.333em, 1.2em); } .sc_icons_item_description { @include font(17px, 1.7em); } .sc_icons_item_title + .sc_icons_item_description { margin-top: 0.8em; } &.sc_align_right .sc_icons_icon + .sc_icons_item_details, &.sc_align_right .sc_icons_image + .sc_icons_item_details { margin-left: 0; margin-right: 1em; } &.sc_align_center .sc_icons_item { @include flex-justify-content(center); } &.sc_align_right .sc_icons_item { @include flex-justify-content(flex-end); } &.sc_align_right .sc_icons_item .sc_icons_item_details { order: 1; } &.sc_align_right .sc_icons_item .sc_icons_icon, &.sc_align_right .sc_icons_item .sc_icons_image { order: 2; } &.sc_icons_size_small .sc_icons_icon, &.sc_icons_size_small .sc_icons_image { @include square(3.2em); } &.sc_icons_size_small .sc_icons_icon + .sc_icons_item_details, &.sc_icons_size_small .sc_icons_image + .sc_icons_item_details { margin-top: 0.8em; } &.sc_icons_size_small .sc_icons_icon > span { @include square(3.2em); } &.sc_icons_size_small .sc_icons_icon:before, &.sc_icons_size_small .sc_icons_icon > span:before { font-size: 1.3em; line-height: inherit !important; } &.sc_icons_size_small .sc_icon_type_svg svg, &.sc_icons_size_small .sc_icon_type_svg object { @include box(1.3em, 1.3em); } &.sc_icons_size_large .sc_icons_icon, &.sc_icons_size_large .sc_icons_image { @include square(5.2em); } &.sc_icons_size_large .sc_icons_icon + .sc_icons_item_details, &.sc_icons_size_large .sc_icons_image + .sc_icons_item_details { margin-top: 1em; } &.sc_icons_size_large .sc_icons_icon > span { @include square(5.2em); } &.sc_icons_size_large .sc_icons_icon:before, &.sc_icons_size_large .sc_icons_icon > span:before { font-size: 2em; line-height: inherit !important; } &.sc_icons_size_large .sc_icon_type_svg svg, &.sc_icons_size_large .sc_icon_type_svg object { @include box(2em, 2em); } .sc_icons_item .sc_icons_item_more_link { @include font(20px, 24px); letter-spacing: -0.3px; } } /* Style 'Plate' */ .sc_icons_plate { .sc_icons_item { @include flex; @include flex-direction(column); padding: 2em; background-color: var(--theme-color-text_link_007); @include transform(translateY(0)); @include transition(transform .3s ease-out); will-change: transform; &:hover { @include transform(translateY(-8px)); } } .sc_icons_item:nth-child(3n-1), .slider-slide:nth-child(3n-1) .sc_icons_item, [class*="trx_addons_column-"]:nth-child(3n-1) .sc_icons_item { background-color: var(--theme-color-text_link2_007); } .sc_icons_item:nth-child(3n), .slider-slide:nth-child(3n) .sc_icons_item, [class*="trx_addons_column-"]:nth-child(3n) .sc_icons_item { background-color: var(--theme-color-text_link3_007); } .sc_icons_item .sc_icons_icon { color: var(--theme-color-text_dark); } .sc_icons_item:hover .sc_icons_icon { color: var(--theme-color-text_dark); } .sc_icons_item_linked:hover .sc_icons_icon { color: var(--theme-color-text_dark); } &.color_style_link2 .sc_icons_item .sc_icons_icon { color: var(--theme-color-alter_link2); } &.color_style_link2 .sc_icons_item:hover .sc_icons_icon { color: var(--theme-color-alter_dark); } &.color_style_link3 .sc_icons_item .sc_icons_icon { color: var(--theme-color-alter_link3); } &.color_style_link3 .sc_icons_item:hover .sc_icons_icon { color: var(--theme-color-alter_dark); } &.color_style_dark .sc_icons_item .sc_icons_icon { color: var(--theme-color-alter_dark); } &.color_style_dark .sc_icons_item:hover .sc_icons_icon { color: var(--theme-color-alter_link); } .sc_icons_item .sc_icons_item_more_link { @include font(18px, 26px, 500); z-index: 11; } .sc_icons_item.sc_icons_item_linked.with_more .sc_icons_item_link { z-index: 10; } .sc_icons_item .sc_icons_item_more_link .link_text, .sc_icons_item:hover .sc_icons_item_more_link .link_text, .sc_icons_item .sc_icons_item_more_link:hover .link_text { opacity: 1; text-indent: 0; margin-right: 0; visibility: visible; @include transition(initial); will-change: initial; } .sc_icons_item .sc_icons_item_more_link .link_icon { display: none; } .sc_icons_item .sc_icons_item_title + .sc_icons_item_more_link, .sc_icons_item .sc_icons_item_description + .sc_icons_item_more_link { margin-top: 0.1em; } .sc_icons_icon + .sc_icons_item_details, .sc_icons_image + .sc_icons_item_details { margin-top: 2em; } .sc_icons_icon, .sc_icons_image { @include square(3em); } .sc_icons_icon > span { @include square(3em); } .sc_icons_icon:before, .sc_icons_icon > span:before { font-size: 3em; line-height: inherit !important; } .sc_icon_type_svg svg, .sc_icon_type_svg object { @include box(3em, 3em); } &.sc_icons_size_small .sc_icons_icon, &.sc_icons_size_small .sc_icons_image { @include square(2em); } &.sc_icons_size_small .sc_icons_icon > span { @include square(2em); } &.sc_icons_size_small .sc_icons_icon:before, &.sc_icons_size_small .sc_icons_icon > span:before { font-size: 2em; line-height: inherit !important; } &.sc_icons_size_small .sc_icon_type_svg svg, &.sc_icons_size_small .sc_icon_type_svg object { @include box(2em, 2em); } &.sc_icons_size_large .sc_icons_icon, &.sc_icons_size_large .sc_icons_image { @include square(4em); } &.sc_icons_size_large .sc_icons_icon > span { @include square(4em); } &.sc_icons_size_large .sc_icons_icon:before, &.sc_icons_size_large .sc_icons_icon > span:before { font-size: 4em; line-height: inherit !important; } &.sc_icons_size_large .sc_icon_type_svg svg, &.sc_icons_size_large .sc_icon_type_svg object { @include box(4em, 4em); } .sc_icons_item_title { @include font(19px, 28px, 600); } .sc_icons_item_title + .sc_icons_item_description { margin-top: 0.3em; } &.sc_align_center .sc_icons_item { @include flex-align-items(center); } &.sc_align_right .sc_icons_item { @include flex-align-items(flex-end); } } /* Style 'Extra' */ .sc_icons_extra { .sc_icons_item .sc_icons_item_title + .sc_icons_item_more_link, .sc_icons_item .sc_icons_item_description + .sc_icons_item_more_link { margin-top: 1em; } .sc_icons_item .sc_icons_item_more_link .link_icon { border: 1px solid var(--theme-color-bd_color); text-align: center; @include box(2.2em, 2.2em, 2.15em); @include border-box; @include border-radius(50%); } .ua_firefox & .sc_icons_item .sc_icons_item_more_link .link_icon { line-height: 2.07em; } .sc_icons_item:hover .sc_icons_item_more_link .link_text, .sc_icons_item .sc_icons_item_more_link:hover .link_text { margin-right: 8px; } .sc_icons_item .sc_icons_item_more_link .link_icon:before { @include font(9px, inherit, 400); } .sc_icons_item_title { @include font(1.333em, 1.2em); } .sc_icons_item .sc_icons_icon { color: var(--theme-color-text_dark); } .sc_icons_item:hover .sc_icons_icon, .sc_icons_item_linked:hover .sc_icons_icon { color: var(--theme-color-text_link); } &.color_style_link2 .sc_icons_item:hover .sc_icons_icon, &.color_style_link2 .sc_icons_item_linked:hover .sc_icons_icon { color: var(--theme-color-text_link2); } &.color_style_link3 .sc_icons_item:hover .sc_icons_icon, &.color_style_link3 .sc_icons_item_linked:hover .sc_icons_icon { color: var(--theme-color-text_link3); } &.color_style_dark .sc_icons_item .sc_icons_icon { color: var(--theme-color-text_link); } &.color_style_dark .sc_icons_item:hover .sc_icons_icon, &.color_style_dark .sc_icons_item_linked:hover .sc_icons_icon { color: var(--theme-color-text_dark); } .sc_icons_icon + .sc_icons_item_details, .sc_icons_image + .sc_icons_item_details { margin-top: 1.3em; } .sc_icons_icon:before, .sc_icons_icon > span:before { font-size: 5em; } .sc_icon_type_svg svg, .sc_icon_type_svg object { @include box(5em, 5em); } &.sc_icons_size_small .sc_icons_icon:before, &.sc_icons_size_small .sc_icons_icon > span:before { font-size: 3.2em; } &.sc_icons_size_small .sc_icon_type_svg svg, &.sc_icons_size_small .sc_icon_type_svg object { @include box(3.2em, 3.2em); } &.sc_icons_size_large .sc_icons_icon:before, &.sc_icons_size_large .sc_icons_icon > span:before { font-size: 8em; } &.sc_icons_size_large .sc_icon_type_svg svg, &.sc_icons_size_large .sc_icon_type_svg object { @include box(8em, 8em); } } /* Style 'Plain' */ .sc_icons_plain { .sc_icons_item .sc_icons_item_more_link { @include font(17px, initial, 400); text-transform: none; letter-spacing: 0.1px; color: var(--theme-color-text); } .sc_icons_item .sc_icons_item_more_link:hover { color: var(--theme-color-text_dark); } .sc_icons_item .sc_icons_item_more_link .link_text, .sc_icons_item:hover .sc_icons_item_more_link .link_text, .sc_icons_item .sc_icons_item_more_link:hover .link_text { opacity: 1; text-indent: 0; margin-right: 0; visibility: visible; @include transition(initial); will-change: initial; } .sc_icons_item .sc_icons_item_more_link .link_icon { display: none; } .sc_icons_item .sc_icons_item_title + .sc_icons_item_more_link, .sc_icons_item .sc_icons_item_description + .sc_icons_item_more_link { margin-top: 0; } .sc_icons_item .sc_icons_icon { color: var(--theme-color-text_dark); } .sc_icons_item:hover .sc_icons_icon { color: var(--theme-color-text_link); } .sc_icons_item_linked:hover .sc_icons_icon { color: var(--theme-color-text_link); } &.color_style_link2 .sc_icons_item .sc_icons_icon { color: var(--theme-color-alter_link2); } &.color_style_link2 .sc_icons_item:hover .sc_icons_icon { color: var(--theme-color-alter_dark); } &.color_style_link3 .sc_icons_item .sc_icons_icon { color: var(--theme-color-alter_link3); } &.color_style_link3 .sc_icons_item:hover .sc_icons_icon { color: var(--theme-color-alter_dark); } &.color_style_dark .sc_icons_item .sc_icons_icon { color: var(--theme-color-alter_dark); } &.color_style_dark .sc_icons_item:hover .sc_icons_icon { color: var(--theme-color-alter_link); } .sc_icons_item_title { @include font(1.333em, 1.2em); } .sc_icons_icon:before, .sc_icons_icon > span:before { font-size: 4.4em; } .sc_icon_type_svg svg, .sc_icon_type_svg object { @include box(4.4em, 4.4em); } &.sc_icons_size_small .sc_icons_icon:before, &.sc_icons_size_small .sc_icons_icon > span:before { font-size: 3.4em; } &.sc_icons_size_small .sc_icon_type_svg svg, &.sc_icons_size_small .sc_icon_type_svg object { @include box(3.4em, 3.4em); } &.sc_icons_size_large .sc_icons_icon:before, &.sc_icons_size_large .sc_icons_icon > span:before { font-size: 5.4em; } &.sc_icons_size_large .sc_icon_type_svg svg, &.sc_icons_size_large .sc_icon_type_svg object { @include box(5.4em, 5.4em); } } /* Style 'Card' */ .sc_icons_card { .sc_icons_item { padding: 4.4em 2.4em 2.8em; color: var(--theme-color-alter_text); background-color: var(--theme-color-alter_bg_color); border: 1px solid var(--theme-color-alter_bd_color); @include transition(box-shadow .3s ease-out); will-change: box-shadow; .sc_icons_icon { color: var(--theme-color-alter_link); } &:hover { @include box-shadow(0 5px 30px rgba(0,0,0, .05)); } } .sc_icons_item .sc_icons_item_more_link .link_text { display: none; } .sc_icons_item.sc_icons_item_linked.with_more .sc_icons_item_link { z-index: 10; } .sc_icons_item .sc_icons_item_title, .sc_icons_item .sc_icons_item_title a { color: var(--theme-color-alter_dark); } .sc_icons_item .sc_icons_item_title a:hover { color: var(--theme-color-alter_dark); } .sc_icons_item .sc_icons_item_title + .sc_icons_item_more_link, .sc_icons_item .sc_icons_item_description + .sc_icons_item_more_link { margin-top: 1.7em; } .sc_icons_icon + .sc_icons_item_details, .sc_icons_image + .sc_icons_item_details { margin-top: 2em; } .sc_icons_item:hover .sc_icons_icon { color: var(--theme-color-alter_dark); } .sc_icons_item .sc_icons_item_more_link { color: var(--theme-color-alter_dark); } .sc_icons_item:hover .sc_icons_item_more_link { color: var(--theme-color-alter_link); } &.color_style_link2 .sc_icons_item .sc_icons_icon { color: var(--theme-color-alter_link2); } &.color_style_link2 .sc_icons_item:hover .sc_icons_icon { color: var(--theme-color-alter_dark); } &.color_style_link2 .sc_icons_item .sc_icons_item_more_link { color: var(--theme-color-alter_dark); } &.color_style_link2 .sc_icons_item:hover .sc_icons_item_more_link { color: var(--theme-color-alter_link2); } &.color_style_link2 .sc_icons_item .sc_icons_item_title a:hover { color: var(--theme-color-alter_dark); } &.color_style_link3 .sc_icons_item .sc_icons_icon { color: var(--theme-color-alter_link3); } &.color_style_link3 .sc_icons_item:hover .sc_icons_icon { color: var(--theme-color-alter_dark); } &.color_style_link3 .sc_icons_item .sc_icons_item_more_link { color: var(--theme-color-alter_dark); } &.color_style_link3 .sc_icons_item:hover .sc_icons_item_more_link { color: var(--theme-color-alter_link3); } &.color_style_link3 .sc_icons_item .sc_icons_item_title a:hover { color: var(--theme-color-alter_dark); } &.color_style_dark .sc_icons_item .sc_icons_icon { color: var(--theme-color-alter_dark); } &.color_style_dark .sc_icons_item:hover .sc_icons_icon { color: var(--theme-color-alter_link); } &.color_style_dark .sc_icons_item .sc_icons_item_more_link { color: var(--theme-color-alter_link); } &.color_style_dark .sc_icons_item:hover .sc_icons_item_more_link { color: var(--theme-color-alter_dark); } &.color_style_dark .sc_icons_item .sc_icons_item_title a:hover { color: var(--theme-color-alter_dark); } } /* Style 'Creative' */ .sc_icons_creative { .sc_icons_item { padding: 0 2em; @include flex; @include flex-direction(column); @include flex-justify-content(flex-start); @include flex-align-items(flex-start); } .sc_icons_slider .sc_icons_item { padding-top: 3px; padding-bottom: 3px; } .sc_icons_item:nth-child(3n-1) .sc_icons_decoration_bg svg, [class*="trx_addons_column-"]:nth-child(3n-1) .sc_icons_item .sc_icons_decoration_bg svg { @include transform(rotate(-60deg)); } .sc_icons_item:nth-child(3n) .sc_icons_decoration_bg svg, [class*="trx_addons_column-"]:nth-child(3n) .sc_icons_item .sc_icons_decoration_bg svg { @include transform(rotate(-120deg)); } &.sc_align_center .sc_icons_item { @include flex-align-items(center); text-align: center; } &.sc_align_right .sc_icons_item { @include flex-align-items(flex-end); text-align: right; } .sc_icons_icon, .sc_icons_image { position: relative; z-index: 2; @include square(112px); @include flex; @include flex-justify-content(center); @include flex-align-items(center); } .sc_icons_icon { @include transition(color .3s ease); will-change: color; } .sc_icons_image img { max-width: 60%; } .sc_icons_icon + .sc_icons_item_details, .sc_icons_image + .sc_icons_item_details { margin-top: 2em; } .sc_icons_decoration_bg { @include abs-cc(-1); line-height: normal; svg.decor-svg { @include box(112px, 112px); @include transition(fill .3s ease); will-change: fill; } } .sc_icons_item .sc_icons_decoration_bg svg.decor-svg { fill: var(--theme-color-alter_bg_hover) !important; stroke: none; } .sc_icons_item:hover .sc_icons_decoration_bg svg.decor-svg { fill: var(--theme-color-alter_link) !important; } .sc_icons_item .sc_icons_icon { color: var(--theme-color-alter_link); } .sc_icons_item:hover .sc_icons_icon { color: var(--theme-color-inverse_link); } &.color_style_link2 .sc_icons_item:hover .sc_icons_decoration_bg svg.decor-svg { fill: var(--theme-color-alter_link2) !important; } &.color_style_link2 .sc_icons_item .sc_icons_icon { color: var(--theme-color-alter_link2); } &.color_style_link2 .sc_icons_item:hover .sc_icons_icon { color: var(--theme-color-inverse_link); } &.color_style_link3 .sc_icons_item:hover .sc_icons_decoration_bg svg.decor-svg { fill: var(--theme-color-alter_link3) !important; } &.color_style_link3 .sc_icons_item .sc_icons_icon { color: var(--theme-color-alter_link3); } &.color_style_link3 .sc_icons_item:hover .sc_icons_icon { color: var(--theme-color-inverse_link); } &.color_style_dark .sc_icons_item:hover .sc_icons_decoration_bg svg.decor-svg { fill: var(--theme-color-alter_dark) !important; } &.color_style_dark .sc_icons_item .sc_icons_icon { color: var(--theme-color-alter_dark); } &.color_style_dark .sc_icons_item:hover .sc_icons_icon { color: var(--theme-color-inverse_hover); } .sc_icons_icon > span { @include square(112px); } .sc_icons_icon:before, .sc_icons_icon > span:before { font-size: 3.4em; line-height: inherit !important; } .sc_icon_type_svg svg, .sc_icon_type_svg object { @include box(3.4em, 3.4em); } &.sc_icons_size_small .sc_icons_icon, &.sc_icons_size_small .sc_icons_image { @include square(100px); } &.sc_icons_size_small .sc_icons_icon > span { @include square(100px); } &.sc_icons_size_small .sc_icons_decoration_bg svg { @include box(100px, 100px); } &.sc_icons_size_small .sc_icons_icon:before, &.sc_icons_size_small .sc_icons_icon > span:before { font-size: 2.4em; line-height: inherit !important; } &.sc_icons_size_small .sc_icon_type_svg svg, &.sc_icons_size_small .sc_icon_type_svg object { @include box(2.4em, 2.4em); } &.sc_icons_size_small .sc_icons_icon + .sc_icons_item_details, &.sc_icons_size_small .sc_icons_image + .sc_icons_item_details { margin-top: 1.5em; } &.sc_icons_size_large .sc_icons_icon:before, &.sc_icons_size_large .sc_icons_icon > span:before { font-size: 4.4em; line-height: inherit !important; } &.sc_icons_size_large .sc_icon_type_svg svg, &.sc_icons_size_large .sc_icon_type_svg object { @include box(4.4em, 4.4em); } &.sc_icons_size_large .sc_icons_icon, &.sc_icons_size_large .sc_icons_image { @include square(130px); } &.sc_icons_size_large .sc_icons_icon > span { @include square(130px); } &.sc_icons_size_large .sc_icons_decoration_bg svg { @include box(130px, 130px); } } /* Style 'Accent' */ .sc_icons_accent { .sc_icons_columns_wrap { margin: 0; } .trx_addons_columns_wrap > [class*="trx_addons_column-"] { padding: 0; } .trx_addons_columns_wrap.columns_padding_bottom.columns_in_single_row > [class*="trx_addons_column-"] { padding-bottom: 0; } .sc_icons_item { padding: 3.4em 2em; background-color: transparent; @include transition(background-color .3s ease-out, box-shadow .3s ease-out); will-change: background-color, box-shadow; } .sc_icons_item:hover { background-color: var(--theme-color-text_link); @include box-shadow(0 5px 30px var(--theme-color-text_link_03)); } .sc_icons_item:hover .sc_icons_icon { color: var(--theme-color-inverse_link); } .sc_icons_item_title { @include font(1.333em, 1.2em); } .sc_icons_item_title, .sc_icons_item_title a { color: var(--theme-color-text_dark); } .sc_icons_item:hover .sc_icons_item_title, .sc_icons_item:hover .sc_icons_item_title a, .sc_icons_item .sc_icons_item_title a:hover { color: var(--theme-color-inverse_link); } .sc_icons_item_description { color: var(--theme-color-text); @include transition(color .3s ease-out); } .sc_icons_item:hover .sc_icons_item_description { color: var(--theme-color-inverse_link); } .sc_icons_item_title + .sc_icons_item_description { margin-top: 0.8em; } .sc_icons_icon + .sc_icons_item_details, .sc_icons_image + .sc_icons_item_details { margin-top: 1.5em; } .sc_icons_item.sc_icons_item_linked.with_more .sc_icons_item_link { z-index: 10; } .sc_icons_item .sc_icons_item_more_link { color: var(--theme-color-text_dark); } .sc_icons_item:hover .sc_icons_item_more_link { color: var(--theme-color-inverse_link); } &.color_style_link2 .sc_icons_item:hover { background-color: var(--theme-color-text_link2); @include box-shadow(0 5px 30px var(--theme-color-text_link2_03)); } &.color_style_link2 .sc_icons_item:hover .sc_icons_icon { color: var(--theme-color-inverse_link); } &.color_style_link2 .sc_icons_item:hover .sc_icons_item_title, &.color_style_link2 .sc_icons_item:hover .sc_icons_item_title a, &.color_style_link2 .sc_icons_item .sc_icons_item_title a:hover { color: var(--theme-color-inverse_link); } &.color_style_link2 .sc_icons_item:hover .sc_icons_item_description { color: var(--theme-color-inverse_link); } &.color_style_link2 .sc_icons_item:hover .sc_icons_item_more_link { color: var(--theme-color-inverse_link); } &.color_style_link3 .sc_icons_item:hover { background-color: var(--theme-color-text_link3); @include box-shadow(0 5px 30px var(--theme-color-text_link3_03)); } &.color_style_link3 .sc_icons_item:hover .sc_icons_icon { color: var(--theme-color-inverse_link); } &.color_style_link3 .sc_icons_item:hover .sc_icons_item_title, &.color_style_link3 .sc_icons_item:hover .sc_icons_item_title a, &.color_style_link3 .sc_icons_item .sc_icons_item_title a:hover { color: var(--theme-color-inverse_link); } &.color_style_link3 .sc_icons_item:hover .sc_icons_item_description { color: var(--theme-color-inverse_link); } &.color_style_link3 .sc_icons_item:hover .sc_icons_item_more_link { color: var(--theme-color-inverse_link); } &.color_style_dark .sc_icons_item:hover { background-color: var(--theme-color-text_dark); @include box-shadow(0 5px 30px var(--theme-color-text_dark_03)); } &.color_style_dark .sc_icons_item:hover .sc_icons_icon { color: var(--theme-color-inverse_hover); } &.color_style_dark .sc_icons_item:hover .sc_icons_item_title, &.color_style_dark .sc_icons_item:hover .sc_icons_item_title a, &.color_style_dark .sc_icons_item .sc_icons_item_title a:hover { color: var(--theme-color-inverse_hover); } &.color_style_dark .sc_icons_item:hover .sc_icons_item_description { color: var(--theme-color-inverse_hover); } &.color_style_dark .sc_icons_item:hover .sc_icons_item_more_link { color: var(--theme-color-inverse_hover); } } /* Style 'Accent 2' */ .sc_icons_accent2 { .sc_icons_item { padding: 2.4em 2.2em; background-color: var(--theme-color-alter_bg_color); @include box-shadow(0 3px 30px rgba(0,0,0,.03)); @include transition(background-color .3s ease-out, box-shadow .3s ease-out); will-change: background-color, box-shadow; } .sc_icons_item:hover { background-color: var(--theme-color-alter_link); @include box-shadow(0 3px 30px rgba(0,0,0,0)); } .sc_icons_item_title { @include font(1.333em, 1.2em); } .sc_icons_item_title, .sc_icons_item_title a { color: var(--theme-color-alter_dark); } .sc_icons_item:hover .sc_icons_item_title, .sc_icons_item:hover .sc_icons_item_title a, .sc_icons_item .sc_icons_item_title a:hover { color: var(--theme-color-inverse_link); } .sc_icons_item_title + .sc_icons_item_description { margin-top: 0.3em; } .sc_icons_item_description { color: var(--theme-color-alter_text); @include transition(color .3s ease-out); } .sc_icons_item:hover .sc_icons_item_description { color: var(--theme-color-inverse_link); } .sc_icons_icon + .sc_icons_item_details, .sc_icons_image + .sc_icons_item_details { margin-top: 4.4em; } .sc_icons_item.sc_icons_item_linked.with_more .sc_icons_item_link { z-index: 10; } .sc_icons_item:hover .sc_icons_icon { color: var(--theme-color-inverse_link); } .sc_icons_icon:before, .sc_icons_icon > span:before { font-size: 3.6em; } .sc_icon_type_svg svg, .sc_icon_type_svg object { @include box(3.6em, 3.6em); } &.sc_icons_size_small .sc_icons_icon:before, &.sc_icons_size_small .sc_icons_icon > span:before { font-size: 2.6em; } &.sc_icons_size_small .sc_icon_type_svg svg, &.sc_icons_size_small .sc_icon_type_svg object { @include box(2.6em, 2.6em); } &.sc_icons_size_large .sc_icons_icon:before, &.sc_icons_size_large .sc_icons_icon > span:before { font-size: 4.6em; } &.sc_icons_size_large .sc_icon_type_svg svg, &.sc_icons_size_large .sc_icon_type_svg object { @include box(4.6em, 4.6em); } .sc_icons_item:hover .sc_icons_item_more_link { color: var(--theme-color-inverse_link); } &.color_style_link2 .sc_icons_item:hover { background-color: var(--theme-color-alter_link2); } &.color_style_link2 .sc_icons_item:hover .sc_icons_icon { color: var(--theme-color-inverse_link); } &.color_style_link2 .sc_icons_item:hover .sc_icons_item_title, &.color_style_link2 .sc_icons_item:hover .sc_icons_item_title a, &.color_style_link2 .sc_icons_item .sc_icons_item_title a:hover { color: var(--theme-color-inverse_link); } &.color_style_link2 .sc_icons_item:hover .sc_icons_item_description { color: var(--theme-color-inverse_link); } &.color_style_link2 .sc_icons_item:hover .sc_icons_item_more_link { color: var(--theme-color-inverse_link); } &.color_style_link3 .sc_icons_item:hover { background-color: var(--theme-color-alter_link3); } &.color_style_link3 .sc_icons_item:hover .sc_icons_icon { color: var(--theme-color-inverse_link); } &.color_style_link3 .sc_icons_item:hover .sc_icons_item_title, &.color_style_link3 .sc_icons_item:hover .sc_icons_item_title a, &.color_style_link3 .sc_icons_item .sc_icons_item_title a:hover { color: var(--theme-color-inverse_link); } &.color_style_link3 .sc_icons_item:hover .sc_icons_item_description { color: var(--theme-color-inverse_link); } &.color_style_link3 .sc_icons_item:hover .sc_icons_item_more_link { color: var(--theme-color-inverse_link); } &.color_style_dark .sc_icons_item:hover { background-color: var(--theme-color-alter_dark); } &.color_style_dark .sc_icons_item:hover .sc_icons_icon { color: var(--theme-color-inverse_hover); } &.color_style_dark .sc_icons_item:hover .sc_icons_item_title, &.color_style_dark .sc_icons_item:hover .sc_icons_item_title a, &.color_style_dark .sc_icons_item .sc_icons_item_title a:hover { color: var(--theme-color-inverse_hover); } &.color_style_dark .sc_icons_item:hover .sc_icons_item_description { color: var(--theme-color-inverse_hover); } &.color_style_dark .sc_icons_item:hover .sc_icons_item_more_link { color: var(--theme-color-inverse_hover); } } /* Style 'Motley' */ .sc_icons_motley { .sc_icons_item { padding: 5.2em 2.4em; background-color: var(--theme-color-alter_link); @include box-shadow(0 12px 20px rgba(0,0,0,.05)); @include transform(translateY(0)); @include transition(transform .3s ease-out); will-change: transform; } .sc_icons_item:hover { @include transform(translateY(-8px)); } .sc_icons_item .sc_icons_icon { color: var(--theme-color-inverse_link); } .sc_icons_item_linked:hover .sc_icons_icon { color: var(--theme-color-inverse_link); } .sc_icons_item .sc_icons_item_title, .sc_icons_item .sc_icons_item_title a { color: var(--theme-color-inverse_link); } .sc_icons_item:hover .sc_icons_item_title, .sc_icons_item:hover .sc_icons_item_title a, .sc_icons_item .sc_icons_item_title a:hover { color: var(--theme-color-inverse_link); } .sc_icons_item .sc_icons_item_description { color: var(--theme-color-inverse_link_08); } .sc_icons_item .sc_icons_item_more_link { color: var(--theme-color-inverse_link); } .sc_icons_item.sc_icons_item_linked.with_more .sc_icons_item_link { z-index: 10; } .sc_icons_item:nth-child(3n-1), .slider-slide:nth-child(3n-1) .sc_icons_item, [class*="trx_addons_column-"]:nth-child(3n-1) .sc_icons_item { background-color: var(--theme-color-alter_dark); } .sc_icons_item:nth-child(3n-1) .sc_icons_icon, [class*="trx_addons_column-"]:nth-child(3n-1) .sc_icons_item .sc_icons_icon { color: var(--theme-color-inverse_hover); } .slider-slide:nth-child(3n-1) .sc_icons_item .sc_icons_item_title, .slider-slide:nth-child(3n-1) .sc_icons_item .sc_icons_item_title a, .sc_icons_item:nth-child(3n-1) .sc_icons_item .sc_icons_item_title, .sc_icons_item:nth-child(3n-1) .sc_icons_item .sc_icons_item_title a, [class*="trx_addons_column-"]:nth-child(3n-1) .sc_icons_item .sc_icons_item_title, [class*="trx_addons_column-"]:nth-child(3n-1) .sc_icons_item .sc_icons_item_title a { color: var(--theme-color-inverse_hover); } .slider-slide:hover:nth-child(3n-1) .sc_icons_item_title, .slider-slide:hover:nth-child(3n-1) .sc_icons_item_title a, .slider-slide:nth-child(3n-1) .sc_icons_item_title a:hover, .sc_icons_item:hover:nth-child(3n-1) .sc_icons_item_title, .sc_icons_item:hover:nth-child(3n-1) .sc_icons_item_title a, .sc_icons_item:nth-child(3n-1) .sc_icons_item_title a:hover, [class*="trx_addons_column-"]:nth-child(3n-1) .sc_icons_item:hover .sc_icons_item_title, [class*="trx_addons_column-"]:nth-child(3n-1) .sc_icons_item:hover .sc_icons_item_title a, [class*="trx_addons_column-"]:nth-child(3n-1) .sc_icons_item .sc_icons_item_title a:hover { color: var(--theme-color-inverse_hover); } .sc_icons_item:nth-child(3n-1) .sc_icons_item .sc_icons_item_description, .slider-slide:nth-child(3n-1) .sc_icons_item .sc_icons_item_description, [class*="trx_addons_column-"]:nth-child(3n-1) .sc_icons_item .sc_icons_item_description { color: var(--theme-color-inverse_hover_08); } .sc_icons_item:nth-child(3n-1) .sc_icons_item .sc_icons_item_more_link, .slider-slide:nth-child(3n-1) .sc_icons_item .sc_icons_item_more_link, [class*="trx_addons_column-"]:nth-child(3n-1) .sc_icons_item .sc_icons_item_more_link { color: var(--theme-color-inverse_hover); } .sc_icons_item:nth-child(3n), .slider-slide:nth-child(3n) .sc_icons_item, [class*="trx_addons_column-"]:nth-child(3n) .sc_icons_item { background-color: var(--theme-color-alter_bg_color); } .sc_icons_item:nth-child(3n) .sc_icons_icon, .slider-slide:nth-child(3n) .sc_icons_item .sc_icons_icon, [class*="trx_addons_column-"]:nth-child(3n) .sc_icons_item .sc_icons_icon { color: var(--theme-color-alter_link); } .sc_icons_item:nth-child(3n) .sc_icons_item .sc_icons_item_title, .sc_icons_item:nth-child(3n) .sc_icons_item .sc_icons_item_title a, .slider-slide:nth-child(3n) .sc_icons_item .sc_icons_item_title, .slider-slide:nth-child(3n) .sc_icons_item .sc_icons_item_title a, [class*="trx_addons_column-"]:nth-child(3n) .sc_icons_item .sc_icons_item_title, [class*="trx_addons_column-"]:nth-child(3n) .sc_icons_item .sc_icons_item_title a { color: var(--theme-color-alter_dark); } .sc_icons_item:hover:nth-child(3n) .sc_icons_item_title, .sc_icons_item:hover:nth-child(3n) .sc_icons_item_title a, .sc_icons_item:nth-child(3n) .sc_icons_item_title a:hover, .slider-slide:nth-child(3n) .sc_icons_item:hover .sc_icons_item_title, .slider-slide:nth-child(3n) .sc_icons_item:hover .sc_icons_item_title a, .slider-slide:nth-child(3n) .sc_icons_item .sc_icons_item_title a:hover, [class*="trx_addons_column-"]:nth-child(3n) .sc_icons_item:hover .sc_icons_item_title, [class*="trx_addons_column-"]:nth-child(3n) .sc_icons_item:hover .sc_icons_item_title a, [class*="trx_addons_column-"]:nth-child(3n) .sc_icons_item .sc_icons_item_title a:hover { color: var(--theme-color-alter_dark); } .sc_icons_item:nth-child(3n) .sc_icons_item .sc_icons_item_description, .slider-slide:nth-child(3n) .sc_icons_item .sc_icons_item_description, [class*="trx_addons_column-"]:nth-child(3n) .sc_icons_item .sc_icons_item_description { color: var(--theme-color-alter_text); } .sc_icons_item:nth-child(3n) .sc_icons_item .sc_icons_item_more_link, .slider-slide:nth-child(3n) .sc_icons_item .sc_icons_item_more_link, [class*="trx_addons_column-"]:nth-child(3n) .sc_icons_item .sc_icons_item_more_link { color: var(--theme-color-alter_dark); } &.color_style_link2 .sc_icons_item { background-color: var(--theme-color-alter_link2); } &.color_style_link2 .sc_icons_item:nth-child(3n) .sc_icons_icon, &.color_style_link2 .slider-slide:nth-child(3n) .sc_icons_item .sc_icons_icon, &.color_style_link2 [class*="trx_addons_column-"]:nth-child(3n) .sc_icons_item .sc_icons_icon { color: var(--theme-color-alter_link2); } &.color_style_link2 .sc_icons_item:hover .sc_icons_item_title, &.color_style_link2 .sc_icons_item:hover .sc_icons_item_title a, &.color_style_link2 .sc_icons_item .sc_icons_item_title a:hover { color: var(--theme-color-inverse_link); } &.color_style_link3 .sc_icons_item { background-color: var(--theme-color-alter_link3); } &.color_style_link3 .sc_icons_item:nth-child(3n) .sc_icons_icon, &.color_style_link3 .slider-slide:nth-child(3n) .sc_icons_item .sc_icons_icon, &.color_style_link3 [class*="trx_addons_column-"]:nth-child(3n) .sc_icons_item .sc_icons_icon { color: var(--theme-color-alter_link3); } &.color_style_link3 .sc_icons_item:hover .sc_icons_item_title, &.color_style_link3 .sc_icons_item:hover .sc_icons_item_title a, &.color_style_link3 .sc_icons_item .sc_icons_item_title a:hover { color: var(--theme-color-inverse_link); } &.color_style_dark .sc_icons_item { background-color: var(--theme-color-alter_dark); } &.color_style_dark .sc_icons_item .sc_icons_icon { color: var(--theme-color-inverse_hover); } &.color_style_dark .sc_icons_item .sc_icons_item_title, &.color_style_dark .sc_icons_item .sc_icons_item_title a { color: var(--theme-color-inverse_hover); } &.color_style_dark .sc_icons_item:hover .sc_icons_item_title, &.color_style_dark .sc_icons_item:hover .sc_icons_item_title a, &.color_style_dark .sc_icons_item .sc_icons_item_title a:hover { color: var(--theme-color-inverse_hover); } &.color_style_dark .sc_icons_item .sc_icons_item_description { color: var(--theme-color-inverse_hover_08); } &.color_style_dark .sc_icons_item .sc_icons_item_more_link { color: var(--theme-color-inverse_hover); } &.color_style_dark .sc_icons_item:nth-child(3n), &.color_style_dark .slider-slide:nth-child(3n) .sc_icons_item, &.color_style_dark [class*="trx_addons_column-"]:nth-child(3n) .sc_icons_item { background-color: var(--theme-color-alter_dark); } &.color_style_dark .sc_icons_item:nth-child(3n) .sc_icons_icon, &.color_style_dark .slider-slide:nth-child(3n) .sc_icons_item .sc_icons_icon, &.color_style_dark [class*="trx_addons_column-"]:nth-child(3n) .sc_icons_item .sc_icons_icon { color: var(--theme-color-inverse_hover); } &.color_style_dark .sc_icons_item:nth-child(3n) .sc_icons_item .sc_icons_item_title, &.color_style_dark .sc_icons_item:nth-child(3n) .sc_icons_item .sc_icons_item_title a, &.color_style_dark .slider-slide:nth-child(3n) .sc_icons_item .sc_icons_item_title, &.color_style_dark .slider-slide:nth-child(3n) .sc_icons_item .sc_icons_item_title a, &.color_style_dark [class*="trx_addons_column-"]:nth-child(3n) .sc_icons_item .sc_icons_item_title, &.color_style_dark [class*="trx_addons_column-"]:nth-child(3n) .sc_icons_item .sc_icons_item_title a { color: var(--theme-color-inverse_hover); } &.color_style_dark .sc_icons_item:nth-child(3n) .sc_icons_item .sc_icons_item_description, &.color_style_dark .slider-slide:nth-child(3n) .sc_icons_item .sc_icons_item_description, &.color_style_dark [class*="trx_addons_column-"]:nth-child(3n) .sc_icons_item .sc_icons_item_description { color: var(--theme-color-inverse_hover_08); } &.color_style_dark .sc_icons_item:nth-child(3n) .sc_icons_item .sc_icons_item_more_link, &.color_style_dark .slider-slide:nth-child(3n) .sc_icons_item .sc_icons_item_more_link, &.color_style_dark [class*="trx_addons_column-"]:nth-child(3n) .sc_icons_item .sc_icons_item_more_link { color: var(--theme-color-inverse_hover); } } /* Style 'Decoration' */ .sc_icons_decoration { .sc_icons_item { padding: 3.2em 2em 1.2em; background-color: var(--theme-color-alter_bg_color); @include transition(box-shadow .3s ease-out); } .sc_icons_item:hover { @include box-shadow(0 3px 30px rgba(0,0,0,.05)); } .sc_icons_item_title { @include font(1.333em, 1.2em); } .sc_icons_item_title, .sc_icons_item_title a { color: var(--theme-color-alter_dark); } .sc_icons_item_title + .sc_icons_item_description { margin-top: 0.3em; } .sc_icons_item:hover .sc_icons_item_title a, .sc_icons_item .sc_icons_item_title a:hover { color: var(--theme-color-alter_dark); } .sc_icons_item.sc_icons_item_linked.with_more .sc_icons_item_link { z-index: 10; } .sc_icons_item .sc_icons_item_more_link { color: var(--theme-color-alter_dark); } .sc_icons_item .sc_icons_item_more_link .link_text { display: none; } .sc_icons_item .sc_icons_item_more_link .link_icon { @include box(2.1em, 1.9em, 1.9em); } .sc_icons_item .sc_icons_item_more_link .link_icon:before { font-family: $theme_icons; content: '\E8CA'; @include font(28px, '', 400); color: var(--theme-color-alter_dark_02); @include transition(color .3s ease-out); } .sc_icons_item:hover .sc_icons_item_more_link .link_icon:before, .sc_icons_item .sc_icons_item_more_link:hover .link_icon:before { color: var(--theme-color-alter_link); } .sc_icons_icon + .sc_icons_item_details, .sc_icons_image + .sc_icons_item_details { margin-top: 1.5em; } .sc_icons_item .sc_icons_item_title + .sc_icons_item_more_link, .sc_icons_item .sc_icons_item_description + .sc_icons_item_more_link { margin-top: 1em; } .sc_icons_icon:before, .sc_icons_icon > span:before { font-size: 3.8em; } .sc_icon_type_svg svg, .sc_icon_type_svg object { @include box(3.8em, 3.8em); } &.sc_icons_size_small .sc_icons_icon:before, &.sc_icons_size_small .sc_icons_icon > span:before { font-size: 2.8em; } &.sc_icons_size_small .sc_icon_type_svg svg, &.sc_icons_size_small .sc_icon_type_svg object { @include box(2.8em, 2.8em); } &.sc_icons_size_large .sc_icons_icon:before, &.sc_icons_size_large .sc_icons_icon > span:before { font-size: 4.8em; } &.sc_icons_size_large .sc_icon_type_svg svg, &.sc_icons_size_large .sc_icon_type_svg object { @include box(4.8em, 4.8em); } &.color_style_link2 .sc_icons_item:hover .sc_icons_item_more_link .link_icon:before, &.color_style_link2 .sc_icons_item .sc_icons_item_more_link:hover .link_icon:before { color: var(--theme-color-alter_link2); } &.color_style_link3 .sc_icons_item:hover .sc_icons_item_more_link .link_icon:before, &.color_style_link3 .sc_icons_item .sc_icons_item_more_link:hover .link_icon:before { color: var(--theme-color-alter_link3); } &.color_style_dark .sc_icons_item:hover .sc_icons_item_more_link .link_icon:before, &.color_style_dark .sc_icons_item .sc_icons_item_more_link:hover .link_icon:before { color: var(--theme-color-alter_dark); } } /* Style 'Figure' */ .sc_icons_figure { .sc_icons_item { padding: 3.2em 2em 2em; @include transition(box-shadow .3s ease-out); } .sc_icons_item:hover { @include box-shadow(0 7px 30px rgba(0,0,0,.05)); } .sc_icons_icon { position: relative; } .sc_icons_icon:after { content: ''; display: block; @include box(74px, 74px); @include border-radius(50%); @include abs-rt(-40%, -20%, 0); background-color: var(--theme-color-text_dark); opacity: .03; @include transition(opacity .3s ease-out); } .sc_icons_icon.sc_icons_char:after { @include abs-cc(0); } .sc_icons_item:hover .sc_icons_image:after, .sc_icons_item:hover .sc_icons_icon:after { opacity: .04; } .sc_icons_item_title { @include font(1.333em, 1.2em); } .sc_icons_item_title, .sc_icons_item_title a { color: var(--theme-color-text_dark); } .sc_icons_item_title + .sc_icons_item_description { margin-top: 0.3em; } .sc_icons_item:hover .sc_icons_item_title a, .sc_icons_item .sc_icons_item_title a:hover { color: var(--theme-color-text_dark); } .sc_icons_item.sc_icons_item_linked.with_more .sc_icons_item_link { z-index: 10; } .sc_icons_item .sc_icons_item_more_link { color: var(--theme-color-text_dark); } .sc_icons_item:hover .sc_icons_item_more_link, .sc_icons_item .sc_icons_item_more_link:hover { color: var(--theme-color-text_link); } .sc_icons_item .sc_icons_item_more_link .link_text { display: none; } .sc_icons_icon + .sc_icons_item_details, .sc_icons_image + .sc_icons_item_details { margin-top: 1.8em; } &.color_style_link2 .sc_icons_item:hover .sc_icons_item_more_link, &.color_style_link2 .sc_icons_item .sc_icons_item_more_link:hover { color: var(--theme-color-text_link2); } &.color_style_link3 .sc_icons_item:hover .sc_icons_item_more_link, &.color_style_link3 .sc_icons_item .sc_icons_item_more_link:hover { color: var(--theme-color-text_link3); } &.color_style_dark .sc_icons_item:hover .sc_icons_item_more_link, &.color_style_dark .sc_icons_item .sc_icons_item_more_link:hover { color: var(--theme-color-text_dark); } } /* Style 'Number' */ .sc_icons_number { .sc_icons_item_number { @include font(8em, 1em, 600); @include abs-lt(-10px, -0.35em); color: var(--theme-color-text_dark); opacity: .03; @include transition(opacity .3s ease-out); } .sc_icons_item { min-height: 6em; line-height: 1; margin-top: 0.5em; @include flex; @include flex-direction(column); @include flex-align-items(flex-start); @include flex-justify-content(flex-start); } .sc_icons_item:hover .sc_icons_item_number { opacity: .04; } .sc_icons_item_header { width: 100%; min-height: 3.4em; position: relative; z-index: 1; @include flex; @include flex-justify-content(flex-start); @include flex-align-items(center); } .sc_icons_item_details { width: 100%; } .sc_icons_item_linked .sc_icons_icon + .sc_icons_item_title, .sc_icons_item_linked .sc_icons_image + .sc_icons_item_title, .sc_icons_item_linked .sc_icons_icon + .sc_icons_item_description, .sc_icons_item_linked .sc_icons_icon + .sc_icons_item_title + .sc_icons_item_description, .sc_icons_item_linked .sc_icons_image + .sc_icons_item_description, .sc_icons_item_linked .sc_icons_image + .sc_icons_item_title + .sc_icons_item_description, .sc_icons_item_linked .sc_icons_image img { @include transition(all .3s ease); } .sc_icons_item_linked:hover .sc_icons_icon + .sc_icons_item_title, .sc_icons_item_linked:hover .sc_icons_image + .sc_icons_item_title, .sc_icons_item_linked:hover .sc_icons_icon + .sc_icons_item_description, .sc_icons_item_linked:hover .sc_icons_icon + .sc_icons_item_title + .sc_icons_item_description, .sc_icons_item_linked:hover .sc_icons_image + .sc_icons_item_description, .sc_icons_item_linked:hover .sc_icons_image + .sc_icons_item_title + .sc_icons_item_description { @include transform(none); } .sc_icons_item_linked .sc_icons_icon + .sc_icons_item_title, .sc_icons_item_linked .sc_icons_image + .sc_icons_item_title { @include transform-origin(initial); } .sc_icons_item_header + .sc_icons_item_details { margin-top: 0.5em; } .sc_icons_image + .sc_icons_item_title, .sc_icons_icon + .sc_icons_item_title { margin-left: 0.8em; } .sc_icons_image img { max-width: 100px; } .sc_icons_item .sc_icons_item_description + .sc_icons_item_more_link { margin-top: 1.6em; } .sc_icons_item .sc_icons_item_more_link .link_icon { border: 1px solid var(--theme-color-bd_color); @include box(2.3em, 2.3em, 2.2em); @include border-box; @include border-radius(50%); } .sc_icons_item .sc_icons_item_more_link .link_icon:before { font-size: 9px; } .sc_icons_item:hover .sc_icons_item_more_link .link_text, .sc_icons_item .sc_icons_item_more_link:hover .link_text { margin-right: 10px; } .sc_icons_icon:before, .sc_icons_icon > span:before { font-size: 4.4em; } .sc_icon_type_svg svg, .sc_icon_type_svg object { @include box(4.4em, 4.4em); } &.sc_icons_size_small .sc_icons_icon:before, &.sc_icons_size_small .sc_icons_icon > span:before { font-size: 3.4em; } &.sc_icons_size_small .sc_icon_type_svg svg, &.sc_icons_size_small .sc_icon_type_svg object { @include box(3.4em, 3.4em); } &.sc_icons_size_large .sc_icons_icon:before, &.sc_icons_size_large .sc_icons_icon > span:before { font-size: 5.4em; } &.sc_icons_size_large .sc_icon_type_svg svg, &.sc_icons_size_large .sc_icon_type_svg object { @include box(5.4em, 5.4em); } &.sc_align_center .sc_icons_item { @include flex-align-items(center); } &.sc_align_center .sc_icons_item_header { @include flex-justify-content(center); } &.sc_align_center .sc_icons_item_number { @include abs-ct(-0.35em); } &.sc_align_right .sc_icons_item { @include flex-align-items(flex-end); } &.sc_align_right .sc_icons_item_header { @include flex-justify-content(flex-end); } &.sc_align_right .sc_icons_item_number { @include abs-rt(0, -0.35em); } /* add special hover */ .extra_hover & .sc_icons_item:hover .sc_icons_item_title a, .extra_hover & .sc_icons_item .sc_icons_item_title a:hover { color: var(--theme-color-text_link2) !important; } } /* Style 'Rounded' */ .sc_icons_rounded { .sc_icons_item_title { @include font(1.333em, 1.2em); } .sc_icons_icon, .sc_icons_image { position: relative; top: auto; left: auto; display: inline-block; @include square(7em); @include border-radius(50%); background-color: var(--theme-color-alter_bg_color); @include box-shadow(0 6px 30px rgba(0,0,0,.03)); @include transition(transform .3s ease-out, box-shadow .3s ease, color .3s ease, background-color .3s ease); @include transform(none); } .sc_icons_item:hover .sc_icons_icon, .sc_icons_item:hover .sc_icons_image { @include transform(translate3d(0, -8px, 0)); @include box-shadow(0 6px 30px rgba(0,0,0,.04)); } .sc_icons_item_linked:hover .sc_icons_icon { @include box-shadow(0 6px 30px rgba(0,0,0,.04)); } .sc_icons_image img { max-width: 60%; vertical-align: middle; } .sc_icons_icon > span { display: inline-block; @include abs-lt; @include square(7em); } .sc_icons_icon:before, .sc_icons_icon > span:before { font-size: 3.4em; line-height: inherit !important; } .sc_icon_type_svg svg, .sc_icon_type_svg object { @include box(3.4em, 3.4em); margin: -0.25em 0 0 0; } .sc_icons_item_title + .sc_icons_item_description { margin-top: 0.8em; } .sc_icons_icon + .sc_icons_item_details, .sc_icons_image + .sc_icons_item_details { margin-top: 1.8em; } .sc_icons_item_title + .sc_icons_item_more_link, .sc_icons_item_description + .sc_icons_item_more_link { margin-top: 1.5em; } &.sc_icons_size_small .sc_icons_icon, &.sc_icons_size_small .sc_icons_image { @include square(6em); } &.sc_icons_size_small .sc_icons_icon > span { @include square(6em); } &.sc_icons_size_small .sc_icons_icon:before, &.sc_icons_size_small .sc_icons_icon > span:before { font-size: 2.4em; line-height: inherit !important; } &.sc_icons_size_small .sc_icon_type_svg svg, &.sc_icons_size_small .sc_icon_type_svg object { @include box(2.4em, 2.4em); } &.sc_icons_size_large .sc_icons_icon, &.sc_icons_size_large .sc_icons_image { @include square(8em); } &.sc_icons_size_large .sc_icons_icon > span { @include square(8em); } &.sc_icons_size_large .sc_icons_icon:before, &.sc_icons_size_large .sc_icons_icon > span:before { font-size: 4.4em; line-height: inherit !important; } &.sc_icons_size_large .sc_icon_type_svg svg, &.sc_icons_size_large .sc_icon_type_svg object { @include box(4.4em, 4.4em); } .sc_icons_icon { color: var(--theme-color-alter_link); background-color: var(--theme-color-alter_bg_hover); } &.color_style_link2 .sc_icons_icon { color: var(--theme-color-alter_link2); } &.color_style_link3 .sc_icons_icon { color: var(--theme-color-alter_link3); } &.color_style_dark .sc_icons_icon { color: var(--theme-color-alter_dark); } } /* Style 'Common' */ .sc_icons_common { .sc_icons_item .sc_icons_image, .sc_icons_item .sc_icons_icon { @include transform(translateY(0)); @include transition(transform .3s ease-out, color .3s ease); will-change: transform, color; } .sc_icons_item:hover .sc_icons_image, .sc_icons_item:hover .sc_icons_icon { @include transform(translateY(-8px)); } .sc_icons_icon + .sc_icons_item_details, .sc_icons_image + .sc_icons_item_details { margin-top: 2em; } .sc_icons_image img { max-width: 100%; } .sc_icons_item_linked:hover .sc_icons_image img { @include transform(none); } &.color_style_link2 .sc_icons_item_description ul > li:before { color: var(--theme-color-text_link2); } &.color_style_link3 .sc_icons_item_description ul > li:before { color: var(--theme-color-text_link3); } &.color_style_dark .sc_icons_item_description ul > li:before { color: var(--theme-color-text_dark); } } /* Style 'Divider' */ .sc_icons_divider { .slider-wrapper .sc_icons_item, .sc_icons_columns_wrap .sc_icons_item { position: relative; padding: 15px 20px 15px 0; } .slider-wrapper .sc_icons_item:after, .sc_icons_columns_wrap .sc_icons_item:after { content: ''; display: block; height: 100%; width: 1px; position: absolute; right: 0; top: 50%; @include transform(translateY(-50%)); background-color: var(--theme-color-bd_color); } .slider-wrapper { .sc_icons_item:after { right: -1px; } .swiper-slide-prev { .sc_icons_item:after { right: 0; } } } &.sc_align_center .slider-wrapper .sc_icons_item, &.sc_align_center .sc_icons_columns_wrap .sc_icons_item { padding: 15px 20px; } &.sc_align_center .sc_icons_columns_wrap .sc_icons_item:after { right: -25px; } &.sc_align_right .slider-wrapper .sc_icons_item, &.sc_align_right .sc_icons_columns_wrap .sc_icons_item { padding: 15px 0 15px 20px; } &.sc_align_right .sc_icons_columns_wrap .sc_icons_item:after { right: -50px; } .sc_icons_columns_wrap.trx_addons_columns_wrap { margin-right: -50px; margin-bottom: -50px; } .sc_icons_columns_wrap.trx_addons_columns_wrap > [class*="trx_addons_column-"] { padding-right: 50px; } .sc_icons_columns_wrap.trx_addons_columns_wrap.columns_padding_bottom > [class*="trx_addons_column-"], .sc_icons_columns_wrap.trx_addons_columns_wrap > [class*="trx_addons_column-"].columns_padding_bottom { padding-bottom: 50px; } .sc_icons_columns_wrap.trx_addons_columns_wrap.columns_padding_bottom.columns_in_single_row { margin-bottom: 0; } .sc_icons_columns_wrap.trx_addons_columns_wrap.columns_padding_bottom.columns_in_single_row > [class*="trx_addons_column-"] { padding-bottom: 0; } .sc_icons_columns_wrap [class*="trx_addons_column-"]:last-child .sc_icons_item:after { display: none; } .sc_icons_columns_wrap .trx_addons_column-1_2:nth-child(2n) .sc_icons_item:after, .sc_icons_columns_wrap .trx_addons_column-1_3:nth-child(3n) .sc_icons_item:after, .sc_icons_columns_wrap .trx_addons_column-1_4:nth-child(4n) .sc_icons_item:after, .sc_icons_columns_wrap .trx_addons_column-1_5:nth-child(5n) .sc_icons_item:after, .sc_icons_columns_wrap .trx_addons_column-1_6:nth-child(6n) .sc_icons_item:after, .sc_icons_columns_wrap .trx_addons_column-1_7:nth-child(7n) .sc_icons_item:after, .sc_icons_columns_wrap .trx_addons_column-1_8:nth-child(8n) .sc_icons_item:after, .sc_icons_columns_wrap .trx_addons_column-1_9:nth-child(9n) .sc_icons_item:after, .sc_icons_columns_wrap .trx_addons_column-1_10:nth-child(10n) .sc_icons_item:after, .sc_icons_columns_wrap .trx_addons_column-1_11:nth-child(11n) .sc_icons_item:after, .sc_icons_columns_wrap .trx_addons_column-1_12:nth-child(12n) .sc_icons_item:after { display: none; } .sc_icons_item_title { @include font(1.333em, 1.2em); } .sc_icons_icon + .sc_icons_item_details, .sc_icons_image + .sc_icons_item_details { margin-top: 2.35em; } .sc_icons_item .sc_icons_item_title + .sc_icons_item_more_link, .sc_icons_item .sc_icons_item_description + .sc_icons_item_more_link { margin-top: 3.4em; } .sc_icons_icon:before, .sc_icons_icon > span:before { font-size: 4.4em; } .sc_icon_type_svg svg, .sc_icon_type_svg object { @include box(4.4em, 4.4em); } &.sc_icons_size_small .sc_icons_icon:before, &.sc_icons_size_small .sc_icons_icon > span:before { font-size: 3.4em; } &.sc_icons_size_small .sc_icon_type_svg svg, &.sc_icons_size_small .sc_icon_type_svg object { @include box(3.4em, 3.4em); } &.sc_icons_size_large .sc_icons_icon:before, &.sc_icons_size_large .sc_icons_icon > span:before { font-size: 4.8em; } &.sc_icons_size_large .sc_icon_type_svg svg, &.sc_icons_size_large .sc_icon_type_svg object { @include box(4.8em, 4.8em); } } /* Style 'Divider 2' */ .sc_icons_divider2 { padding: 4.4em 0; background-color: var(--theme-color-alter_bg_color); @include box-shadow(0 3px 60px rgba(0,0,0,.04)); @include border-box; .slider-wrapper .sc_icons_item, .sc_icons_columns_wrap .sc_icons_item { position: relative; padding: 0 2em; } .slider-wrapper .sc_icons_item:after, .sc_icons_columns_wrap .sc_icons_item:after { content: ''; display: block; height: 96%; width: 1px; position: absolute; right: 0; top: 50%; @include transform(translateY(-50%)); background-color: var(--theme-color-alter_bd_color); } .slider-wrapper { .sc_icons_item:after { right: -1px; } .swiper-slide-prev { .sc_icons_item:after { right: 0; } } } &.sc_align_center .sc_icons_columns_wrap .sc_icons_item:after { right: -25px; } &.sc_align_right .sc_icons_columns_wrap .sc_icons_item:after { right: -50px; } .sc_icons_columns_wrap.trx_addons_columns_wrap { margin-right: -50px; margin-bottom: -50px; } .sc_icons_columns_wrap.trx_addons_columns_wrap > [class*="trx_addons_column-"] { padding-right: 50px; } .sc_icons_columns_wrap.trx_addons_columns_wrap.columns_padding_bottom > [class*="trx_addons_column-"], .sc_icons_columns_wrap.trx_addons_columns_wrap > [class*="trx_addons_column-"].columns_padding_bottom { padding-bottom: 50px; } .sc_icons_columns_wrap.trx_addons_columns_wrap.columns_padding_bottom.columns_in_single_row { margin-bottom: 0; } .sc_icons_columns_wrap.trx_addons_columns_wrap.columns_padding_bottom.columns_in_single_row > [class*="trx_addons_column-"] { padding-bottom: 0; } .sc_icons_columns_wrap [class*="trx_addons_column-"]:last-child .sc_icons_item:after { display: none; } .sc_icons_columns_wrap .trx_addons_column-1_2:nth-child(2n) .sc_icons_item:after, .sc_icons_columns_wrap .trx_addons_column-1_3:nth-child(3n) .sc_icons_item:after, .sc_icons_columns_wrap .trx_addons_column-1_4:nth-child(4n) .sc_icons_item:after, .sc_icons_columns_wrap .trx_addons_column-1_5:nth-child(5n) .sc_icons_item:after, .sc_icons_columns_wrap .trx_addons_column-1_6:nth-child(6n) .sc_icons_item:after, .sc_icons_columns_wrap .trx_addons_column-1_7:nth-child(7n) .sc_icons_item:after, .sc_icons_columns_wrap .trx_addons_column-1_8:nth-child(8n) .sc_icons_item:after, .sc_icons_columns_wrap .trx_addons_column-1_9:nth-child(9n) .sc_icons_item:after, .sc_icons_columns_wrap .trx_addons_column-1_10:nth-child(10n) .sc_icons_item:after, .sc_icons_columns_wrap .trx_addons_column-1_11:nth-child(11n) .sc_icons_item:after, .sc_icons_columns_wrap .trx_addons_column-1_12:nth-child(12n) .sc_icons_item:after { display: none; } .sc_icons_item_title { @include font(1.556em, 1.2em); } .sc_icons_item_title + .sc_icons_item_description { margin-top: 0.8em; } .sc_icons_icon + .sc_icons_item_details, .sc_icons_image + .sc_icons_item_details { margin-top: 1.8em; } .sc_icons_item .sc_icons_item_title + .sc_icons_item_more_link, .sc_icons_item .sc_icons_item_description + .sc_icons_item_more_link { margin-top: 2em; } .sc_icons_icon:before, .sc_icons_icon > span:before { font-size: 4.7em; } .sc_icon_type_svg svg, .sc_icon_type_svg object { @include box(4.7em, 4.7em); } &.sc_icons_size_small .sc_icons_icon:before, &.sc_icons_size_small .sc_icons_icon > span:before { font-size: 3.7em; } &.sc_icons_size_small .sc_icon_type_svg svg, &.sc_icons_size_small .sc_icon_type_svg object { @include box(3.7em, 3.7em); } &.sc_icons_size_large .sc_icons_icon:before, &.sc_icons_size_large .sc_icons_icon > span:before { font-size: 5.7em; } &.sc_icons_size_large .sc_icon_type_svg svg, &.sc_icons_size_large .sc_icon_type_svg object { @include box(5.7em, 5.7em); } } /* Style 'Divider 3' */ .sc_icons_divider3 { .sc_icons_item_wrap + .sc_icons_item_wrap { margin-top: var(--theme-var-grid_gap); } .slider-wrapper .sc_icons_item_wrap, .sc_icons_columns_wrap .sc_icons_item_wrap { position: relative; padding: 0 2.2em; @include border-box; } .slider-wrapper .sc_icons_item_wrap:after, .sc_icons_columns_wrap .sc_icons_item_wrap:after { content: ''; display: block; height: 150px; width: 1px; position: absolute; right: -25px; top: 50%; @include transform(translateY(-50%)); background-color: var(--theme-color-bd_color); } .slider-wrapper { .sc_icons_item_wrap:after { right: -1px; } .swiper-slide-prev { .sc_icons_item_wrap:after { right: 0; } } } .sc_icons_item { position: relative; padding: 3.8em 2em 3em; background-color: transparent; will-change: background-color; @include transition(background-color .3s ease); } .sc_icons_item:hover { background-color: var(--theme-color-text_link); } .sc_icons_columns_wrap.trx_addons_columns_wrap { margin-right: -50px; margin-bottom: -50px; } .sc_icons_columns_wrap.trx_addons_columns_wrap > [class*="trx_addons_column-"] { padding-right: 50px; } .sc_icons_columns_wrap.trx_addons_columns_wrap.columns_padding_bottom > [class*="trx_addons_column-"], .sc_icons_columns_wrap.trx_addons_columns_wrap > [class*="trx_addons_column-"].columns_padding_bottom { padding-bottom: 50px; } .sc_icons_columns_wrap.trx_addons_columns_wrap.columns_padding_bottom.columns_in_single_row { margin-bottom: 0; } .sc_icons_columns_wrap.trx_addons_columns_wrap.columns_padding_bottom.columns_in_single_row > [class*="trx_addons_column-"] { padding-bottom: 0; } .sc_icons_columns_wrap [class*="trx_addons_column-"]:last-child .sc_icons_item_wrap:after { display: none; } .sc_icons_columns_wrap .trx_addons_column-1_2:nth-child(2n) .sc_icons_item_wrap:after, .sc_icons_columns_wrap .trx_addons_column-1_3:nth-child(3n) .sc_icons_item_wrap:after, .sc_icons_columns_wrap .trx_addons_column-1_4:nth-child(4n) .sc_icons_item_wrap:after, .sc_icons_columns_wrap .trx_addons_column-1_5:nth-child(5n) .sc_icons_item_wrap:after, .sc_icons_columns_wrap .trx_addons_column-1_6:nth-child(6n) .sc_icons_item_wrap:after, .sc_icons_columns_wrap .trx_addons_column-1_7:nth-child(7n) .sc_icons_item_wrap:after, .sc_icons_columns_wrap .trx_addons_column-1_8:nth-child(8n) .sc_icons_item_wrap:after, .sc_icons_columns_wrap .trx_addons_column-1_9:nth-child(9n) .sc_icons_item_wrap:after, .sc_icons_columns_wrap .trx_addons_column-1_10:nth-child(10n) .sc_icons_item_wrap:after, .sc_icons_columns_wrap .trx_addons_column-1_11:nth-child(11n) .sc_icons_item_wrap:after, .sc_icons_columns_wrap .trx_addons_column-1_12:nth-child(12n) .sc_icons_item_wrap:after { display: none; } .sc_icons_item.sc_icons_item_linked.with_more .sc_icons_item_link { z-index: 10; } .sc_icons_item_title { @include font(1.333em, 1.2em); } .sc_icons_item .sc_icons_item_title, .sc_icons_item .sc_icons_item_title span { @include transition(color .3s ease); } .sc_icons_item:hover .sc_icons_item_title, .sc_icons_item:hover .sc_icons_item_title span, .sc_icons_item:hover .sc_icons_item_title a, .sc_icons_item .sc_icons_item_title a:hover { color: var(--theme-color-inverse_link); } .sc_icons_icon + .sc_icons_item_details, .sc_icons_image + .sc_icons_item_details { margin-top: 1.5em; } .sc_icons_item .sc_icons_item_description { @include transition(color .3s ease); } .sc_icons_item:hover .sc_icons_item_description { color: var(--theme-color-inverse_link); } .sc_icons_item_title + .sc_icons_item_description { margin-top: 0.7em; } .sc_icons_item:hover .sc_icons_item_more_link { color: var(--theme-color-inverse_link); } .sc_icons_item .sc_icons_item_title + .sc_icons_item_more_link, .sc_icons_item .sc_icons_item_description + .sc_icons_item_more_link { margin-top: 2em; } .sc_icons_item:hover .sc_icons_icon { color: var(--theme-color-inverse_link); } .sc_icons_icon:before, .sc_icons_icon > span:before { font-size: 3.8em; } .sc_icon_type_svg svg, .sc_icon_type_svg object { @include box(3.8em, 3.8em); } &.sc_icons_size_small .sc_icons_icon:before, &.sc_icons_size_small .sc_icons_icon > span:before { font-size: 2.8em; } &.sc_icons_size_small .sc_icon_type_svg svg, &.sc_icons_size_small .sc_icon_type_svg object { @include box(2.8em, 2.8em); } &.sc_icons_size_large .sc_icons_icon:before, &.sc_icons_size_large .sc_icons_icon > span:before { font-size: 4.8em; } &.sc_icons_size_large .sc_icon_type_svg svg, &.sc_icons_size_large .sc_icon_type_svg object { @include box(4.8em, 4.8em); } &.color_style_link2 .sc_icons_item:hover { background-color: var(--theme-color-text_link2); } &.color_style_link2 .sc_icons_item:hover .sc_icons_item_title, &.color_style_link2 .sc_icons_item:hover .sc_icons_item_title span, &.color_style_link2 .sc_icons_item:hover .sc_icons_item_title a, &.color_style_link2 .sc_icons_item .sc_icons_item_title a:hover { color: var(--theme-color-inverse_link); } &.color_style_link3 .sc_icons_item:hover { background-color: var(--theme-color-text_link3); } &.color_style_link3 .sc_icons_item:hover .sc_icons_item_title, &.color_style_link3 .sc_icons_item:hover .sc_icons_item_title span, &.color_style_link3 .sc_icons_item:hover .sc_icons_item_title a, &.color_style_link3 .sc_icons_item .sc_icons_item_title a:hover { color: var(--theme-color-inverse_link); } &.color_style_dark .sc_icons_item:hover { background-color: var(--theme-color-text_dark); } &.color_style_dark .sc_icons_item:hover .sc_icons_item_title, &.color_style_dark .sc_icons_item:hover .sc_icons_item_title span, &.color_style_dark .sc_icons_item:hover .sc_icons_item_title a, &.color_style_dark .sc_icons_item .sc_icons_item_title a:hover { color: var(--theme-color-inverse_hover); } &.color_style_dark .sc_icons_item:hover .sc_icons_item_more_link { color: var(--theme-color-inverse_hover); } &.color_style_dark .sc_icons_item:hover .sc_icons_item_description { color: var(--theme-color-inverse_hover); } &.color_style_dark .sc_icons_item:hover .sc_icons_icon { color: var(--theme-color-inverse_hover); } } /* Style 'Divider 4' */ .sc_icons_divider4 { .slider-wrapper .sc_icons_item:after, .sc_icons_columns_wrap .sc_icons_item:after { content: ''; display: block; height: 100%; width: 1px; position: absolute; right: 0; top: 50%; @include transform(translateY(-50%)); background-color: var(--theme-color-bd_color); } .slider-wrapper { .sc_icons_item:after { right: -1px; } .swiper-slide-prev { .sc_icons_item:after { right: 0; } } } &.sc_align_center .sc_icons_columns_wrap .sc_icons_item:after { right: calc( -1 * var(--theme-var-grid_gap) ); } &.sc_align_right .sc_icons_columns_wrap .sc_icons_item:after { right: calc( -1 * var(--theme-var-grid_gap) ); } .sc_icons_columns_wrap.trx_addons_columns_wrap { margin-right: calc( -2 * var(--theme-var-grid_gap) ); margin-bottom: calc( -2 * var(--theme-var-grid_gap) ); } .sc_icons_columns_wrap.trx_addons_columns_wrap > [class*="trx_addons_column-"] { padding-right: calc( 2 * var(--theme-var-grid_gap) ); } .sc_icons_columns_wrap.trx_addons_columns_wrap.columns_padding_bottom > [class*="trx_addons_column-"], .sc_icons_columns_wrap.trx_addons_columns_wrap > [class*="trx_addons_column-"].columns_padding_bottom { padding-bottom: calc( 2 * var(--theme-var-grid_gap) ); } .sc_icons_columns_wrap.trx_addons_columns_wrap.columns_padding_bottom.columns_in_single_row { margin-bottom: 0; } .sc_icons_columns_wrap.trx_addons_columns_wrap.columns_padding_bottom.columns_in_single_row > [class*="trx_addons_column-"] { padding-bottom: 0; } .sc_icons_columns_wrap [class*="trx_addons_column-"]:last-child .sc_icons_item:after { display: none; } .sc_icons_columns_wrap .trx_addons_column-1_2:nth-child(2n) .sc_icons_item:after, .sc_icons_columns_wrap .trx_addons_column-1_3:nth-child(3n) .sc_icons_item:after, .sc_icons_columns_wrap .trx_addons_column-1_4:nth-child(4n) .sc_icons_item:after, .sc_icons_columns_wrap .trx_addons_column-1_5:nth-child(5n) .sc_icons_item:after, .sc_icons_columns_wrap .trx_addons_column-1_6:nth-child(6n) .sc_icons_item:after, .sc_icons_columns_wrap .trx_addons_column-1_7:nth-child(7n) .sc_icons_item:after, .sc_icons_columns_wrap .trx_addons_column-1_8:nth-child(8n) .sc_icons_item:after, .sc_icons_columns_wrap .trx_addons_column-1_9:nth-child(9n) .sc_icons_item:after, .sc_icons_columns_wrap .trx_addons_column-1_10:nth-child(10n) .sc_icons_item:after, .sc_icons_columns_wrap .trx_addons_column-1_11:nth-child(11n) .sc_icons_item:after, .sc_icons_columns_wrap .trx_addons_column-1_12:nth-child(12n) .sc_icons_item:after { display: none; } .sc_icons_item { padding: 13px 0; @include flex; @include flex-direction(row); @include flex-justify-content(flex-start); @include flex-align-items(flex-start); } .sc_icons_icon, .sc_icons_image { @include square(3.4em); } .sc_icons_icon > span { @include square(3.4em); } .sc_icons_item .sc_icons_item_title + .sc_icons_item_more_link, .sc_icons_item .sc_icons_item_description + .sc_icons_item_more_link { margin-top: 1.2em; } .sc_icons_item_details { padding-left: 0; padding-right: 5%; min-height: auto; } &.sc_icons_size_large .sc_icons_item_details, &.sc_icons_size_small .sc_icons_item_details { padding-left: 0; min-height: auto; } &.sc_align_right .sc_icons_item_details, &.sc_icons_size_small.sc_align_right .sc_icons_item_details, &.sc_icons_size_large.sc_align_right .sc_icons_item_details { padding-left: 5%; padding-right:0; } .sc_icons_icon + .sc_icons_item_details, .sc_icons_image + .sc_icons_item_details { margin-left: 0.8em; margin-top: 0.6em; } &.sc_icons_size_large .sc_icons_icon + .sc_icons_item_details, &.sc_icons_size_large .sc_icons_image + .sc_icons_item_details { margin-left: 1.2em; margin-top: 0.8em; } .sc_icons_item_title { @include font(1.056em, 1.2em); } .sc_icons_item_details .sc_icons_item_description { @include font(15px, 1.4em); } .sc_icons_item_title + .sc_icons_item_description { margin-top: 0.5em; } &.sc_align_right .sc_icons_icon + .sc_icons_item_details, &.sc_align_right .sc_icons_image + .sc_icons_item_details { margin-left: 0; margin-right: 0.8em; } &.sc_align_center .sc_icons_item { @include flex-justify-content(center); } &.sc_align_right .sc_icons_item { @include flex-justify-content(flex-end); } &.sc_align_right .sc_icons_item .sc_icons_item_details { order: 1; } &.sc_align_right .sc_icons_item .sc_icons_icon, &.sc_align_right .sc_icons_item .sc_icons_image { order: 2; } .sc_icons_icon:before, .sc_icons_icon > span:before { font-size: 2.6em; } .sc_icon_type_svg svg, .sc_icon_type_svg object { @include box(2.6em, 2.6em); } &.sc_icons_size_small .sc_icons_icon:before, &.sc_icons_size_small .sc_icons_icon > span:before { font-size: 2em; } &.sc_icons_size_small .sc_icon_type_svg svg, &.sc_icons_size_small .sc_icon_type_svg object { @include box(2em, 2em); } &.sc_icons_size_large .sc_icons_icon:before, &.sc_icons_size_large .sc_icons_icon > span:before { font-size: 3em; } &.sc_icons_size_large .sc_icon_type_svg svg, &.sc_icons_size_large .sc_icon_type_svg object { @include box(3em, 3em); } } /* Style Fill */ .sc_icons_fill { .sc_icons_item { padding: 3.5em 3.4em; background-color: var(--theme-color-alter_link); } .sc_icons_item_title + .sc_icons_item_description { margin-top: 1em; } .sc_icons_icon + .sc_icons_item_details, .sc_icons_image + .sc_icons_item_details { margin-top: 2.7em; } .sc_icons_item .sc_icons_item_title + .sc_icons_item_more_link, .sc_icons_item .sc_icons_item_description + .sc_icons_item_more_link { margin-top: 1.85em; } .sc_icons_item .sc_icons_icon { color: var(--theme-color-inverse_link); } .sc_icons_item_linked:hover .sc_icons_icon { color: var(--theme-color-inverse_link); } .sc_icons_item .sc_icons_item_title, .sc_icons_item .sc_icons_item_title a { color: var(--theme-color-inverse_link); } .sc_icons_item:hover .sc_icons_item_title, .sc_icons_item:hover .sc_icons_item_title a, .sc_icons_item .sc_icons_item_title a:hover { color: var(--theme-color-inverse_link); } .sc_icons_item .sc_icons_item_description { @include font(19px, 1.65em); color: var(--theme-color-inverse_link_08); } .sc_icons_item .sc_icons_item_more_link { margin-top: 19px; color: var(--theme-color-inverse_link); .link_text { display: none; } .link_icon { display: inline-block; @include box(17px, 20px, 20px); overflow: hidden; position: relative; will-change: transform; @include transition(all .3s ease); &:before { display: block; font-family: $theme_icons; content: '\e9e2'; @include abs-rt(1px, 0); @include font(11px, 20px, 400); color: currentColor; } } } .sc_icons_item:hover .sc_icons_item_more_link { .link_icon { width: 38px; } } .sc_icons_item.sc_icons_item_linked.with_more .sc_icons_item_link { z-index: 10; } &.color_style_link2 .sc_icons_item { background-color: var(--theme-color-alter_link2); } &.color_style_link2 .sc_icons_item .sc_icons_icon { color: var(--theme-color-inverse_link); } &.color_style_link2 .sc_icons_item .sc_icons_item_title, &.color_style_link2 .sc_icons_item .sc_icons_item_title a { color: var(--theme-color-inverse_link); } &.color_style_link2 .sc_icons_item:hover .sc_icons_item_title, &.color_style_link2 .sc_icons_item:hover .sc_icons_item_title a, &.color_style_link2 .sc_icons_item .sc_icons_item_title a:hover { color: var(--theme-color-inverse_link); } &.color_style_link2 .sc_icons_item .sc_icons_item_description { color: var(--theme-color-inverse_link_08); } &.color_style_link2 .sc_icons_item .sc_icons_item_more_link { color: var(--theme-color-inverse_link); } &.color_style_link3 .sc_icons_item { background-color: var(--theme-color-alter_link3); } &.color_style_link3 .sc_icons_item .sc_icons_icon { color: var(--theme-color-inverse_link); } &.color_style_link3 .sc_icons_item .sc_icons_item_title, &.color_style_link3 .sc_icons_item .sc_icons_item_title a { color: var(--theme-color-inverse_link); } &.color_style_link3 .sc_icons_item:hover .sc_icons_item_title, &.color_style_link3 .sc_icons_item:hover .sc_icons_item_title a, &.color_style_link3 .sc_icons_item .sc_icons_item_title a:hover { color: var(--theme-color-inverse_link); } &.color_style_link3 .sc_icons_item .sc_icons_item_description { color: var(--theme-color-inverse_link_08); } &.color_style_link3 .sc_icons_item .sc_icons_item_more_link { color: var(--theme-color-inverse_link); } &.color_style_dark .sc_icons_item { background-color: var(--theme-color-alter_dark); } &.color_style_dark .sc_icons_item .sc_icons_icon { color: var(--theme-color-inverse_hover); } &.color_style_dark .sc_icons_item .sc_icons_item_title, &.color_style_dark .sc_icons_item .sc_icons_item_title a { color: var(--theme-color-inverse_hover); } &.color_style_dark .sc_icons_item:hover .sc_icons_item_title, &.color_style_dark .sc_icons_item:hover .sc_icons_item_title a, &.color_style_dark .sc_icons_item .sc_icons_item_title a:hover { color: var(--theme-color-inverse_hover); } &.color_style_dark .sc_icons_item .sc_icons_item_description { color: var(--theme-color-inverse_hover_08); } &.color_style_dark .sc_icons_item .sc_icons_item_more_link { color: var(--theme-color-inverse_hover); } } /* Team */ .sc_team .sc_item_posts_container > .sc_team_item + .sc_team_item { margin-top: 1.8em; } .sc_team_default .sc_team_item { color: var(--theme-color-alter_text); background-color: var(--theme-color-alter_bg_color); } .sc_team .sc_team_item_thumb .sc_team_item_title a:hover { color: var(--theme-color-alter_link); } .sc_team.color_style_link2 .sc_team_item_thumb .sc_team_item_title a:hover { color: var(--theme-color-alter_link2); } .sc_team.color_style_link3 .sc_team_item_thumb .sc_team_item_title a:hover { color: var(--theme-color-alter_link3); } .sc_team_default .sc_team_item_subtitle { color: var(--theme-color-alter_link); } .sc_team_default.color_style_link2 .sc_team_item_subtitle { color: var(--theme-color-alter_link2); } .sc_team_default.color_style_link3 .sc_team_item_subtitle { color: var(--theme-color-alter_link3); } .sc_team_default.color_style_dark .sc_team_item_subtitle { color: var(--theme-color-alter_dark); } .sc_team_default .sc_team_item_socials .social_item .social_icon, .team_member_page .team_member_socials .social_item .social_icon { color: var(--theme-color-inverse_link); background-color: var(--theme-color-alter_link); } .sc_team_default.color_style_link2 .sc_team_item_socials .social_item .social_icon { background-color: var(--theme-color-alter_link2); } .sc_team_default.color_style_link3 .sc_team_item_socials .social_item .social_icon { background-color: var(--theme-color-alter_link3); } .sc_team_default.color_style_dark .sc_team_item_socials .social_item .social_icon { background-color: var(--theme-color-alter_dark); } .sc_team_default .sc_team_item_socials .social_item:hover .social_icon, .team_member_page .team_member_socials .social_item:hover .social_icon { color: var(--theme-color-alter_bg_color); background-color: var(--theme-color-alter_dark); } .sc_team_default.color_style_link2 .sc_team_item_socials .social_item:hover .social_icon { background-color: var(--theme-color-alter_hover2); } .sc_team_default.color_style_link3 .sc_team_item_socials .social_item:hover .social_icon { background-color: var(--theme-color-alter_hover3); } .sc_team_default.color_style_dark .sc_team_item_socials .social_item:hover .social_icon { background-color: var(--theme-color-alter_link); } .sc_team.slider_container .swiper-pagination-bullet { border-color: var(--theme-color-text_light); } .team_member_projects { border-color: var(--theme-color-bd_color); } /* Single Teams */ .team_member_page { > .team_member_content, > .team_member_featured { margin-bottom: 1.2em; } &:after { content: ""; display: block; @include clear(); margin-bottom: -1.2em; } .team_member_description { overflow: visible; margin: 0 0 2.8em 0; } .team_member_position { font-size: 14px; line-height: 18px; font-weight: 700; text-transform: uppercase; letter-spacing: 1.4px; color: var(--theme-color-text_dark); + .team_member_title { margin-top: 16px; } } .team_member_title { margin: 0; font-size: 57px; line-height: 1.1em; font-weight: 600; color: var(--theme-color-text_dark); } .team_member_featured { float: left; width: 53%; padding: 0 50px 0 0; .post_featured { overflow: hidden; position: relative; margin-bottom: 55px; } .team_member_description_socials { z-index: 99; position: relative; .team_member_socials { margin: 0; } } } .team_member_description_socials .team_member_socials { .social_item { display: inline-block; vertical-align: top; line-height: 1; margin: 0 7px 7px 0; .social_icon { color: var(--theme-color-text_dark); background-color: var(--theme-color-alter_bg_color); border: none; font-size: 16px; width: 45px; height: 45px; line-height: 45px; @include border-radius(50%); margin: 0; @include transition-all(0.3s); } } .social_item:hover .social_icon { color: var(--theme-color-text_dark); background-color: var(--theme-color-alter_bg_color); margin-top: -8px; } } } .team_member_projects .team_member_projects_title, .team_page_related .related_wrap_title { margin: 0 0 0.85em 0; font-size: 47px; } .sidebar_show .team_page_wrap_info { .team_page_wrap_info_over { padding-top: 0 !important; } &:before, &:after { display: none; } } .single-cpt_team .page_content_wrap { overflow: hidden; } body:not(.remove_margins) .team_page_wrap_info.comments_close { margin-bottom: -7.4em; } .team_page_wrap_info { position: relative; margin-top: 6.5em; @include box-sizing(border-box); width: 100%; .team_page_wrap_info_over { position: relative; padding: 100px 0 120px; overflow: hidden; } &:before { content: ""; display: block; position: absolute; top: 0; left: -400%; width: 1000%; height: 100%; background-color: var(--theme-color-alter_bg_color); z-index: 0; } .team_member_details { float: left; width: 43%; padding: 0 7% 0 0; @include box-sizing(border-box); .team_member_brief_info_text { font-size: 17px; line-height: 1.64em; } &:last-child { padding: 0; width: 100%; float: none; } } .section_title { margin: 0 0 0.85em 0; font-size: 47px; } .page_contact_form { margin: 0 !important; padding: 0 !important; border: none !important; overflow: visible; float: right; width: 57%; div.wpcf7 .form-style-5 { margin-top: -10px; .wpcf7-submit-style { margin-top: 15px; } .trx_addons_message_box.wpcf7-response-output, div.wpcf7-response-output { @include box-shadow(none !important); } } &:first-child { width: 100%; float: none; .wpcf7 .wpcf7-submit { @include box-shadow(none); } } .wpcf7 .trx_addons_message_box { @include box-shadow(none !important); } } .team_member_brief_info_details { font-size: 17px; margin-left: -3px; .team_member_details_value a:hover, .team_member_details_value a, .team_member_details_value { color: var(--theme-color-alter_text); } > div { margin-top: 15px; @include flex; @include flex-direction(row); @include flex-justify-content(flex-start); @include flex-align-items(center); } .team_member_details_label { width: 1.3em; height: 1.3em; line-height: 1.3em; text-align: center; text-indent: -300px; font-size: 23px; overflow: hidden; flex-shrink: 0; &:before { display: block; text-indent: 0; font-family: $theme_icons; color: var(--theme-color-text_link2); } + .team_member_details_value { margin-left: 10px; } } .team_member_details_email { .team_member_details_label:before { content: '\e9fc'; } .team_member_details_value > a { position: relative; padding-bottom: 8px; margin-bottom: -8px; &:after { content: ''; display: block; position: absolute; bottom: 0; left: 0; width: 100%; height: 1px; background: currentColor; @include transform-origin(center center); @include transform(scale3d(0, 1, 1)); @include transition(transform .25s cubic-bezier(0.25, 0.8, 0.25, 1)); will-change: transform; } &:hover { color: var(--theme-color-text_dark); } &:hover:after { @include transform-origin(center center); @include transform(scale3d(1, 1, 1)); } } } .team_member_details_phone { .team_member_details_value { font-size: 20px; font-weight: 600; a:hover, a { color: var(--theme-color-text_dark); } } .team_member_details_label:before { content: '\e9cf'; text-indent: -1px; } } .team_member_details_address { .team_member_details_label:before { content: '\e9d2'; } } .sc_icons_item_details { line-height: 1; } } } .team_member_page:not(.has-post-thumbnail) + .team_page_wrap_info { .team_member_description_socials { margin-top: 20px; } .socials_wrap:not(.socials_type_list) .social_item .social_icon { font-size: 16px; @include box(45px, 45px, 45px); background-color: var(--theme-color-bg_color); } } .related_wrap.team_page_related .sc_team_posts_item { .post_categories { text-transform: uppercase; } .sc_team_posts_item_title { font-size: 24px; line-height: 1.2em; font-weight: 500; } .post_meta { margin: 0.8em 0 0 0; } .sc_team_posts_item_content { display: none; margin-top: 0.6em; } .post_featured { margin-bottom: 1.3em; } } /* Default */ .sc_team_default .sc_team_item { text-align: center; display: block; .sc_team_item_content { display: none; } } .sc_team_default .sc_team_item_info { padding: 2em; text-align: center; .sc_team_item_title { font-size: 24px; font-weight: 600; line-height: 1.2em; margin: 0; } .sc_team_item_subtitle { font-size: 17px; line-height: 20px; font-weight: 400; font-style: normal; margin-top: 11px; color: var(--theme-color-alter_text); } .sc_team_item_content { margin-top: 1em; margin-bottom: 1em; } .sc_team_item_content + .sc_team_item_socials { margin-top: 1em; } .sc_team_item_socials { margin-left: -2px; margin-top: 15px; } .sc_team_item_socials .social_item { will-change: transform; position: relative; margin: 3px 5px 3px 0; display: inline-block; vertical-align: top; line-height: 1; .social_icon { top: 0; position: relative; @include transition-all(0.3s); color: var(--theme-color-text_dark); border: 1px solid var(--theme-color-alter_bd_color); font-size: 16px; width: 45px; height: 45px; line-height: 43px; @include border-radius(50%); text-align: center; background-color: transparent !important; } } .sc_team_item_socials .social_item:hover .social_icon { color: var(--theme-color-text_link) !important; top: -7px; } } /* Featured */ .sc_team_featured { .no_post_thumbnail { align-content: center; background-color: var(--theme-color-alter_bg_color); @include flex; flex-direction: column; justify-content: center; padding: 10px; @include box-sizing(border-box); text-align: center; h5 { margin: 0; a { display: inline; } } } .post_featured .trx_addons_hover_mask { background-color: #fff; } .post_featured:hover .trx_addons_hover_mask { opacity: 1; } .post_featured img { @include transition-property(transform); } .post_featured:hover img { @include scale(1.1, 1.1); } .trx_addons_hover_team { padding: 15px; @include abs-cc(); width: 100%; text-align: center; z-index: 99; } .trx_addons_hover:hover .trx_addons_hover_title, .trx_addons_hover:hover .trx_addons_hover_info { -webkit-transition: all 0.3s ease; -ms-transition: all 0.3s ease; transition: all 0.3s ease; } .trx_addons_hover_team .sc_team_item_title { opacity: 0; transition-property: all; transition-duration: .3s; top: 10px; position: relative; font-size: 24px; font-weight: 600; line-height: 1.2em; &, a:hover, a { color: #0C0F26; } } .trx_addons_hover_team .sc_team_item_subtitle { opacity: 0; transition-property: all; transition-duration: .3s; top: 10px; position: relative; font-size: 17px; line-height: 20px; font-weight: 400; font-style: normal; color: #797C7F; margin-top: 8px; } .trx_addons_hover_team .sc_team_item_socials { margin: 11px 0 0 0; } .trx_addons_hover_team .sc_team_item_socials .social_item { opacity: 0; transition-property: all; transition-duration: .4s; top: 15px; position: relative; margin: 6px !important; display: inline-block; vertical-align: top; line-height: 1; .social_icon { color: #000000; border: none; background: none; font-size: 16px; width: 2em; height: 2em; line-height: 2em; } } .sc_team_item_thumb .sc_team_item_socials .social_item:hover .social_icon { color: var(--theme-color-text_link); } .trx_addons_hover_style_info_anim:hover { .sc_team_item_title { opacity: 1; top: 0; transition-delay: 0.2s; } .sc_team_item_subtitle { opacity: 1; top: 0; transition-delay: 0.3s; } .sc_team_item_socials .social_item { opacity: 1; top: 0; &:nth-child(1) { transition-delay: 0.4s; } &:nth-child(2) { transition-delay: 0.45s; } &:nth-child(3) { transition-delay: 0.5s; } &:nth-child(4) { transition-delay: 0.55s; } &:nth-child(5) { transition-delay: 0.6s; } &:nth-child(6) { transition-delay: 0.65s; } &:nth-child(7) { transition-delay: 0.7s; } &:nth-child(8) { transition-delay: 0.75s; } } } } /* Short */ .sc_team_short { .sc_team_slider .sc_team_item { padding-bottom: 4px; } .sc_team_item_thumb { border: none; } .post_featured img { @include transition-property(transform); } .post_featured:hover img { @include scale(1.05, 1.05); } .sc_team_item_title { font-size: 24px; font-weight: 600; line-height: 1.2em; a:hover, a { color: var(--theme-color-text_dark); display: inline; } } .sc_team_item_subtitle { font-size: 17px; line-height: 20px; font-weight: 400; font-style: normal; margin-top: 11px; color: var(--theme-color-text_light); } .sc_team_item_thumb + .sc_team_item_info { margin-top: 24px; } .trx_addons_hover_team { padding: 15px; @include abs-cc(); width: 100%; text-align: center; z-index: 99; } .trx_addons_hover_team .sc_team_item_socials { margin: 0; } .trx_addons_hover_team .sc_team_item_socials .social_item { opacity: 0; transition-property: all; transition-duration: .3s; top: 20px; position: relative; margin: 3px !important; display: inline-block; vertical-align: top; line-height: 1; .social_icon { color: #000000; background-color: #FFFFFF; border: none; font-size: 16px; width: 45px; height: 45px; line-height: 45px; @include border-radius(50%); } } .sc_team_item_thumb .sc_team_item_socials .social_item:hover .social_icon { color: var(--theme-color-inverse_link); background-color: var(--theme-color-text_link); } .trx_addons_hover_style_info_anim:hover { .sc_team_item_socials .social_item { opacity: 1; top: 0; &:nth-child(1) { transition-delay: 0.1s; } &:nth-child(2) { transition-delay: 0.15s; } &:nth-child(3) { transition-delay: 0.2s; } &:nth-child(4) { transition-delay: 0.25s; } &:nth-child(5) { transition-delay: 0.3s; } &:nth-child(6) { transition-delay: 0.35s; } &:nth-child(7) { transition-delay: 0.4s; } &:nth-child(8) { transition-delay: 0.45s; } } } } /* Alter */ .sc_team_alter { .sc_team_slider .sc_team_item { padding-bottom: 4px; } .sc_team_item_thumb { border: none; } .post_featured img { @include transition-property(transform); } .post_featured:hover img { @include scale(1.05, 1.05); } .sc_team_item_title { font-size: 24px; font-weight: 600; line-height: 1.2em; margin: 0; a:hover, a { color: var(--theme-color-text_dark); display: inline; } } .sc_team_item_subtitle { font-size: 17px; line-height: 20px; font-weight: 400; font-style: normal; margin-top: 7px; color: var(--theme-color-text_light); } .sc_team_item_thumb + .sc_team_item_info { margin-top: 24px; } .sc_team_item_thumb .sc_team_item_content + .sc_team_item_socials { margin-top: 1.5em; } .post_featured .trx_addons_hover_mask { background-color: var(--theme-color-inverse_dark); @include transition(all 0.3s ease); } .post_featured:hover .trx_addons_hover_mask { opacity: 0.9; } .trx_addons_hover_team { padding: 15px 30px 35px; @include abs-cc(); width: 100%; height: 100%; text-align: left; z-index: 99; @include flex; flex-direction: column; justify-content: flex-end; align-items: flex-start; } .trx_addons_hover_team .sc_team_item_socials { margin: 0; z-index: 9; position: relative; } .trx_addons_hover_team .sc_team_item_socials .social_item { opacity: 0; transition-property: all; transition-duration: .3s; top: 20px; position: relative; margin: 3px 6px 3px 0 !important; display: inline-block; vertical-align: top; line-height: 1; .social_icon { background-color: var(--theme-color-text_link); color: var(--theme-color-inverse_link); border: none; font-size: 16px; width: 36px; height: 36px; line-height: 36px; @include border-radius(50%); &[class*="facebook"] { color: #ffffff; background-color: #515FC4; } &[class*="twitter"] { color: #ffffff; background-color: #48BDE9; } &[class*="dribble"], &[class*="dribbble"] { color: #ffffff; background-color: #EA4C89; } &[class*="instagram"], &[class*="instagramm"] { color: #ffffff; background-color: #C862DC; } } } .sc_team_item_thumb .sc_team_item_socials .social_item:hover .social_icon { color: #000000; background-color: #FFFFFF; } .sc_team_item_content { opacity: 0; transition-property: all; transition-duration: .3s; top: 20px; position: relative; font-size: 17px; &, a { color: #ffffff; } } .trx_addons_hover_style_info_anim:hover { .sc_team_item_content { transition-delay: 0.1s; opacity: 1; top: 0; } .sc_team_item_socials .social_item { opacity: 1; top: 0; &:nth-child(1) { transition-delay: 0.2s; } &:nth-child(2) { transition-delay: 0.25s; } &:nth-child(3) { transition-delay: 0.3s; } &:nth-child(4) { transition-delay: 0.35s; } &:nth-child(5) { transition-delay: 0.4s; } &:nth-child(6) { transition-delay: 0.45s; } &:nth-child(7) { transition-delay: 0.5s; } &:nth-child(8) { transition-delay: 0.55s; } } } } /* 3D */ .sc_team_3d { .sc_team_slider .sc_team_item { padding-bottom: 4px; } @include transform (translateZ(0)); .post_featured_bg:before { padding-top: 106%; } .post_featured_bg .post_thumb { display: block; width: 100%; height: 100%; position: absolute; top: 0; left: 0; background-repeat: no-repeat; background-size: cover; background-position: center; } .sc_team_item_title { font-size: 24px; font-weight: 600; line-height: 1.2em; margin: 0; a:hover, a { color: var(--theme-color-text_dark); display: inline; } } .sc_team_item_subtitle { font-size: 17px; line-height: 20px; font-weight: 400; font-style: normal; margin-top: 11px; color: var(--theme-color-text_light); } .sc_team_item_thumb + .sc_team_item_info { margin-top: 28px; } .trx_addons_hover_team { padding: 15px; @include abs-cc(); width: 100%; text-align: center; z-index: 99; } .trx_addons_hover_team .sc_team_item_socials { margin: 0; } .trx_addons_hover_team .sc_team_item_socials .social_item { opacity: 0; transition-property: all; transition-duration: .3s; top: 20px; position: relative; margin: 3px !important; display: inline-block; vertical-align: top; line-height: 1; .social_icon { color: #000000; background-color: #FFFFFF; border: none; font-size: 16px; width: 45px; height: 45px; line-height: 45px; @include border-radius(50%); } } .sc_team_item_thumb .sc_team_item_socials .social_item:hover .social_icon { color: var(--theme-color-inverse_link); background-color: var(--theme-color-text_link); } .sc_team_item:hover { .sc_team_item_socials .social_item { opacity: 1; top: 0; &:nth-child(1) { transition-delay: 0.1s; } &:nth-child(2) { transition-delay: 0.15s; } &:nth-child(3) { transition-delay: 0.2s; } &:nth-child(4) { transition-delay: 0.25s; } &:nth-child(5) { transition-delay: 0.3s; } &:nth-child(6) { transition-delay: 0.35s; } &:nth-child(7) { transition-delay: 0.4s; } &:nth-child(8) { transition-delay: 0.45s; } } } } /* Plain */ .sc_team_plain { .post_featured_bg:before { padding-top: 140%; } .post_featured_bg .post_thumb { display: block; width: 100%; height: 100%; position: absolute; top: 0; left: 0; background-repeat: no-repeat; background-size: cover; background-position: center; } .no_post_thumbnail { align-content: center; background-color: var(--theme-color-alter_bg_color); @include flex; flex-direction: column; justify-content: center; padding: 10px; @include box-sizing(border-box); text-align: center; h5 { margin: 0; a { display: inline; } } } .post_featured .trx_addons_hover_mask { opacity: 0; } .post_featured img { @include transition-property(transform); } .post_featured:hover img { @include scale(1.1, 1.1); } .trx_addons_hover_team { padding: 18px; position: absolute; bottom: 7px; left: 7px; right: 7px; width: calc(100% - 14px); z-index: 99; text-align: left; background-color: #ffffff; overflow: hidden; } .trx_addons_hover:hover .trx_addons_hover_title, .trx_addons_hover:hover .trx_addons_hover_info { @include transition(all 0.3s ease); } .trx_addons_hover_team .sc_team_item_title { opacity: 1; position: relative; font-size: 24px; font-weight: 600; line-height: 1.2em; margin: 0; &, a:hover, a { color: #0C0F26; } } .trx_addons_hover_team .sc_team_item_subtitle { position: relative; font-size: 17px; line-height: 20px; font-weight: 400; font-style: normal; color: #797C7F; margin-top: 8px; } .trx_addons_hover_team .sc_team_item_socials { margin: 20px 0 -57px 0; padding-top: 10px; min-height: 40px; overflow: hidden; position: relative; @include transition-all(0.5s); &:before { content: ''; display: block; height: 1px; background-color: #DDDDDD; width: 0; @include transition-all(0.4s); position: relative; top: -9px; } } .sc_team_item:hover { .trx_addons_hover_team .sc_team_item_socials { margin-bottom: -8px; &:before { width: 100%; transition-delay: 0.2s; } } } .trx_addons_hover_team .sc_team_item_socials .social_item { opacity: 0; transition-property: all; transition-duration: .3s; top: 15px; position: relative; margin: 3px 15px 3px 0 !important; display: inline-block; vertical-align: top; line-height: 1; will-change: transform; &.social_item_type_names .social_name { font-size: 14px; line-height: 16px; font-weight: 600; color: #1F242E; } .social_icon { color: #000000; border: none; background: none; font-size: 16px; width: 2em; height: 2em; line-height: 2em; } } .sc_team_item_thumb .sc_team_item_socials .social_item:hover .social_name, .sc_team_item_thumb .sc_team_item_socials .social_item:hover .social_icon { color: var(--theme-color-text_link); } .trx_addons_hover_style_info_anim:hover { .sc_team_item_socials .social_item { opacity: 1; top: 0; transition-delay: 1.4s; &:nth-child(1) { transition-delay: 0.3s; } &:nth-child(2) { transition-delay: 0.4s; } &:nth-child(3) { transition-delay: 0.5s; } &:nth-child(4) { transition-delay: 0.6s; } &:nth-child(5) { transition-delay: 0.7s; } &:nth-child(6) { transition-delay: 0.8s; } &:nth-child(7) { transition-delay: 0.9s; } &:nth-child(8) { transition-delay: 1s; } &:nth-child(9) { transition-delay: 1.1s; } &:nth-child(10) { transition-delay: 1.2s; } &:nth-child(11) { transition-delay: 1.3s; } } } } /* 3D Simple */ .sc_team_3d-simple { @include transform (translateZ(0)); .post_featured img { @include transition-property(transform); } .post_featured:hover img { @include scale(1.05, 1.05); } .sc_team_item_title { font-size: 24px; font-weight: 600; line-height: 1.2em; margin: 0; a:hover, a { color: var(--theme-color-text_dark); display: inline; } } .sc_team_item_subtitle { font-size: 17px; line-height: 20px; font-weight: 400; font-style: normal; margin-top: 11px; color: var(--theme-color-text_light); } .sc_team_item_thumb + .sc_team_item_info { margin-top: 32px; } .trx_addons_hover_team { margin: 12px 0 0 0; padding: 0; width: 100%; text-align: left; z-index: 99; position: relative; } .trx_addons_hover_team .sc_team_item_socials { margin: 0; } .trx_addons_hover_team .sc_team_item_socials .social_item { opacity: 0; transition-property: all; transition-duration: .3s; top: 20px; will-change: transform; position: relative; margin: 7px 22px 7px 0 !important; display: inline-block; vertical-align: top; line-height: 1; .social_icon { color: var(--theme-color-text_dark); border: none; font-size: 16px; width: 20px; height: 30px; line-height: 30px; @include border-radius(0); text-align: left; background-color: transparent !important; } } .sc_team_item_socials .social_item:hover .social_icon { color: var(--theme-color-text_link) !important; } .sc_team_item:hover { .sc_team_item_socials .social_item { opacity: 1; top: 0; &:nth-child(1) { transition-delay: 0.1s; } &:nth-child(2) { transition-delay: 0.15s; } &:nth-child(3) { transition-delay: 0.2s; } &:nth-child(4) { transition-delay: 0.25s; } &:nth-child(5) { transition-delay: 0.3s; } &:nth-child(6) { transition-delay: 0.35s; } &:nth-child(7) { transition-delay: 0.4s; } &:nth-child(8) { transition-delay: 0.45s; } } } } /* List */ .sc_team_list { .post_featured img { @include transition-property(transform); } .post_featured:hover img { @include scale(1.05, 1.05); } .sc_team_item_title { font-size: 35px; font-weight: 600; line-height: 1.2em; margin: 0; a { display: inline; } } .sc_team_item_subtitle { font-size: 17px; line-height: 20px; font-weight: 400; font-style: normal; margin-top: 11px; color: var(--theme-color-text_light); } .sc_team_item_content { margin: 17px 0 26px; p { margin: 0; + p { margin-top: 0.7em; } } } .sc_item_columns .sc_team_item_content { margin: 17px 0; } .sc_item_columns .sc_team_item_title { font-size: 24px; } .sc_team_item.has-post-thumbnail { @include flex; flex-direction: row; align-items: center; .post_featured { flex: 1 0 48%; max-width: 48%; } .sc_team_item_info { padding: 0 0 0 9%; } } .sc_team_item_content + .sc_team_item_socials { margin-top: 0 !important; } .sc_team_item_socials { margin-left: -2px; margin-top: 15px; } .sc_team_item .sc_team_item_socials .social_item { will-change: transform; position: relative; margin: 3px 24px 3px 0; display: inline-block; vertical-align: top; line-height: 1; .social_icon { color: var(--theme-color-text_dark); border: none; font-size: 16px; width: 20px; height: 20px; line-height: 20px; @include border-radius(0); text-align: center; background-color: transparent !important; } } .sc_team_item_socials .social_item:hover .social_icon { color: var(--theme-color-text_link) !important; } } /* Metro */ .sc_team_metro { .sc_team_item { background-color: var(--theme-color-alter_bg_color); } .post_featured img { @include transition-property(transform); } .post_featured:hover img { @include scale(1.05, 1.05); } .post_featured { &:before { padding-top: 100%; } } .sc_team_item_title { font-size: 35px; font-weight: 600; line-height: 1.2em; margin: 0; a:hover, a { color: var(--theme-color-text_dark); display: inline; } } .sc_team_item_subtitle { font-size: 17px; line-height: 20px; font-weight: 400; font-style: normal; margin-top: 9px; color: var(--theme-color-text_light); } .sc_team_item_content { margin: 17px 0 26px; font-size: 17px; line-height: 1.65em; p { margin: 0; + p { margin-top: 0.7em; } } } .sc_team_slider:not(.slider_outer_one) .sc_team_item_content, .sc_item_columns .sc_team_item_content { margin: 17px 0; } .sc_team_slider:not(.slider_outer_one) .sc_team_item_title, .sc_item_columns .sc_team_item_title { font-size: 24px; } .sc_team_item_info { padding: 20px 35px; } .sc_team_item.has-post-thumbnail { @include flex; flex-direction: row; align-items: center; .post_featured { flex: 1 0 50%; max-width: 50%; height: 100%; } } .trx_addons_column-1_2 { .sc_team_item.has-post-thumbnail { .sc_team_item_info { padding-top: 85px !important; padding-bottom: 60px !important; } } } .trx_addons_column-1_6, .trx_addons_column-1_5, .trx_addons_column-1_4, .trx_addons_column-1_3 { .sc_team_item.has-post-thumbnail { .sc_team_item_info { padding: 20px 25px; } } .sc_team_item_content + .sc_team_item_socials { margin-top: 20px; } .sc_team_item_socials .social_item .social_icon { font-size: 15px; width: 35px; height: 35px; line-height: 32px; } } .sc_team_item_content + .sc_team_item_socials { margin-top: 30px; } .sc_team_item_socials { margin-left: -2px; margin-top: 15px; } .sc_team_item_socials .social_item { will-change: transform; position: relative; margin: 3px 5px 3px 0; display: inline-block; vertical-align: top; line-height: 1; .social_icon { top: 0; position: relative; @include transition-all(0.3s); color: var(--theme-color-text_dark); border: 1px solid var(--theme-color-alter_bd_color); font-size: 16px; width: 45px; height: 45px; line-height: 43px; @include border-radius(50%); text-align: center; background-color: transparent !important; } } .sc_team_item_socials .social_item:hover .social_icon { color: var(--theme-color-text_link) !important; top: -7px; } } /* Hover */ .sc_team_hover { .no_post_thumbnail { align-content: center; background-color: var(--theme-color-alter_bg_color); @include flex; flex-direction: column; justify-content: center; padding: 10px; @include box-sizing(border-box); text-align: center; h5 { margin: 0; a { display: inline; } } } .post_featured .trx_addons_hover_mask { background: var(--theme-color-text_link2); background: -moz-linear-gradient(0deg, var(--theme-color-text_link2_08) 0%, rgba(0,0,0,0) 100%); background: -webkit-linear-gradient(0deg, var(--theme-color-text_link2_08) 0%, rgba(0,0,0,0) 100%); background: linear-gradient(0deg, var(--theme-color-text_link2_08) 0%, rgba(0,0,0,0) 100%); } .post_featured:hover .trx_addons_hover_mask { opacity: 1; } .post_featured img { @include transition-property(transform); } .post_featured:hover img { @include scale(1.1, 1.1); } .trx_addons_hover_team { padding: 35px; @include abs-cb(); width: 100%; text-align: left; z-index: 99; } .trx_addons_hover:hover .trx_addons_hover_title, .trx_addons_hover:hover .trx_addons_hover_info { -webkit-transition: all 0.3s ease; -ms-transition: all 0.3s ease; transition: all 0.3s ease; } .trx_addons_hover_team .sc_team_item_title { opacity: 0; transition-property: all; transition-duration: .3s; top: 10px; margin: 0; position: relative; font-size: 24px; font-weight: 600; line-height: 1.2em; a:hover, a { color: #ffffff; } } .trx_addons_hover_team .sc_team_item_subtitle { opacity: 0; transition-property: all; transition-duration: .3s; top: 10px; position: relative; font-size: 17px; line-height: 20px; font-weight: 400; font-style: normal; color: #ffffff; margin-top: 8px; } .trx_addons_hover_team .sc_team_item_socials { margin: 18px 0 0 -4px; } .trx_addons_hover_team .sc_team_item_socials .social_item { opacity: 0; transition-property: all; transition-duration: .4s; top: 15px; position: relative; margin: 6px 23px 6px 0 !important; display: inline-block; vertical-align: top; line-height: 1; .social_icon { color: #ffffff; border: none; background: none; font-size: 15px; width: 20px; height: 20px; line-height: 20px; opacity: 1; @include transition-property(opacity, .3s, ease); } } .sc_team_item_thumb .sc_team_item_socials .social_item:hover .social_icon { opacity: 0.7; } .trx_addons_hover_style_info_anim:hover { .sc_team_item_title { opacity: 1; top: 0; transition-delay: 0.2s; } .sc_team_item_subtitle { opacity: 1; top: 0; transition-delay: 0.3s; } .sc_team_item_socials .social_item { opacity: 1; top: 0; transition-delay: 1.2s; &:nth-child(1) { transition-delay: 0.4s; } &:nth-child(2) { transition-delay: 0.5s; } &:nth-child(3) { transition-delay: 0.6s; } &:nth-child(4) { transition-delay: 0.7s; } &:nth-child(5) { transition-delay: 0.8s; } &:nth-child(6) { transition-delay: 0.9s; } &:nth-child(7) { transition-delay: 1s; } &:nth-child(8) { transition-delay: 1.1s; } } } } /* Creative */ .sc_team_creative { .sc_team_slider .trx_addons_hover_team { margin-bottom: 0; } .sc_team_item { text-align: center; } .sc_team_item_info { text-align: center; } .sc_team_item_title { font-size: 24px; font-weight: 600; line-height: 1.2em; margin: 0; a:hover, a { display: inline; color: var(--theme-color-text_dark); } } .sc_team_item_subtitle { font-size: 17px; line-height: 20px; font-weight: 400; font-style: normal; margin-top: 11px; color: var(--theme-color-alter_text); } .sc_team_item_thumb + .sc_team_item_info { margin-top: 32px; } .trx_addons_hover_team { margin: 22px 0 -20px 0; padding: 0; width: 100%; text-align: center; z-index: 99; position: relative; } .trx_addons_hover_team .sc_team_item_socials { margin: 0; } .trx_addons_hover_team .sc_team_item_socials .social_item { opacity: 0; transition-property: all; transition-duration: .3s; top: 20px; will-change: transform; position: relative; margin: 5px 11px !important; display: inline-block; vertical-align: top; line-height: 1; .social_icon { color: var(--theme-color-text_dark); border: none; font-size: 16px; width: 20px; height: 30px; line-height: 30px; @include border-radius(0); text-align: center; background-color: transparent !important; } } .sc_team_item_socials .social_item:hover .social_icon { color: var(--theme-color-text_link) !important; } .sc_team_item:hover { .sc_team_item_socials .social_item { opacity: 1; top: 0; &:nth-child(1) { transition-delay: 0.1s; } &:nth-child(2) { transition-delay: 0.15s; } &:nth-child(3) { transition-delay: 0.2s; } &:nth-child(4) { transition-delay: 0.25s; } &:nth-child(5) { transition-delay: 0.3s; } &:nth-child(6) { transition-delay: 0.35s; } &:nth-child(7) { transition-delay: 0.4s; } &:nth-child(8) { transition-delay: 0.45s; } } } .post_featured img { z-index: 2; position: relative; } .all-svg { @include abs-cc(); width: 100%; height: 100%; z-index: 1; span { display: inline-block; line-height: 0; opacity: 0; transition-property: all; transition-duration: .3s; will-change: transform; } .svg-1 { position: absolute; top: 29%; right: 12%; margin: 15px 15px 0 0; svg { width: 130px; height: 130px; fill: var(--theme-color-text_link2); opacity: 0.11; } } .svg-2 { position: absolute; right: 1.5%; bottom: 18.5%; margin: 0 15px 0 0; svg { width: 97px; height: 97px; fill: transparent; stroke: var(--theme-color-text_dark); stroke-width: 21px; } } .svg-3 { position: absolute; left: 3.5%; top: 33.5%; margin: 15px 0 0 15px; svg { width: 137px; height: 137px; fill: transparent; stroke: var(--theme-color-text_link2); stroke-width: 21px; } } } .sc_team_item:hover { .all-svg { .svg-1 { opacity: 1; transition-delay: 0.1s; margin: 0; } .svg-2 { opacity: 1; transition-delay: 0.2s; margin: 0; } .svg-3 { opacity: 1; transition-delay: 0.15s; margin: 0; } } } } /* Accent */ .sc_team_accent { .no_post_thumbnail { align-content: center; background-color: var(--theme-color-alter_bg_color); @include flex; flex-direction: column; justify-content: center; padding: 10px; @include box-sizing(border-box); text-align: center; h5 { margin: 0; a { display: inline; } } } .post_featured_bg:before { padding-top: 100%; } .post_featured_bg .post_thumb { display: block; width: 100%; height: 100%; position: absolute; top: 0; left: 0; background-repeat: no-repeat; background-size: cover; background-position: center; } .post_featured .trx_addons_hover_mask { background-color: var(--theme-color-text_link2); } .post_featured:hover .trx_addons_hover_mask { opacity: 0.8; } .post_featured .post_thumb { @include transition-property(transform); } .post_featured:hover .post_thumb { @include scale(1.1, 1.1); } .trx_addons_hover_team { padding: 60px 20px; @include abs-cc(); width: 100%; height: 100%; text-align: center; z-index: 99; @include flex; flex-wrap: wrap; .sc_team_item_socials { @include abs-cb(); width: 100%; bottom: 27px; z-index: 9; } .center-all { align-self: center; text-align: center; width: 100%; } } .trx_addons_hover:hover .trx_addons_hover_title, .trx_addons_hover:hover .trx_addons_hover_info { @include transition-all(0.3s); } .trx_addons_hover_team .sc_team_item_title { opacity: 0; transition-property: all; transition-duration: .3s; top: 10px; margin: 0; position: relative; font-size: 24px; font-weight: 600; line-height: 1.2em; a:hover, a { color: #ffffff; } } .trx_addons_hover_team .sc_team_item_subtitle { opacity: 0; transition-property: all; transition-duration: .3s; top: 10px; position: relative; font-size: 17px; line-height: 20px; font-weight: 400; font-style: normal; color: #ffffff; margin-top: 8px; } .trx_addons_hover_team .sc_team_item_socials { margin: 0; } .trx_addons_hover_team .sc_team_item_socials .social_item { opacity: 0; transition-property: all; transition-duration: .4s; top: 15px; position: relative; margin: 6px 11px !important; display: inline-block; vertical-align: top; line-height: 1; .social_icon { color: #ffffff; border: none; background: none; font-size: 15px; width: 20px; height: 20px; line-height: 20px; opacity: 1; @include transition-property(opacity, .3s, ease); } } .sc_team_item_thumb .sc_team_item_socials .social_item:hover .social_icon { opacity: 0.7; } .trx_addons_hover_style_info_anim:hover { .sc_team_item_title { opacity: 1; top: 0; transition-delay: 0.2s; } .sc_team_item_subtitle { opacity: 1; top: 0; transition-delay: 0.3s; } .sc_team_item_socials .social_item { opacity: 1; top: 0; transition-delay: 1.2s; &:nth-child(1) { transition-delay: 0.4s; } &:nth-child(2) { transition-delay: 0.5s; } &:nth-child(3) { transition-delay: 0.6s; } &:nth-child(4) { transition-delay: 0.7s; } &:nth-child(5) { transition-delay: 0.8s; } &:nth-child(6) { transition-delay: 0.9s; } &:nth-child(7) { transition-delay: 1s; } &:nth-child(8) { transition-delay: 1.1s; } } } } /* Light */ .sc_team_light { .no_post_thumbnail { align-content: center; background-color: var(--theme-color-alter_bg_color); @include flex; flex-direction: column; justify-content: center; padding: 10px; @include box-sizing(border-box); text-align: center; } .sc_team_item_title { margin: 0; a { display: inline; } } .post_featured_bg:before { padding-top: 100%; } .post_featured_bg .post_thumb { display: block; width: 100%; height: 100%; position: absolute; top: 0; left: 0; background-repeat: no-repeat; background-size: cover; background-position: center; } .post_featured .trx_addons_hover_mask { background-color: var(--theme-color-inverse_dark); } .post_featured:hover .trx_addons_hover_mask { opacity: 0.76; } .post_featured .post_thumb { @include transition-property(transform); } .post_featured:hover .post_thumb { @include scale(1.1, 1.1); } .trx_addons_hover_team { padding: 15px 55px 36px 28px; @include abs-cb(); width: 100%; text-align: left; z-index: 99; } .trx_addons_hover:hover .trx_addons_hover_title, .trx_addons_hover:hover .trx_addons_hover_info { @include transition-all(0.3s); } .trx_addons_hover_team .sc_team_item_title { opacity: 0; transition-property: all; transition-duration: .3s; top: 10px; margin: 0; position: relative; font-size: 24px; font-weight: 600; line-height: 1.2em; a:hover, a { color: #ffffff; } } .trx_addons_hover_team .sc_team_item_subtitle { opacity: 0; transition-property: all; transition-duration: .3s; top: 10px; position: relative; font-size: 17px; line-height: 20px; font-weight: 400; font-style: normal; color: #ffffff; margin-top: 6px; } .sc_team_item_thumb .sc_team_item_socials { margin: 0; @include abs-rt(15px,15px); bottom: 15px; height: auto; overflow: hidden; z-index: 99; width: 30px; text-align: right; } .sc_team_item_thumb .sc_team_item_socials .social_item { opacity: 0; transition-property: all; transition-duration: .3s; right: -10px; display: block; float: none; position: relative; margin: 5px !important; vertical-align: top; line-height: 1; .social_icon { color: #ffffff; border: none; background: none; font-size: 15px; width: 20px; height: 30px; line-height: 30px; @include transition-property(opacity, .3s, ease); } } .sc_team_item_thumb .sc_team_item_socials .social_item:hover .social_icon { opacity: 0.7; } .sc_team_item:hover { .sc_team_item_title { opacity: 1; top: 0; transition-delay: 0.2s; } .sc_team_item_subtitle { opacity: 1; top: 0; transition-delay: 0.3s; } .sc_team_item_socials .social_item { opacity: 1; right: 0; transition-delay: 1.2s; &:nth-child(1) { transition-delay: 0.4s; } &:nth-child(2) { transition-delay: 0.5s; } &:nth-child(3) { transition-delay: 0.6s; } &:nth-child(4) { transition-delay: 0.7s; } &:nth-child(5) { transition-delay: 0.8s; } &:nth-child(6) { transition-delay: 0.9s; } &:nth-child(7) { transition-delay: 1s; } &:nth-child(8) { transition-delay: 1.1s; } } } } /* Map Marker */ .map_marker { position: absolute; width: 18px; height: 18px; display: block; @include border-radius(50%); background-color: var(--theme-color-text_link2); will-change: transform; > div { background-color: var(--theme-color-text_link2_05); content: ''; display: inline-block; width: 100%; height: 100%; position: absolute; top: 0; left: 0; @include border-radius(50%); opacity: 1; } > div:first-child { -webkit-animation: markerWave 1.5s cubic-bezier(0.4, 0, 0.2, 1) infinite forwards; animation: markerWave 1.5s cubic-bezier(0.4, 0, 0.2, 1) infinite forwards; } > div:first-child + div { -webkit-animation: markerWave 1.5s 0.45s cubic-bezier(0, 0, 0.2, 1) infinite forwards; animation: markerWave 1.5s 0.45s cubic-bezier(0, 0, 0.2, 1) infinite forwards; } } @-webkit-keyframes markerWave { 0% { -webkit-transform: scale(1); transform: scale(1); opacity: 0.8; } 20% { opacity: 0.8; } 100% { -webkit-transform: scale(5.5); transform: scale(5.5); opacity: 0; } } @keyframes markerWave { 0% { -webkit-transform: scale(1); transform: scale(1); opacity: 0.8; } 20% { opacity: 0.8; } 100% { -webkit-transform: scale(5.5); transform: scale(5.5); opacity: 0; } } /* style 2 */ .map_marker_2 { position: absolute; width: 86px; height: 86px; @include border-radius(50%); background-color: #ffffff; &:before { @include abs-cc(); display: block; content: '\e9ce'; font-family: $theme_icons; color: #000; font-size: 38px; margin: 2px 0 0 0; } } /* custom pagination as thumb */ .swiper-pagination-custom .swiper-pagination-button { margin: 0 6px; width: 5em; height: 5em; border: none; opacity: 1; @include border-round; background-color: transparent; will-change: transform; @include transform(scale3d(.8, .8, .8)); @include transition(transform .3s ease-out); backface-visibility: hidden; -webkit-backface-visibility: hidden; cursor: pointer; } .swiper-pagination-custom .swiper-pagination-button.swiper-pagination-button-active { @include transform(scale3d(1, 1, 1)); background-color: transparent; } .slider_container.slider_pagination_pos_bottom .swiper-pagination-custom, .slider_outer.slider_outer_pagination_pos_bottom .swiper-pagination-custom, .slider_outer.slider_outer_pagination_pos_bottom_outside .swiper-pagination-custom { height: 5em; line-height: 5em; } .slider_outer.slider_outer_pagination_pos_bottom .swiper-pagination-custom, .slider_outer.slider_outer_pagination_pos_bottom_outside .swiper-pagination-custom { margin-top: 1.8em; } /* Testimonials */ .sc_testimonials:not(.sc_testimonials_plain) .sc_testimonials_content > .sc_testimonials_item + .sc_testimonials_item { margin-top: 2em; } .sc_testimonials .swiper-cube .sc_testimonials_item:before { z-index: auto; } .sc_testimonials_default .trx_addons_columns_wrap.columns_padding_bottom > [class*="trx_addons_column-"], .sc_testimonials_simple .trx_addons_columns_wrap.columns_padding_bottom > [class*="trx_addons_column-"], .sc_testimonials_classic .trx_addons_columns_wrap.columns_padding_bottom > [class*="trx_addons_column-"], .sc_testimonials_light .trx_addons_columns_wrap.columns_padding_bottom > [class*="trx_addons_column-"], .sc_testimonials_list .trx_addons_columns_wrap.columns_padding_bottom > [class*="trx_addons_column-"], .sc_testimonials_common .trx_addons_columns_wrap.columns_padding_bottom > [class*="trx_addons_column-"], .sc_testimonials_modern .trx_addons_columns_wrap.columns_padding_bottom > [class*="trx_addons_column-"], .sc_testimonials_creative .trx_addons_columns_wrap.columns_padding_bottom > [class*="trx_addons_column-"], .sc_testimonials_fashion .trx_addons_columns_wrap.columns_padding_bottom > [class*="trx_addons_column-"], .sc_testimonials_alter .trx_addons_columns_wrap.columns_padding_bottom > [class*="trx_addons_column-"], .sc_testimonials_alter2 .trx_addons_columns_wrap.columns_padding_bottom > [class*="trx_addons_column-"], .sc_testimonials_decoration .trx_addons_columns_wrap.columns_padding_bottom > [class*="trx_addons_column-"], .sc_testimonials_extra .trx_addons_columns_wrap.columns_padding_bottom > [class*="trx_addons_column-"] { padding-bottom: 60px; } .sc_testimonials_default .trx_addons_columns_wrap.columns_padding_bottom.columns_in_single_row > [class*="trx_addons_column-"], .sc_testimonials_simple .trx_addons_columns_wrap.columns_padding_bottom.columns_in_single_row > [class*="trx_addons_column-"], .sc_testimonials_classic .trx_addons_columns_wrap.columns_padding_bottom.columns_in_single_row > [class*="trx_addons_column-"], .sc_testimonials_light .trx_addons_columns_wrap.columns_padding_bottom.columns_in_single_row > [class*="trx_addons_column-"], .sc_testimonials_list .trx_addons_columns_wrap.columns_padding_bottom.columns_in_single_row > [class*="trx_addons_column-"], .sc_testimonials_common .trx_addons_columns_wrap.columns_padding_bottom.columns_in_single_row > [class*="trx_addons_column-"], .sc_testimonials_modern .trx_addons_columns_wrap.columns_padding_bottom.columns_in_single_row > [class*="trx_addons_column-"], .sc_testimonials_creative .trx_addons_columns_wrap.columns_padding_bottom.columns_in_single_row > [class*="trx_addons_column-"], .sc_testimonials_fashion .trx_addons_columns_wrap.columns_padding_bottom.columns_in_single_row > [class*="trx_addons_column-"], .sc_testimonials_alter .trx_addons_columns_wrap.columns_padding_bottom.columns_in_single_row > [class*="trx_addons_column-"], .sc_testimonials_alter2 .trx_addons_columns_wrap.columns_padding_bottom.columns_in_single_row > [class*="trx_addons_column-"], .sc_testimonials_decoration .trx_addons_columns_wrap.columns_padding_bottom.columns_in_single_row > [class*="trx_addons_column-"], .sc_testimonials_extra .trx_addons_columns_wrap.columns_padding_bottom.columns_in_single_row > [class*="trx_addons_column-"] { padding-bottom: 0; } // Author subtitle & title .sc_testimonials { //.sc_testimonials_item .sc_testimonials_item_author_data .sc_testimonials_item_author_title, .sc_testimonials_item_author_title { @include font(21px, 1.14em, 600, normal); text-transform: uppercase; letter-spacing: 0; color: var(--theme-color-text_dark); } .sc_testimonials_item_author_title + .sc_testimonials_item_author_subtitle, .sc_testimonials_item_author_subtitle { @include font(16px, 1.3em); } } /* Classic */ .sc_testimonials_classic { .slider_container.slider_controls_side .slider_controls_wrap > .slider_prev { opacity: 1; margin-left: 0 !important; left: 0 !important; text-align: left !important; } .slider_container.slider_controls_side .slider_controls_wrap > .slider_next { opacity: 1; margin-right: 0 !important; right: 0 !important; text-align: right !important; } .slider_container.slider_controls_side .slider_controls_wrap > a { width: 40px; height: 40px; line-height: 40px; background: none !important; color: var(--theme-color-text_dark) !important; &:before { font-size: 22px; } &:hover { color: var(--theme-color-text_link) !important; } } .slider_outer.slider_outer_pagination_pos_bottom.slider_outer_pagination_custom .slider_controls_wrap > a { margin-top: 2em; } .slider_container .sc_testimonials_item { padding: 0 15%; } .sc_testimonials_item_author_subtitle { color: var(--theme-color-text_dark); opacity: 0.8; padding-bottom: 2px; } .sc_testimonials_item_author_title + .sc_testimonials_item_author_subtitle { margin-top: 10px; } .sc_testimonials_item_author, [class*="column"] .sc_testimonials_item_author { text-align: center; margin: 30px 0 0 0; padding: 0; } .sc_testimonials_item_content, [class*="column"] .sc_testimonials_item_content { @include font(22px, 1.64em, 400); text-align: center; color: var(--theme-color-text_dark); } .sc_testimonials_item_content:before { margin-bottom: 40px; font-size: 24px; line-height: 1.3em; content:'\e9ca'; font-family:$theme_icons; will-change: color; color: var(--theme-color-text_dark); @include transition(color .3s ease-out); } } /* Default */ .sc_testimonials_default { [class*="column"] .sc_testimonials_item_content, .sc_testimonials_item_content { text-align: left; @include font(19px, 1.78em, 400, normal); color: var(--theme-color-text); &:before { display: none; } } .sc_testimonials_item_author { margin: 38px 0 1px; max-width: none; padding: 0; background-color: transparent; color: var(--theme-color-text_dark); text-align: left; } .sc_testimonials_item_author_avatar { overflow: visible; margin: 0 20px 1px 0; width: 78px; height: 78px; position: relative; &:before { content:'\e9cb'; font-family:$theme_icons; display: block; @include abs-rb(-1px,-1px); width: 30px; height: 30px; line-height: 32px; overflow: hidden; font-size: 7px; font-weight: 400; text-align: center; text-indent: 1px; @include border-radius(50%); background-color: var(--theme-color-text_link); color: var(--theme-color-inverse_link); } img { overflow: hidden; @include border-radius(50%); } } .sc_testimonials_item_author_data { max-width: 100%; .sc_testimonials_item_author_title { margin: 0; } .sc_testimonials_item_author_subtitle, .sc_testimonials_item_author_title + .sc_testimonials_item_author_subtitle { margin-top: 0; color: var(--theme-color-text_dark); opacity: 0.8; } .sc_testimonials_item_author_title + .sc_testimonials_item_author_subtitle { margin-top: 6px; } } } /* Simple */ .sc_testimonials_simple { .slider_outer.slider_outer_pagination_pos_bottom_outside .swiper-pagination-bullets, .sc_item_slider.slider_outer_pagination_pos_bottom .swiper-pagination { margin-top: 3.4em; } [class*="column"] .sc_testimonials_item_content, .sc_testimonials_item_content { text-align: center; @include font(19px, 1.78em, 400, normal); color: var(--theme-color-text); &:before { font-size: 23px; line-height: 1.5em; color: var(--theme-color-inverse_text); content:'\e9de'; font-family:$theme_icons; margin-bottom: 30px; } } [class*="column"] .sc_testimonials_item_author, .sc_testimonials_item_author { margin: 34px 0 0; max-width: none; padding: 0; background-color: transparent; color: var(--theme-color-text_dark); text-align: center; } .sc_testimonials_item_author_avatar { margin: 0 auto 27px; width: 78px; height: 78px; position: relative; overflow: hidden; @include border-radius(50%); display: inline-block; } .sc_testimonials_item_author_data:before { display: none; } [class*="column"] .sc_testimonials_item_author_data, .sc_testimonials_item_author_data { border: none; padding: 0; max-width: 100%; text-align: center; .sc_testimonials_item_author_title { margin: 0; } .sc_testimonials_item_author_subtitle, .sc_testimonials_item_author_title + .sc_testimonials_item_author_subtitle { margin-top: 0; color: var(--theme-color-text_dark); opacity: 0.8; padding-bottom: 2px; } .sc_testimonials_item_author_title + .sc_testimonials_item_author_subtitle { margin-top: 6px; } } .slider_container .swiper-pagination-bullet, .slider_outer .swiper-pagination-bullet { width: 10px; border: 2px solid var(--theme-color-text_dark); opacity: 1; height: 10px; } .slider_container.slider_pagination_pos_bottom .swiper-pagination-bullets .swiper-pagination-bullet, .slider_outer.slider_outer_pagination_pos_bottom .swiper-pagination-bullets .swiper-pagination-bullet, .slider_outer.slider_outer_pagination_pos_bottom_outside .swiper-pagination-bullets .swiper-pagination-bullet { margin: 0 8px; } } /* Plain */ body:not(.mobile_layout) .sc_testimonials_plain .sc_testimonials_slider { overflow: hidden; padding: 40px 0; } body:not(.mobile_layout) .sc_testimonials_plain .slider_container[data-slides-per-view="3"] { overflow: visible; } body:not(.mobile_layout) .sc_testimonials_plain .slider_container[data-slides-per-view="3"] .swiper-slide-duplicate-active + .swiper-slide-duplicate-next .sc_testimonials_item, body:not(.mobile_layout) .sc_testimonials_plain .slider_container[data-slides-per-view="3"] .swiper-slide-active + .swiper-slide-next .sc_testimonials_item { background-color: var(--theme-color-alter_bg_color); @include box-shadow(0 3px 40px 0 rgba(0,0,0,0.06)); } .sc_testimonials_plain { .sc_item_slider.slider_outer_pagination_pos_bottom_outside .swiper-pagination, .sc_item_slider.slider_outer_pagination_pos_bottom .swiper-pagination { margin-top: 2.4em; } .sc_testimonials_item { padding: 50px 60px 59px 107px; @include box-sizing(border-box); background-color: transparent; @include transition-all(0.3s); position: relative; height: auto; &:before { content:'\e9eb'; font-family:$theme_icons; display: block; @include abs-lt(41px,53px); width: 35px; height: 35px; line-height: 35px; font-size: 25px; font-weight: 400; text-align: center; color: var(--theme-color-text_link2); } } [class*="column"] .sc_testimonials_item_content, .sc_testimonials_item_content { text-align: left; @include font(19px, 1.78em, 400, normal); color: var(--theme-color-text_dark); &:before { display: none; } } .sc_testimonials_item_author { margin: 25px 0 0; max-width: none; padding: 0; background-color: transparent; color: var(--theme-color-text_dark); text-align: left; } .sc_testimonials_item_author_avatar { margin: 0 16px 0 0; width: 78px; height: 78px; position: relative; overflow: hidden; @include border-radius(50%); } .sc_testimonials_item_author_data { max-width: 100%; .sc_testimonials_item_author_title { margin: 0; } .sc_testimonials_item_author_subtitle, .sc_testimonials_item_author_title + .sc_testimonials_item_author_subtitle { margin-top: 0; color: var(--theme-color-text_dark); opacity: 0.8; } .sc_testimonials_item_author_title + .sc_testimonials_item_author_subtitle { margin-top: 6px; } } .slider_container.slider_pagination_pos_bottom .swiper-pagination-bullets .swiper-pagination-bullet, .slider_outer.slider_outer_pagination_pos_bottom .swiper-pagination-bullets .swiper-pagination-bullet, .slider_outer.slider_outer_pagination_pos_bottom_outside .swiper-pagination-bullets .swiper-pagination-bullet { margin: 0 8px; background: transparent; border-color: var(--theme-color-bd_color); } .swiper-pagination-custom .swiper-pagination-button.swiper-pagination-button-active, .sc_slider_controls.slider_pagination_style_bullets .slider_pagination_bullet.swiper-pagination-bullet-active, .sc_slider_controls.slider_pagination_style_bullets .slider_pagination_bullet:hover, .slider_container .slider_pagination_wrap .swiper-pagination-bullet.swiper-pagination-bullet-active, .slider_outer .slider_pagination_wrap .swiper-pagination-bullet.swiper-pagination-bullet-active, .slider_container .slider_pagination_wrap .swiper-pagination-bullet:hover, .slider_outer .slider_pagination_wrap .swiper-pagination-bullet:hover { border-color: var(--theme-color-text_link); background-color: var(--theme-color-text_link); } } /* Extra */ .sc_testimonials_extra .slider_container { .sc_testimonials_item { padding: 15px 15px 0; } } body:not(.mobile_layout) .sc_testimonials_extra .slider_container[data-slides-per-view="3"] .swiper-slide-duplicate-active + .swiper-slide-duplicate-next .sc_testimonials_item_content, body:not(.mobile_layout) .sc_testimonials_extra .slider_container[data-slides-per-view="3"] .swiper-slide-active + .swiper-slide-next .sc_testimonials_item_content, body:not(.mobile_layout) .sc_testimonials_extra .slider_container[data-slides-per-view="3"] .swiper-slide-next .sc_testimonials_item_content { will-change: background-color; background-color: var(--theme-color-text_link2); color: #ffffff; &:before { color: #ffffff; } &:after { background-color: var(--theme-color-text_link2); } > p { opacity: 0.8; } } .sc_testimonials_extra { .sc_item_slider.slider_outer_pagination_pos_bottom .swiper-pagination { margin-top: 2.2em; } .slider_outer.slider_outer_pagination_pos_bottom_outside .swiper-pagination-bullets { margin-top: 3em; } .sc_testimonials_item { .sc_testimonials_item_content { padding: 50px 40px 58px; @include box-sizing(border-box); @include transition-all(0.3s); @include box-shadow(0 3px 15px 0 rgba(0,0,0,0.02)); background-color: var(--theme-color-alter_bg_color); text-align: center; @include font(19px, 1.78em, 400, normal); color: var(--theme-color-text_dark); position: relative; overflow: visible; > p { opacity: 1; @include transition(opacity 0.3s ease); } &:before { content:'\e9eb'; font-family:$theme_icons; display: block; width: 100%; height: 35px; line-height: 35px; font-size: 22px; font-weight: 400; text-align: center; color: var(--theme-color-text_link2); margin-bottom: 18px; @include transition-all(0.3s); } &:after { content: ''; width: 22px; height: 22px; background-color: var(--theme-color-alter_bg_color); position: absolute; bottom: -6px; left: 50%; z-index: 1; @include transform(translateX(-50%) rotate(125deg) skew(-20deg)); @include transition-all(0.3s); } } } [class*="column"] .sc_testimonials_item_author, .sc_testimonials_item_author { margin: 40px 0 0; max-width: none; padding: 0; background-color: transparent; color: var(--theme-color-text_dark); text-align: center; } .sc_testimonials_item_author_avatar { margin: 0; width: 78px; height: 78px; position: relative; overflow: hidden; @include border-radius(50%); display: inline-block; + .sc_testimonials_item_author_data { margin-top: 28px; } } .sc_testimonials_item_author_data { max-width: 100%; width: 100%; text-align: center; .sc_testimonials_item_author_title { margin: 0; } .sc_testimonials_item_author_subtitle, .sc_testimonials_item_author_title + .sc_testimonials_item_author_subtitle { margin-top: 0; color: var(--theme-color-alter_text); opacity: 0.8; padding-bottom: 2px; } .sc_testimonials_item_author_title + .sc_testimonials_item_author_subtitle { margin-top: 6px; } } .slider_container.slider_pagination_pos_bottom .swiper-pagination-bullets .swiper-pagination-bullet, .slider_outer.slider_outer_pagination_pos_bottom .swiper-pagination-bullets .swiper-pagination-bullet, .slider_outer.slider_outer_pagination_pos_bottom_outside .swiper-pagination-bullets .swiper-pagination-bullet { margin: 0 8px; background: transparent; border-color: var(--theme-color-bd_color); } .swiper-pagination-custom .swiper-pagination-button.swiper-pagination-button-active, .sc_slider_controls.slider_pagination_style_bullets .slider_pagination_bullet.swiper-pagination-bullet-active, .sc_slider_controls.slider_pagination_style_bullets .slider_pagination_bullet:hover, .slider_container .slider_pagination_wrap .swiper-pagination-bullet.swiper-pagination-bullet-active, .slider_outer .slider_pagination_wrap .swiper-pagination-bullet.swiper-pagination-bullet-active, .slider_container .slider_pagination_wrap .swiper-pagination-bullet:hover, .slider_outer .slider_pagination_wrap .swiper-pagination-bullet:hover { border-color: var(--theme-color-text_link); background-color: var(--theme-color-text_link); } } /* Light */ .sc_testimonials_light { .sc_item_slider.slider_outer_pagination_pos_bottom { .swiper-pagination { text-align: left; padding-left: 66px; margin-top: 5.3em; } } .sc_testimonials_item { padding: 0 0 0 72px; @include box-sizing(border-box); background-color: transparent; @include transition-all(0.3s); position: relative; &:before { content:'\e9de'; font-family:$theme_icons; display: block; @include abs-lt(1px,4px); width: 35px; height: 35px; line-height: 35px; font-size: 22px; font-weight: 400; text-align: left; color: var(--theme-color-text_link); } } [class*="column"] .sc_testimonials_item_content, .sc_testimonials_item_content { text-align: left; @include font(19px, 1.78em, 400, normal); color: var(--theme-color-text); &:before { display: none; } } .sc_testimonials_item_author { margin: 36px 0 0; max-width: none; padding: 0; background-color: transparent; color: var(--theme-color-text_dark); text-align: left; } .sc_testimonials_item_author_avatar { margin: 0 16px 0 0; width: 78px; height: 78px; position: relative; overflow: hidden; @include border-radius(50%); } .sc_testimonials_item_author_data { max-width: 100%; .sc_testimonials_item_author_title { margin: 0; } .sc_testimonials_item_author_subtitle, .sc_testimonials_item_author_title + .sc_testimonials_item_author_subtitle { margin-top: 0; color: var(--theme-color-text_dark); opacity: 0.8; } .sc_testimonials_item_author_title + .sc_testimonials_item_author_subtitle { margin-top: 6px; } } .slider_container.slider_pagination_pos_bottom .swiper-pagination-bullets .swiper-pagination-bullet, .slider_outer.slider_outer_pagination_pos_bottom .swiper-pagination-bullets .swiper-pagination-bullet, .slider_outer.slider_outer_pagination_pos_bottom_outside .swiper-pagination-bullets .swiper-pagination-bullet { margin: 0 8px; background: transparent; border-color: #E5E3E0; } .swiper-pagination-custom .swiper-pagination-button.swiper-pagination-button-active, .sc_slider_controls.slider_pagination_style_bullets .slider_pagination_bullet.swiper-pagination-bullet-active, .sc_slider_controls.slider_pagination_style_bullets .slider_pagination_bullet:hover, .slider_container .slider_pagination_wrap .swiper-pagination-bullet.swiper-pagination-bullet-active, .slider_outer .slider_pagination_wrap .swiper-pagination-bullet.swiper-pagination-bullet-active, .slider_container .slider_pagination_wrap .swiper-pagination-bullet:hover, .slider_outer .slider_pagination_wrap .swiper-pagination-bullet:hover { border-color: var(--theme-color-text_link); background-color: var(--theme-color-text_link); } } /* List */ .sc_testimonials_list { .sc_item_slider.slider_outer_pagination_pos_bottom { .swiper-pagination { text-align: left; padding: 0; margin-left: -8px; } } .sc_testimonials_item { padding: 0; @include box-sizing(border-box); background-color: transparent; @include transition-all(0.3s); &:before { content:'\e9de'; font-family:$theme_icons; display: block; width: 35px; height: 35px; line-height: 35px; font-size: 23px; font-weight: 400; text-align: left; margin-bottom: 30px; color: var(--theme-color-text_link); } } [class*="column"] .sc_testimonials_item_content, .sc_testimonials_item_content { text-align: left; @include font(19px, 1.78em, 400, normal); color: var(--theme-color-text); &:before { display: none; } } .sc_testimonials_item_author { margin: 32px 0 0; max-width: none; padding: 0; background-color: transparent; color: var(--theme-color-text_dark); text-align: left; } .sc_testimonials_item_author_data { max-width: 100%; .sc_testimonials_item_author_title { margin: 0; } .sc_testimonials_item_author_subtitle, .sc_testimonials_item_author_title + .sc_testimonials_item_author_subtitle { margin-top: 0; color: var(--theme-color-text_dark); opacity: 0.8; padding-bottom: 2px; } .sc_testimonials_item_author_title + .sc_testimonials_item_author_subtitle { margin-top: 6px; } } .slider_container.slider_pagination_pos_bottom .swiper-pagination-bullets .swiper-pagination-bullet, .slider_outer.slider_outer_pagination_pos_bottom .swiper-pagination-bullets .swiper-pagination-bullet, .slider_outer.slider_outer_pagination_pos_bottom_outside .swiper-pagination-bullets .swiper-pagination-bullet { margin: 0 8px; background: transparent; border-color: #E5E3E0; } .swiper-pagination-custom .swiper-pagination-button.swiper-pagination-button-active, .sc_slider_controls.slider_pagination_style_bullets .slider_pagination_bullet.swiper-pagination-bullet-active, .sc_slider_controls.slider_pagination_style_bullets .slider_pagination_bullet:hover, .slider_container .slider_pagination_wrap .swiper-pagination-bullet.swiper-pagination-bullet-active, .slider_outer .slider_pagination_wrap .swiper-pagination-bullet.swiper-pagination-bullet-active, .slider_container .slider_pagination_wrap .swiper-pagination-bullet:hover, .slider_outer .slider_pagination_wrap .swiper-pagination-bullet:hover { border-color: var(--theme-color-text_link); background-color: var(--theme-color-text_link); } } /* Common */ .sc_testimonials_common { .sc_item_slider.slider_outer_pagination_pos_bottom { padding-bottom: 4.9em; } [class*="column"] .sc_testimonials_item_content, .sc_testimonials_item_content { text-align: center; @include font(19px, 1.78em, 400, normal); color: var(--theme-color-text); &:before { font-size: 23px; line-height: 1.5em; color: var(--theme-color-inverse_text); content:'\e9de'; font-family:$theme_icons; margin-bottom: 30px; } } [class*="column"] .sc_testimonials_item_author, .sc_testimonials_item_author { margin: 32px 0 0; max-width: none; padding: 0; background-color: transparent; color: var(--theme-color-text_dark); text-align: center; } [class*="column"] .sc_testimonials_item_author_data, .sc_testimonials_item_author_data { border: none; padding: 0; max-width: 100%; text-align: center; .sc_testimonials_item_author_title { margin: 0; } .sc_testimonials_item_author_subtitle, .sc_testimonials_item_author_title + .sc_testimonials_item_author_subtitle { margin-top: 0; color: var(--theme-color-text_dark); opacity: 0.8; padding-bottom: 2px; } .sc_testimonials_item_author_title + .sc_testimonials_item_author_subtitle { margin-top: 6px; } } .slider_container .swiper-pagination-bullet, .slider_outer .swiper-pagination-bullet { width: 10px; border: 2px solid var(--theme-color-text_dark); opacity: 1; height: 10px; } .slider_container.slider_pagination_pos_bottom .swiper-pagination-bullets .swiper-pagination-bullet, .slider_outer.slider_outer_pagination_pos_bottom .swiper-pagination-bullets .swiper-pagination-bullet, .slider_outer.slider_outer_pagination_pos_bottom_outside .swiper-pagination-bullets .swiper-pagination-bullet { margin: 0 8px; } } /* Modern */ .sc_testimonials_modern { .sc_item_slider.slider_outer_pagination_pos_bottom { padding-bottom: 6.7em !important; .swiper-pagination { text-align: left; padding-left: 66px; } } .sc_testimonials_item { padding: 0; @include box-sizing(border-box); background-color: transparent; @include transition-all(0.3s); &:before { margin-bottom: 42px; margin-left: 4px; font-size: 24px; line-height: 1.3em; content: '\e9ca'; font-family:$theme_icons; display: block; position: relative; width: 100%; font-weight: 400; text-align: left; color: var(--theme-color-text_link); } } [class*="column"] .sc_testimonials_item_content, .sc_testimonials_item_content { text-align: left; @include font(1rem, 1.62em, var(--theme-font-p_font-weight), normal); color: var(--theme-color-text); strong { @include font(24px, 1em, 600); text-transform: uppercase; color: var(--theme-color-text_dark); } &:before { display: none; } } .sc_testimonials_item_author { margin: 36px 0 0; max-width: none; padding: 0; background-color: transparent; color: var(--theme-color-text_dark); text-align: left; } .sc_testimonials_item_author_avatar { overflow: visible; margin: 0 15px 1px 0; width: 78px; height: 78px; position: relative; &:before { content:'\e9cb'; font-family:$theme_icons; display: block; @include abs-rb(0,0); width: 30px; height: 30px; line-height: 32px; overflow: hidden; font-size: 7px; font-weight: 400; text-align: center; text-indent: 1px; @include border-radius(50%); background-color: var(--theme-color-text_link); color: var(--theme-color-inverse_link); } img { overflow: hidden; @include border-radius(50%); } } .sc_testimonials_item_author_data { max-width: 100%; .sc_testimonials_item_author_title { margin: 0; } .sc_testimonials_item_author_subtitle, .sc_testimonials_item_author_title + .sc_testimonials_item_author_subtitle { margin-top: 0; color: var(--theme-color-alter_text); opacity: 0.8; } .sc_testimonials_item_author_title + .sc_testimonials_item_author_subtitle { margin-top: 6px; } } .slider_container.slider_pagination_pos_bottom .swiper-pagination-bullets .swiper-pagination-bullet, .slider_outer.slider_outer_pagination_pos_bottom .swiper-pagination-bullets .swiper-pagination-bullet, .slider_outer.slider_outer_pagination_pos_bottom_outside .swiper-pagination-bullets .swiper-pagination-bullet { margin: 0 8px; background: transparent; border-color: #E5E3E0; } .swiper-pagination-custom .swiper-pagination-button.swiper-pagination-button-active, .sc_slider_controls.slider_pagination_style_bullets .slider_pagination_bullet.swiper-pagination-bullet-active, .sc_slider_controls.slider_pagination_style_bullets .slider_pagination_bullet:hover, .slider_container .slider_pagination_wrap .swiper-pagination-bullet.swiper-pagination-bullet-active, .slider_outer .slider_pagination_wrap .swiper-pagination-bullet.swiper-pagination-bullet-active, .slider_container .slider_pagination_wrap .swiper-pagination-bullet:hover, .slider_outer .slider_pagination_wrap .swiper-pagination-bullet:hover { border-color: var(--theme-color-text_link); background-color: var(--theme-color-text_link); } } /* Hover */ .sc_testimonials_hover { .sc_item_slider .sc_testimonials_item { @include box-shadow(none); } .slider_outer.slider_outer_pagination_pos_bottom_outside .swiper-pagination-bullets, .sc_item_slider.slider_outer_pagination_pos_bottom .swiper-pagination { margin-top: 2.4em; } .sc_testimonials_item { position: relative; @include box-shadow(0 3px 15px 0 rgba(0, 0, 0, 0.05)); padding: 50px 50px 55px; height: auto; @include box-sizing(border-box); background-color: var(--theme-color-alter_bg_color); @include transition-all(0.4s); &:after { background-position:center !important; background-repeat:no-repeat !important; background-size: cover; content: ""; display: block; @include abs-cc(); width: 100%; height: 100%; @include transition-all(0.4s); z-index: 1; opacity: 0; } &:before { content:'\e9eb'; font-family:$theme_icons; display: block; position: relative; width: 100%; height: 32px; line-height: 32px; font-size: 20px; font-weight: 400; text-align: left; color: var(--theme-color-text_link2); margin-bottom: 20px; @include transition-all(0.4s); } &:hover { color: var(--theme-color-text_dark); background-color: var(--theme-color-text_link2); .sc_testimonials_item_content { color: #FCFCFC; opacity: 0.9; } &:before { color: #ffffff; } &:after { opacity: 1; } .sc_testimonials_item_author_title { color: #FCFCFC; } .sc_testimonials_item_author_subtitle { color: #FFFFFF !important; opacity: 0.8 !important; } } } [class*="column"] .sc_testimonials_item_content, .sc_testimonials_item_content { text-align: left; @include font(19px, 1.78em, 400, normal); color: var(--theme-color-text_dark); @include transition-all(0.4s); &:before { display: none; } } .sc_testimonials_item_author { margin: 26px 0 0; max-width: none; padding: 0; background-color: transparent; color: var(--theme-color-text_dark); text-align: left; } .sc_testimonials_item_author_avatar { margin: 0 14px 0 0; width: 78px; height: 78px; position: relative; overflow: hidden; @include border-radius(50%); } .sc_testimonials_item_author_data { max-width: 100%; margin-bottom: 11px; margin-top: 11px; .sc_testimonials_item_author_title { margin: 0; @include transition-all(0.4s); } .sc_testimonials_item_author_subtitle, .sc_testimonials_item_author_title + .sc_testimonials_item_author_subtitle { margin-top: 0; color: var(--theme-color-alter_text); opacity: 0.8; @include transition-all(0.4s); } .sc_testimonials_item_author_title + .sc_testimonials_item_author_subtitle { margin-top: 6px; } } .slider_container.slider_pagination_pos_bottom .swiper-pagination-bullets .swiper-pagination-bullet, .slider_outer.slider_outer_pagination_pos_bottom .swiper-pagination-bullets .swiper-pagination-bullet, .slider_outer.slider_outer_pagination_pos_bottom_outside .swiper-pagination-bullets .swiper-pagination-bullet { margin: 0 8px; background: transparent; border-color: var(--theme-color-bd_color); } .swiper-pagination-custom .swiper-pagination-button.swiper-pagination-button-active, .sc_slider_controls.slider_pagination_style_bullets .slider_pagination_bullet.swiper-pagination-bullet-active, .sc_slider_controls.slider_pagination_style_bullets .slider_pagination_bullet:hover, .slider_container .slider_pagination_wrap .swiper-pagination-bullet.swiper-pagination-bullet-active, .slider_outer .slider_pagination_wrap .swiper-pagination-bullet.swiper-pagination-bullet-active, .slider_container .slider_pagination_wrap .swiper-pagination-bullet:hover, .slider_outer .slider_pagination_wrap .swiper-pagination-bullet:hover { border-color: var(--theme-color-text_link); background-color: var(--theme-color-text_link); } } /* Accent */ .sc_testimonials_accent { .sc_item_slider .sc_testimonials_item { @include box-shadow(none); } .sc_testimonials_item { position: relative; @include box-shadow(0 3px 30px 0 rgba(0, 0, 0, 0.04)); padding: 57px 50px 61px; height: auto; @include box-sizing(border-box); background-color: var(--theme-color-alter_bg_color); @include transition(transform 0.2s ease-out, color 0.2s ease-out); margin: 8px 0 0 0; @include transform(translate3d(0,0,0)); will-change: transform; &:before { content:'\e9eb'; font-family:$theme_icons; display: block; position: relative; width: 100%; height: 32px; line-height: 32px; font-size: 20px; font-weight: 400; text-align: left; color: var(--theme-color-text_link2); margin-bottom: 20px; @include transition-all(0.3s); } &:hover { @include transform(translate3d(0,-8px,0)); &:before { color: var(--theme-color-text_dark); } } } [class*="column"] .sc_testimonials_item_content, .sc_testimonials_item_content { text-align: left; @include font(19px, 1.78em, 400, normal); color: var(--theme-color-text_dark); @include transition-all(0.4s); &:before { display: none; } } .sc_testimonials_item_author { margin: 26px 0 0; max-width: none; padding: 0; background-color: transparent; color: var(--theme-color-text_dark); text-align: left; } .sc_testimonials_item_author_avatar { margin: 0 14px 0 0; width: 78px; height: 78px; position: relative; overflow: hidden; @include border-radius(50%); } .sc_testimonials_item_author_data { max-width: 100%; .sc_testimonials_item_author_title { margin: 0; @include transition-all(0.4s); } .sc_testimonials_item_author_subtitle, .sc_testimonials_item_author_title + .sc_testimonials_item_author_subtitle { margin-top: 0; color: var(--theme-color-alter_text); opacity: 0.8; @include transition-all(0.4s); } .sc_testimonials_item_author_title + .sc_testimonials_item_author_subtitle { margin-top: 6px; } } .slider_container.slider_pagination_pos_bottom .swiper-pagination-bullets .swiper-pagination-bullet, .slider_outer.slider_outer_pagination_pos_bottom .swiper-pagination-bullets .swiper-pagination-bullet, .slider_outer.slider_outer_pagination_pos_bottom_outside .swiper-pagination-bullets .swiper-pagination-bullet { margin: 0 8px; background: transparent; border-color: var(--theme-color-bd_color); } .swiper-pagination-custom .swiper-pagination-button.swiper-pagination-button-active, .sc_slider_controls.slider_pagination_style_bullets .slider_pagination_bullet.swiper-pagination-bullet-active, .sc_slider_controls.slider_pagination_style_bullets .slider_pagination_bullet:hover, .slider_container .slider_pagination_wrap .swiper-pagination-bullet.swiper-pagination-bullet-active, .slider_outer .slider_pagination_wrap .swiper-pagination-bullet.swiper-pagination-bullet-active, .slider_container .slider_pagination_wrap .swiper-pagination-bullet:hover, .slider_outer .slider_pagination_wrap .swiper-pagination-bullet:hover { border-color: var(--theme-color-text_link); background-color: var(--theme-color-text_link); } } /* Accent 2 */ .sc_testimonials_accent2 { .sc_item_slider .sc_testimonials_item { @include box-shadow(none); } .sc_testimonials_item { position: relative; @include box-shadow(0 3px 30px 0 rgba(0, 0, 0, 0.04)); padding: 45px 45px 40px 50px; height: auto; @include box-sizing(border-box); background-color: var(--theme-color-alter_bg_color); @include transition(transform 0.2s ease-out, color 0.2s ease-out); margin: 8px 0 0 0; will-change: transform; @include transform(translate3d(0,0,0)); &:before { content:'\e9eb'; font-family:$theme_icons; display: block; position: relative; width: 100%; height: 32px; line-height: 32px; font-size: 24px; font-weight: 400; text-align: left; color: var(--theme-color-text_link2); margin-bottom: 29px; @include transition-all(0.3s); } &:hover { @include transform(translate3d(0,-8px,0)); &:before { color: var(--theme-color-text_dark); } } } [class*="column"] .sc_testimonials_item_content, .sc_testimonials_item_content { text-align: left; @include font(19px, 1.78em, 400, normal); color: var(--theme-color-text_dark); @include transition-all(0.4s); &:before { display: none; } } .sc_testimonials_item_author { margin: 26px 0 0; max-width: none; padding: 0; background-color: transparent; color: var(--theme-color-text_dark); text-align: left; } .sc_testimonials_item_author_avatar { margin: 0 14px 0 0; width: 78px; height: 78px; position: relative; overflow: hidden; @include border-radius(50%); } .sc_testimonials_item_author_data { max-width: 100%; .sc_testimonials_item_author_title { margin: 0; @include transition-all(0.4s); } .sc_testimonials_item_author_subtitle, .sc_testimonials_item_author_title + .sc_testimonials_item_author_subtitle { margin-top: 0; color: var(--theme-color-alter_text); opacity: 0.8; @include transition-all(0.4s); } .sc_testimonials_item_author_title + .sc_testimonials_item_author_subtitle { margin-top: 6px; } } .slider_container.slider_pagination_pos_bottom .swiper-pagination-bullets .swiper-pagination-bullet, .slider_outer.slider_outer_pagination_pos_bottom .swiper-pagination-bullets .swiper-pagination-bullet, .slider_outer.slider_outer_pagination_pos_bottom_outside .swiper-pagination-bullets .swiper-pagination-bullet { margin: 0 8px; background: transparent; border-color: var(--theme-color-bd_color); } .swiper-pagination-custom .swiper-pagination-button.swiper-pagination-button-active, .sc_slider_controls.slider_pagination_style_bullets .slider_pagination_bullet.swiper-pagination-bullet-active, .sc_slider_controls.slider_pagination_style_bullets .slider_pagination_bullet:hover, .slider_container .slider_pagination_wrap .swiper-pagination-bullet.swiper-pagination-bullet-active, .slider_outer .slider_pagination_wrap .swiper-pagination-bullet.swiper-pagination-bullet-active, .slider_container .slider_pagination_wrap .swiper-pagination-bullet:hover, .slider_outer .slider_pagination_wrap .swiper-pagination-bullet:hover { border-color: var(--theme-color-text_link); background-color: var(--theme-color-text_link); } .slider_outer.slider_outer_pagination_pos_bottom_outside .swiper-pagination-bullets, .sc_item_slider.slider_outer_pagination_pos_bottom .swiper-pagination { margin-top: 2em; } } /* Creative */ .sc_testimonials_creative { [class*="column"] .sc_testimonials_item_content, .sc_testimonials_item_content { text-align: center; @include font(19px, 1.78em, 400, normal); color: var(--theme-color-text_dark); &:before { display: none; } } [class*="column"] .sc_testimonials_item_author, .sc_testimonials_item_author { margin: 34px 0 0; max-width: none; padding: 0; background-color: transparent; color: var(--theme-color-text_dark); text-align: center; &:before { font-size: 21px; line-height: 1.5em; color: var(--theme-color-text_link); content: '\e9eb'; font-family:$theme_icons; margin-bottom: 16px; display: inline-block; width: 100%; text-align: center; } } .sc_testimonials_item_top { height: 120px; text-align: center; margin: 0 0 45px 0; .sc_testimonials_item_author_avatar { margin: 0 auto; width: 120px; height: 120px; position: relative; overflow: hidden; @include border-radius(50%); display: inline-block; } } [class*="column"] .sc_testimonials_item_author_data, .sc_testimonials_item_author_data { border: none; padding: 0; max-width: 100%; text-align: center; .sc_testimonials_item_author_title { margin: 0; } .sc_testimonials_item_author_subtitle, .sc_testimonials_item_author_title + .sc_testimonials_item_author_subtitle { margin-top: 0; color: var(--theme-color-alter_text); opacity: 1; padding-bottom: 2px; } .sc_testimonials_item_author_title + .sc_testimonials_item_author_subtitle { margin-top: 6px; } } .slider_container .swiper-pagination-bullet, .slider_outer .swiper-pagination-bullet { width: 10px; border: 2px solid var(--theme-color-text_dark); opacity: 1; height: 10px; } .slider_container.slider_pagination_pos_bottom .swiper-pagination-bullets .swiper-pagination-bullet, .slider_outer.slider_outer_pagination_pos_bottom .swiper-pagination-bullets .swiper-pagination-bullet, .slider_outer.slider_outer_pagination_pos_bottom_outside .swiper-pagination-bullets .swiper-pagination-bullet { margin: 0 8px; } .slider_container.slider_controls_side .slider_controls_wrap > a.slider_prev { opacity: 1; margin-left: 0 !important; left: calc(50% - 152px) !important; text-align: left !important; } .slider_container.slider_controls_side .slider_controls_wrap > a.slider_next { opacity: 1; margin-right: 0 !important; right: calc(50% - 152px) !important; text-align: right !important; } .slider_container.slider_controls_side .slider_controls_wrap > a { width: 40px; height: 40px; line-height: 40px; background: none !important; color: var(--theme-color-text_light) !important; top: 40px; margin-top: 0; &:before { font-size: 16px; } &:hover { color: var(--theme-color-text_link) !important; } } } /* Fashion */ .sc_testimonials_fashion { .slider_container:not(.slider_controller_container):not(.slider_multi):not(.slider_type_images), .slider_container:not(.slider_controller_container):not(.slider_multi):not(.slider_type_images) .slider-slide { min-height: auto !important; } .info_title { display: none; } .slider-pagination-button .img_wrap { @include border-radius(50%); overflow: hidden; display: block; } .slider_outer_controls_bottom.slider_outer_pagination_pos_bottom_outside > .slider_controls_wrap { display: inline-block; width: 100%; text-align: left; } .slider_outer_pagination_custom.slider_outer_pagination_pos_bottom_outside { padding-left: 35%; .swiper-pagination-custom { margin: 0; width: 33%; position: absolute; left: 0; top: 0; text-align: left; } } .swiper-pagination-custom .swiper-pagination-button:hover, .swiper-pagination-custom .swiper-pagination-button.swiper-pagination-button-active { img { opacity: 1 !important; } .img_wrap:before { opacity: 1 !important; } } .swiper-pagination-custom .swiper-pagination-button.swiper-pagination-button-active { @include transform(none); .info_title { opacity: 1 !important; } } .slider_outer.slider_outer_pagination_pos_bottom_outside .swiper-pagination-custom { min-height: 180px; height: auto; line-height: 1.2em; margin-top: 7px; } .slider_outer.slider_outer_pagination_pos_bottom_outside.slider_outer_pagination_custom { padding-bottom: 0 !important; } .slider_outer_pagination_pos_bottom_outside .swiper-pagination-custom .slider-pagination-button { text-align: left; margin: 0 0 10px 0; width: 138px; padding-right: 5px; height: auto; border: none; vertical-align: top; display: inline-block; opacity: 1; @include border-radius(0); background-color: transparent; will-change: transform; @include transform(none); @include transition-all(0.3s, ease-out); backface-visibility: hidden; -webkit-backface-visibility: hidden; img { opacity: 0.5; display: block; @include border-radius(50%); overflow: hidden; height: 103px; width: 103px; @include transition-all(0.3s); } .img_wrap { position: relative; display: block; width: auto; float: left; overflow: visible; &:before { content:'\e9cb'; font-family:$theme_icons; display: block; @include abs-rb(-3px,-1px); width: 30px; height: 30px; line-height: 32px; overflow: hidden; font-size: 7px; font-weight: 400; text-align: center; text-indent: 1px; @include border-radius(50%); background-color: var(--theme-color-text_link); color: var(--theme-color-inverse_link); opacity: 0; @include transition-all(0.3s); } + .info_title { padding-top: 27px; opacity: 0; width: 100%; } } .info_title { display: inline-block; width: 100%; text-align: left; @include transition-all(0.3s); } } .slider_outer_controls_bottom > .slider_controls_wrap { margin-top: 3em; } .slider_prev + .slider_next, .slider_prev + .slider_pagination_wrap, .slider_next + .slider_pagination_wrap { margin-left: 0.5em; } .slider_controls_wrap > a.slider_next, .slider_controls_wrap > a.slider_prev { border: 1px solid var(--theme-color-bd_color); height: 56px; width: 56px; line-height: 55px; padding: 0; @include box-sizing(border-box); @include border-radius(50%); background-color: transparent !important; color: var(--theme-color-text_dark); text-align: center; &:before { font-size: 16px; } &:hover { color: var(--theme-color-text_link); } } .slider_container.slider_controls_side .slider_controls_wrap > .slider_prev { opacity: 1; margin-left: 0; left: 0; text-align: center; } .slider_container.slider_controls_side .slider_controls_wrap > .slider_next { opacity: 1; margin-right: 0; right: 0; text-align: center; } .sc_testimonials_item_author_subtitle { color: var(--theme-color-text_light); opacity: 1; padding-bottom: 2px; display: block; } .sc_testimonials_item_author_title + .sc_testimonials_item_author_subtitle { margin-top: 6px; } .sc_testimonials_item_author, [class*="column"] .sc_testimonials_item_author { text-align: left; margin: 30px 0 0 0; padding: 0; } .sc_testimonials_item_content, [class*="column"] .sc_testimonials_item_content { @include font(24px, 1.5em, 400); text-align: left; color: var(--theme-color-text_dark); p + p { margin-top: 1.5em; } } .sc_testimonials_item_content:before { display: none; } } /* Alter */ .sc_testimonials_alter { .slider_container.slider_one .sc_testimonials_item { padding: 0 15%; } [class*="column"] .sc_testimonials_item_content, .sc_testimonials_item_content { text-align: center; @include font(24px, 1.6em, 400, normal); color: var(--theme-color-text_dark); &:before { display: none; } } [class*="column"] .sc_testimonials_item_author, .sc_testimonials_item_author { margin: 32px 0 0; max-width: none; padding: 0; background-color: transparent; color: var(--theme-color-text_dark); text-align: center; &:before { font-size: 21px; line-height: 1.5em; color: var(--theme-color-text_link2); content: '\e9eb'; font-family:$theme_icons; margin-bottom: 22px; display: inline-block; width: 100%; text-align: center; } } .sc_testimonials_item_top { height: 103px; text-align: center; margin: 0 0 38px 0; .sc_testimonials_item_author_avatar { margin: 0 auto; width: 103px; height: 103px; position: relative; overflow: hidden; @include border-radius(50%); display: inline-block; } } [class*="column"] .sc_testimonials_item_author_data, .sc_testimonials_item_author_data { border: none; padding: 0; max-width: 100%; text-align: center; .sc_testimonials_item_author_title { margin: 0; } .sc_testimonials_item_author_subtitle, .sc_testimonials_item_author_title + .sc_testimonials_item_author_subtitle { margin-top: 0; color: var(--theme-color-alter_text); opacity: 1; padding-bottom: 2px; } .sc_testimonials_item_author_title + .sc_testimonials_item_author_subtitle { margin-top: 6px; } } .slider_container .swiper-pagination-bullet, .slider_outer .swiper-pagination-bullet { width: 10px; border: 2px solid var(--theme-color-text_dark); opacity: 1; height: 10px; } .slider_container.slider_pagination_pos_bottom .swiper-pagination-bullets .swiper-pagination-bullet, .slider_outer.slider_outer_pagination_pos_bottom .swiper-pagination-bullets .swiper-pagination-bullet, .slider_outer.slider_outer_pagination_pos_bottom_outside .swiper-pagination-bullets .swiper-pagination-bullet { margin: 0 8px; } .slider_container.slider_controls_side .slider_controls_wrap > .slider_prev { opacity: 1; margin-left: 0 !important; left: 0 !important; text-align: center !important; } .slider_container.slider_controls_side .slider_controls_wrap > .slider_next { opacity: 1; margin-right: 0 !important; right: 0 !important; text-align: center !important; } .slider_controls_wrap > a { text-align: center !important; width: 56px !important; height: 56px !important; line-height: 54px !important; background: none !important; @include border-radius(50% !important); border: 1px solid var(--theme-color-bd_color) !important; color: var(--theme-color-text_dark) !important; &:before { font-size: 16px !important; } &:hover { color: var(--theme-color-text_link) !important; } } .slider_container.slider_pagination_pos_bottom .swiper-pagination-bullets .swiper-pagination-bullet, .slider_outer.slider_outer_pagination_pos_bottom .swiper-pagination-bullets .swiper-pagination-bullet, .slider_outer.slider_outer_pagination_pos_bottom_outside .swiper-pagination-bullets .swiper-pagination-bullet { margin: 0 8px; background: transparent; border-color: #E5E3E0; } .swiper-pagination-custom .swiper-pagination-button.swiper-pagination-button-active, .sc_slider_controls.slider_pagination_style_bullets .slider_pagination_bullet.swiper-pagination-bullet-active, .sc_slider_controls.slider_pagination_style_bullets .slider_pagination_bullet:hover, .slider_container .slider_pagination_wrap .swiper-pagination-bullet.swiper-pagination-bullet-active, .slider_outer .slider_pagination_wrap .swiper-pagination-bullet.swiper-pagination-bullet-active, .slider_container .slider_pagination_wrap .swiper-pagination-bullet:hover, .slider_outer .slider_pagination_wrap .swiper-pagination-bullet:hover { border-color: var(--theme-color-text_link); background-color: var(--theme-color-text_link); } .slider_outer.slider_outer_pagination_pos_bottom_outside .swiper-pagination-bullets, .sc_item_slider.slider_outer_pagination_pos_bottom .swiper-pagination { margin-top: 2em; } } /* Alter 2 */ .sc_testimonials_alter2 { .slider_container.slider_one .sc_testimonials_item { padding: 0 15%; } [class*="column"] .sc_testimonials_item_content, .sc_testimonials_item_content { text-align: left; @include font(19px, 1.78em, 400, normal); color: var(--theme-color-text_dark); &:before { display: none; } } [class*="column"] .sc_testimonials_item_author, .sc_testimonials_item_author { margin: 13px 0 0; max-width: none; padding: 0; background-color: transparent; color: var(--theme-color-text_dark); text-align: left; &:before { font-size: 21px; line-height: 1.5em; color: var(--theme-color-text_link2); content: '\e9eb'; font-family:$theme_icons; margin-bottom: 22px; display: inline-block; width: 100%; text-align: left; padding-left: 1px; } } .sc_testimonials_item_top { height: 100px; text-align: left; margin: 0 0 27px 0; .sc_testimonials_item_author_avatar { margin: 0 auto; width: 100px; height: 100px; position: relative; overflow: hidden; @include border-radius(50%); display: inline-block; } } [class*="column"] .sc_testimonials_item_author_data, .sc_testimonials_item_author_data { border: none; padding: 0; max-width: 100%; text-align: left; .sc_testimonials_item_author_title { margin: 0; } .sc_testimonials_item_author_subtitle, .sc_testimonials_item_author_title + .sc_testimonials_item_author_subtitle { margin-top: 0; color: var(--theme-color-alter_text); opacity: 1; padding-bottom: 2px; } .sc_testimonials_item_author_title + .sc_testimonials_item_author_subtitle { margin-top: 6px; } } .slider_container .swiper-pagination-bullet, .slider_outer .swiper-pagination-bullet { width: 10px; border: 2px solid var(--theme-color-text_dark); opacity: 1; height: 10px; } .slider_container.slider_pagination_pos_bottom .swiper-pagination-bullets .swiper-pagination-bullet, .slider_outer.slider_outer_pagination_pos_bottom .swiper-pagination-bullets .swiper-pagination-bullet, .slider_outer.slider_outer_pagination_pos_bottom_outside .swiper-pagination-bullets .swiper-pagination-bullet { margin: 0 8px; } .slider_container.slider_controls_side .slider_controls_wrap > .slider_prev { opacity: 1; margin-left: 0; left: 0; text-align: center; } .slider_container.slider_controls_side .slider_controls_wrap > .slider_next { opacity: 1; margin-right: 0; right: 0; text-align: center; } .slider_controls_wrap > a { text-align: center !important; width: 56px !important; height: 56px !important; line-height: 52px !important; background: none !important; @include border-radius(50% !important); border: 1px solid var(--theme-color-bd_color) !important; color: var(--theme-color-text_dark) !important; &:before { font-size: 16px !important; } &:hover { color: var(--theme-color-text_link) !important; } } .slider_container.slider_pagination_pos_bottom .swiper-pagination-bullets .swiper-pagination-bullet, .slider_outer.slider_outer_pagination_pos_bottom .swiper-pagination-bullets .swiper-pagination-bullet, .slider_outer.slider_outer_pagination_pos_bottom_outside .swiper-pagination-bullets .swiper-pagination-bullet { margin: 0 8px; background: transparent; border-color: #E5E3E0; } .swiper-pagination-custom .swiper-pagination-button.swiper-pagination-button-active, .sc_slider_controls.slider_pagination_style_bullets .slider_pagination_bullet.swiper-pagination-bullet-active, .sc_slider_controls.slider_pagination_style_bullets .slider_pagination_bullet:hover, .slider_container .slider_pagination_wrap .swiper-pagination-bullet.swiper-pagination-bullet-active, .slider_outer .slider_pagination_wrap .swiper-pagination-bullet.swiper-pagination-bullet-active, .slider_container .slider_pagination_wrap .swiper-pagination-bullet:hover, .slider_outer .slider_pagination_wrap .swiper-pagination-bullet:hover { border-color: var(--theme-color-text_link); background-color: var(--theme-color-text_link); } .sc_item_slider.slider_outer_pagination_pos_bottom { padding-bottom: 3.6em; } } /* Decoration */ .sc_testimonials_decoration { .slider_container.slider_controls_side .slider_controls_wrap > .slider_prev { opacity: 1; margin-left: 0 !important; left: 0 !important; text-align: left; } .slider_container.slider_controls_side .slider_controls_wrap > .slider_next { opacity: 1; margin-right: 0 !important; right: 0 !important; text-align: right; } .slider_container.slider_controls_side .slider_controls_wrap > a { width: 40px; height: 40px; line-height: 40px; background: none !important; color: var(--theme-color-text_dark) !important; &:before { font-size: 22px; } &:hover { color: var(--theme-color-text_link) !important; } } .slider_outer.slider_outer_pagination_pos_bottom.slider_outer_pagination_custom .slider_controls_wrap > a { margin-top: 2em; } .slider_container.slider_one .sc_testimonials_item { padding: 0 15%; } .sc_testimonials_item_author_subtitle { color: var(--theme-color-text_dark); opacity: 0.8; padding-bottom: 2px; } .sc_testimonials_item_author_title + .sc_testimonials_item_author_subtitle { margin-top: 7px; } .sc_testimonials_item_author, [class*="column"] .sc_testimonials_item_author { text-align: center; margin: 34px 0 0 0; padding: 0; .sc_testimonials_item_author_data { max-width: 100%; } } .sc_testimonials_item_content, [class*="column"] .sc_testimonials_item_content { @include font(24px, 1.5em, 400); text-align: center; color: var(--theme-color-text_dark); } .sc_testimonials_item_content:before { margin-bottom: 42px; font-size: 22px; line-height: 1.3em; content:'\e9eb'; font-family:$theme_icons; will-change: color; color: var(--theme-color-text_link2); @include transition(color .3s ease-out); } } /* Chit */ .sc_testimonials_chit { .sc_testimonials_rating_stars_default, .sc_testimonials_rating_stars_hover { color: #FFC107; } .sc_testimonials_item_author_rating { line-height: 1; .sc_testimonials_rating { height: 1em; font-size: 1.1em; } + .sc_testimonials_item_content { margin-top: 36px; } } .sc_testimonials_item { position: relative; padding: 74px 40px; height: auto; @include box-sizing(border-box); background-color: var(--theme-color-alter_bg_color); @include transition-all(0.3s); margin-bottom: 0; margin-top: 0; &:before { display: none; } } [class*="column"] .sc_testimonials_item_content, .sc_testimonials_item_content { text-align: left; @include font(19px, 1.53em, inherit, normal); color: var(--theme-color-text); @include transition-all(0.3s); &:before { display: none; } } .sc_testimonials_item_author { margin: 60px 0 0; max-width: none; padding: 0; background-color: transparent; color: var(--theme-color-text_dark); text-align: left; } .sc_testimonials_item_author_data { max-width: 100%; .sc_testimonials_item_author_title { margin: 0; } .sc_testimonials_item_author_subtitle, .sc_testimonials_item_author_title + .sc_testimonials_item_author_subtitle { margin-top: 0; color: var(--theme-color-text_light); } .sc_testimonials_item_author_title + .sc_testimonials_item_author_subtitle { margin-top: 10px; } } .slider_container.slider_pagination_pos_bottom .swiper-pagination-bullets .swiper-pagination-bullet, .slider_outer.slider_outer_pagination_pos_bottom .swiper-pagination-bullets .swiper-pagination-bullet, .slider_outer.slider_outer_pagination_pos_bottom_outside .swiper-pagination-bullets .swiper-pagination-bullet { margin: 0 6px; background-color: #E2E1E0; border-color: #E2E1E0; opacity: 1; width: 8px; height: 8px; } .swiper-pagination-custom .swiper-pagination-button.swiper-pagination-button-active, .sc_slider_controls.slider_pagination_style_bullets .slider_pagination_bullet.swiper-pagination-bullet-active, .sc_slider_controls.slider_pagination_style_bullets .slider_pagination_bullet:hover, .slider_container .slider_pagination_wrap .swiper-pagination-bullet.swiper-pagination-bullet-active, .slider_outer .slider_pagination_wrap .swiper-pagination-bullet.swiper-pagination-bullet-active, .slider_container .slider_pagination_wrap .swiper-pagination-bullet:hover, .slider_outer .slider_pagination_wrap .swiper-pagination-bullet:hover { border-color: var(--theme-color-text_link); background-color: var(--theme-color-text_link); } .slider_outer.slider_outer_pagination_pos_bottom_outside .swiper-pagination-bullets, .sc_item_slider.slider_outer_pagination_pos_bottom .swiper-pagination { margin-top: 2.4em; } } /* Bred */ .sc_testimonials_bred { .sc_testimonials_item { padding: 61px 30px 55px; height: auto; @include box-sizing(border-box); background-color: var(--theme-color-alter_bg_color); @include box-shadow(0 3px 40px 0 rgba(0, 0, 0, 0.05)); } .sc_item_slider .sc_testimonials_item { @include box-shadow(none); } [class*="column"] .sc_testimonials_item_content, .sc_testimonials_item_content { text-align: center; @include font(1rem, 1.7em, 400, normal); color: var(--theme-color-text_dark); &:before { display: none; } } [class*="column"] .sc_testimonials_item_author, .sc_testimonials_item_author { margin: 25px 0 0; max-width: none; padding: 0; background-color: transparent; color: var(--theme-color-text_dark); text-align: center; } .sc_testimonials_item_author_avatar { overflow: visible; margin: 0 auto 32px; width: 93px; height: 93px; position: relative; display: block; &:before { content:'\e9cb'; font-family:$theme_icons; display: block; @include abs-rb(-1px,-1px); width: 30px; height: 30px; line-height: 32px; overflow: hidden; font-size: 7px; font-weight: 400; text-align: center; text-indent: 1px; @include border-radius(50%); background-color: var(--theme-color-text_link); color: var(--theme-color-inverse_link); } img { overflow: hidden; @include border-radius(50%); } } .sc_testimonials_item_author_data { max-width: 100%; .sc_testimonials_item_author_title { margin: 0; } .sc_testimonials_item_author_subtitle, .sc_testimonials_item_author_title + .sc_testimonials_item_author_subtitle { margin-top: 0; color: var(--theme-color-text); opacity: 1; } .sc_testimonials_item_author_title + .sc_testimonials_item_author_subtitle { margin-top: 6px; } } } /* --- Controls --- */ /* Bullets */ .sc_slider_controls.sc_slider_controls_default.slider_pagination_style_bullets .slider_pagination_bullet { margin: 0 8px; border-color: var(--theme-color-text_dark); background-color: transparent; &.slider_pagination_bullet_active, &.swiper-pagination-button-active, &:hover { border-color: var(--theme-color-text_link); background-color: var(--theme-color-text_link); } } .sc_slider_controls.sc_slider_controls_default.slider_pagination_style_bullets { &.sc_align_left .slider_controls_wrap:not(.with_prev):not(.with_next) .slider_pagination_wrap { text-align: left; justify-content: left; margin-left: -8px; } .slider_controls_wrap:not(.with_prev):not(.with_next) .slider_pagination_wrap { height: 20px; } } /* Default */ .sc_slider_controls.sc_slider_controls_default { .slider_prev + .slider_next, .slider_prev + .slider_pagination_wrap, .slider_next + .slider_pagination_wrap { margin-left: 0.5em; } .slider_controls_wrap > a.slider_next, .slider_controls_wrap > a.slider_prev { border: 1px solid var(--theme-color-bd_color); height: 56px; width: 56px; line-height: 53px; padding: 0; @include box-sizing(border-box); @include border-radius(50%); background-color: transparent; color: var(--theme-color-text_dark); flex-shrink: 0; &:before { font-size: 16px; } &.with_title { @include border-radius(5px); padding: 0 15px; width: auto; } &:hover { color: var(--theme-color-text_link); } } } /* Light */ .sc_slider_controls.sc_slider_controls_light { .slider_prev + .slider_next, .slider_prev + .slider_pagination_wrap, .slider_next + .slider_pagination_wrap { margin-left: 0.5em; } .slider_controls_wrap > a.slider_next:before { content: '\e9e6'; letter-spacing: -3px; } .slider_controls_wrap > a.slider_prev:before { content: '\e9e5'; letter-spacing: 2px; } .slider_controls_wrap > a.slider_next, .slider_controls_wrap > a.slider_prev { border: 1px solid var(--theme-color-bd_color); height: 56px; width: 56px; min-width: 56px; line-height: 52px; padding: 0; @include box-sizing(border-box); @include border-radius(50%); background-color: transparent; color: var(--theme-color-text_dark); &:before { font-size: 14px; } &.with_title { @include border-radius(5px); padding: 0 15px; width: auto; } &:hover { color: var(--theme-color-text_link); } } } /* Alter */ .sc_slider_controls.sc_slider_controls_alter { .slider_controls_wrap:not(.with_prev):not(.with_next) .slider_pagination_wrap { text-align: left; @include flex-justify-content(flex-start); } .slider_pagination_bullet { position: relative; z-index: 1; margin: 0 15px; border: none; background-color: var(--theme-color-alter_bg_color); &.swiper-pagination-bullet-active { background-color: var(--theme-color-alter_link); &:after { content: ''; display: block; @include box(20px, 20px); @include abs-cc; @include border-box; @include border-radius(50%); background-color: var(--theme-color-alter_link_02); } } } .slider_pagination_bullet:first-child { margin-left: 0; } .slider_pagination_bullet:last-child { margin-right: 0; } .slider_prev + .slider_next, .slider_prev + .slider_pagination_wrap, .slider_next + .slider_pagination_wrap { margin-left: 5px; } .slider_controls_wrap > a.slider_next, .slider_controls_wrap > a.slider_prev { border: 1px solid var(--theme-color-bd_color); height: 38px; width: 38px; line-height: 38px; padding: 0; @include content-box; @include border-radius(50%); background-color: var(--theme-color-alter_bg_color); color: var(--theme-color-alter_dark); &:before { font-size: 14px; } &.with_title { @include border-radius(5px); padding: 0 15px; width: auto; } &:hover { color: var(--theme-color-text_link); } } } /* Socials Default */ .sc_socials.sc_socials_default { .socials_wrap { margin-bottom: -7px; .social_item { display: inline-block; vertical-align: top; line-height: inherit; text-align: center; margin: 0 7px 7px 0; .social_icon { position: relative; display: block; background-size: 100%; background-position: top center; overflow: hidden; width: 45px; height: 45px; line-height: 43px; font-size: 16px; text-align: center; @include border-radius(50%); @include box-sizing(border-box); border: 1px solid var(--theme-color-text_dark_015); color: var(--theme-color-text_dark); background-color: transparent; } &:hover .social_icon { background-color: transparent; color: var(--theme-color-text_link); &[class*="facebook"] { color: #3b5998 !important; } &[class*="twitter"] { color: #1da1f2 !important; } &[class*="dribble"], &[class*="dribbble"] { color: #ea4c89 !important; } &[class*="instagram"] { color: #C862DC !important; } &[class*="youtube"] { color: #FF0000 !important; } &[class*="deviantart"] { color: #00E59B !important; } &[class*="discord"] { color: #5562EA !important; } } } } } /* Toggle filter */ .sc_style_toggle { .sc_blogger { .sc_item_filters_wrap { .sc_item_filters { @include flex; flex-direction: row; justify-content: flex-start; flex-wrap: wrap; align-items: flex-start; width: var(--theme-var-page); margin-left: auto; margin-right: auto; margin-bottom: 1.7rem; opacity: 0; &.inited { opacity: 1; } &.sc_item_filters_align_left { .list_wrap { .sc_item_filters_tabs { justify-content: flex-start; } } .sc_item_filters_header { text-align: left; } } &.sc_item_filters_align_right { .list_wrap { .sc_item_filters_tabs { justify-content: flex-start; } } .sc_item_filters_header { text-align: right; } } &.sc_item_filters_align_center { .list_wrap { .sc_item_filters_tabs { justify-content: flex-start; } } .sc_item_filters_header { text-align: center; } } .sc_item_filters_header { flex-basis: 100%; order: 1; } .title_wrap { font-size: 13px; font-weight: 700; text-transform: uppercase; letter-spacing: 1.4px; order: 2; padding-right: 3.6rem; margin-top: 2px; .toggle_title { color: var(--theme-color-text_dark); } .active_tab { cursor: pointer; color: var(--theme-color-text_link3); } } .list_wrap { overflow: hidden; order: 3; .sc_item_filters_tabs { margin-bottom: 0 !important; transform: translateX(-100%); transition: transform 1s ease; li { padding: 0 15px; a { text-transform: uppercase; color: var(--theme-color-text_dark); padding-bottom: 0; font-size: 13px; font-weight: 700; letter-spacing: 1.4px; border-bottom: none; &:after { display: none; } &:hover { color: var(--theme-color-text_link3); } } &.sc_item_filters_tabs_active { a { color: var(--theme-color-text_link3); } } } &.active { transform: translateX(0); transition: transform 1s ease; } } } } } } } /* --- Portfolio --- */ /* Default filter */ .sc_blogger .sc_blogger_filters .sc_item_filters_tabs li a { display: inline-block; } .sc_blogger_lay_portfolio, .sc_blogger_lay_portfolio_grid { .sc_blogger_filters { margin-bottom: 2.4em; &.sc_item_filters_align_left, &.sc_item_filters_align_right { border-bottom: none; padding-bottom: 0; } &.sc_item_filters_align_right.sc_item_filters_no_title .sc_item_filters_tabs li:first-child { padding-left: 0; } .sc_item_filters_tabs { li { padding: 0 13px; a { font-size: 13px; font-weight: 700; text-transform: uppercase; letter-spacing: 1.4px; color: var(--theme-color-alter_text); padding-bottom: 5px; position: relative; &:after { content: ''; position: absolute; bottom: 0; left: auto; right: 0; height: 2px; width: 0; background-color: var(--theme-color-alter_link); transition: all 0.3s; } &:hover { color: var(--theme-color-alter_dark); &:after { width: 100%; left: 0; right: auto; transition: all 0.3s; } } } &.sc_item_filters_tabs_active { a { border: none; color: var(--theme-color-alter_dark); &:after { width: 100%; left: 0; right: auto; transition: all 0.3s; } } } } } } } /* Pagination ( Portfolio and Blogger Portfolio ) */ .sc_portfolio, .sc_blogger.sc_blogger_portfolio { .slider_container .swiper-pagination-bullet, .slider_outer .swiper-pagination-bullet { width: 8px; height: 8px; } .sc_slider_controls.slider_pagination_style_bullets .slider_pagination_bullet, .slider_container .slider_pagination_wrap .swiper-pagination-bullet, .slider_outer .slider_pagination_wrap .swiper-pagination-bullet, .swiper-pagination-custom .swiper-pagination-button { border-color: var(--theme-color-alter_bd_color); background-color: var(--theme-color-alter_bd_color); &.swiper-pagination-bullet-active { border-color: var(--theme-color-text_link); background-color: var(--theme-color-text_link); } } .slider_outer.slider_outer_pagination_pos_bottom_outside .swiper-pagination-bullets { margin-top: 2.2em; } } /* Default and Extra Portfolio Styles */ .sc_blogger_excerpt_default .post_layout_excerpt { margin-bottom: 0 !important; } .sc_blogger_excerpt_default .sc_item_posts_container .post_layout_excerpt { margin-bottom: 0.4em !important; } .sc_portfolio_eclipse .sc_portfolio_content > .sc_portfolio_item + .sc_portfolio_item, .sc_portfolio_extra .sc_portfolio_content > .sc_portfolio_item + .sc_portfolio_item, .sc_portfolio_default .sc_portfolio_content > .sc_portfolio_item + .sc_portfolio_item, .sc_blogger_portfolio_default > .sc_blogger_content > .column-1_1 + .column-1_1, .sc_blogger_classic_default > .sc_blogger_content > .column-1_1 + .column-1_1 { margin-top: 1.5em; } .sc_blogger_portestate_default > .sc_blogger_content .sc_blogger_item_portestate_default + .sc_blogger_item_portestate_default, .sc_blogger_lay_portfolio > .sc_blogger_content .sc_blogger_item_lay_portfolio + .sc_blogger_item_lay_portfolio { margin-top: 2em; } .sc_portfolio { &.sc_portfolio_default { .slider_width_auto & { .sc_portfolio_slider { .slider_container { .slider-wrapper { .swiper-slide { .sc_portfolio_item { .post_featured_bg { background-position: center center; background-size: cover; &:before { padding-top: 15rem; } } } &:nth-child(odd) { width: 35% !important; } &:nth-child(even) { width: 65% !important; } } &.sc_item_columns_2 { .swiper-slide { .post_featured_bg { &:before { padding-top: 24.8rem; } } } } &.sc_item_columns_3 { .swiper-slide { .post_featured_bg { &:before { padding-top: 20rem; } } } } &.sc_item_columns_4 { .swiper-slide { .post_featured_bg { &:before { padding-top: 18rem; } } } } &.sc_item_columns_4, &.sc_item_columns_5, &.sc_item_columns_6 { .sc_portfolio_item { .post_featured { .post_info { bottom: 20px; left: 0; padding: 13px 18px 11px; .post_title { font-size: 1.1rem; } } } } } } } } } .sc_portfolio_slider { .slider_container { .slider-wrapper { .swiper-slide { .sc_portfolio_item { .post_featured_bg { background-position: center center; background-size: cover; &:before { padding-top: 20rem; } } } } } } } // video autoplay & without thumb > div:not([class*="masonry"]) { .post_featured.with_video_autoplay { &:before { content: ''; display: inline-block; width: 0; vertical-align: top; margin-left: -0.3em; } > .with_video_autoplay { @include abs-cover(3); iframe { height: 100% !important; background-color: #000; } .mejs-layers, .mejs-controls { display: none; } video { object-fit: cover; height: 100% !important; } .with_video_autoplay, .video_frame, .wp-video, .mejs-container, .mejs-mediaelement { height: 100% !important; } } } } .sc_portfolio_item .post_featured { overflow: hidden; position: relative; > a { position: absolute; width: 100%; height: 100%; top: 0; left: 0; z-index: 1; } &.with_video_autoplay, &.post_featured_bg { background-position: center center; background-size: cover; &:before { padding-top: 20rem; } } .mask { display: none; } .post_info { width: auto; max-width: calc(100% - 30px); height: auto; top: auto; right: auto; bottom: 27px; left: 0; padding: 23px 28px 21px; background-color: var(--theme-color-bg_color); @include transform(translateX(-100%) translateZ(0)); transition: all 0.3s; .post_title { font-size: 1.33rem; line-height: 1.2em; letter-spacing: 0; text-transform: uppercase; font-weight: 600; a { color: var(--theme-color-text_dark) !important; } } .post_meta .post_categories { font-size: 16px; a { color: var(--theme-color-alter_text) !important; } } } &:hover { .post_info { @include transform(translateX(0) translateZ(0)); transition: all 0.7s; } } } } &.sc_portfolio_extra { .slider_width_auto & { .sc_portfolio_slider { .slider_container { .slider-wrapper { .swiper-slide { .sc_portfolio_item { .post_featured_bg { background-position: center center; background-size: cover; &:before { padding-top: 17rem; } } } &:nth-child(odd) { width: 45% !important; } &:nth-child(even) { width: 55% !important; } //&:nth-child(3n+1) { // width: 40% !important; //} //&:nth-child(3n+3), //&:nth-child(3n+2) { // width: 60% !important; //} } &.sc_item_columns_2 { .swiper-slide { .post_featured_bg { &:before { padding-top: 28.66rem; } } } } &.sc_item_columns_3 { .post_featured_bg { &:before { padding-top: 22rem; } } } &.sc_item_columns_4 { .post_featured_bg { &:before { padding-top: 20rem; } } } &.sc_item_columns_4, &.sc_item_columns_5, &.sc_item_columns_6 { .sc_portfolio_item { .post_featured { .post_info { bottom: 10px; left: 10px; .post_title { font-size: 1.1rem; } } } } } } } } } .sc_portfolio_slider { .slider_container { .slider-wrapper { .swiper-slide { .sc_portfolio_item { .post_featured_bg { background-position: center center; background-size: cover; &:before { padding-top: 24rem; } } } } } } } .trx_addons_columns_wrap { margin-right: -16px; > [class*="trx_addons_column-"] { padding-right: 16px; } &.columns_padding_bottom { > [class*="trx_addons_column-"] { padding-bottom: 16px; } &.columns_in_single_row { > [class*="trx_addons_column-"] { padding-bottom: 16px; } } } } .sc_portfolio_item { .post_featured { overflow: hidden; position: relative; > a { position: absolute; width: 100%; height: 100%; top: 0; left: 0; z-index: 1; } &.post_featured_bg { background-position: center center; background-size: cover; margin: 0; &:before { padding-top: 100%; } } .mask { display: none; } .post_info { width: auto; max-width: calc(100% - 80px); height: auto; top: auto; right: auto; bottom: 40px; left: 40px; padding: 0; background-color: transparent; .post_title { font-size: 1.33rem; line-height: 1.25em; letter-spacing: 0; font-weight: 600; padding: 10px 22px; background-color: #191615; transform: translateX(-101%); transition: all 0.3s; transition-duration: 0.3s; transition-delay: 0ms; a { color: #ffffff !important; } } .post_meta { margin-top: 5px; transform: translateX(-101%); transition: all 0.3s; transition-delay: 50ms; transition-duration: 0.3s; .post_categories { font-size: 16px; line-height: 1.4em; padding: 5px 18px 7px; background-color: #191615; max-width: 100%; a { color: #ffffff !important; } } } } &:hover { .post_info { .post_title { transform: translateX(0); transition: all 0.7s ease; transition-delay: 0ms; transition-duration: 0.5s; } .post_meta { transform: translateX(0); transition: all 0.7s ease; transition-delay: 50ms; transition-duration: 0.5s; } } } } } .trx_addons_column-1_5, .trx_addons_column-1_6, .trx_addons_column-1_3, .trx_addons_column-1_4 { .sc_portfolio_item { .post_info { left: 30px; bottom: 30px; max-width: calc(100% - 60px); } } } } &.sc_portfolio_eclipse { .sc_portfolio_item { .post_featured { overflow: hidden; position: relative; margin-bottom: 0; > a { position: absolute; top: 0; left: 0; width: 100%; height: 100%; z-index: 7; } .mask { display: block; background-color: var(--theme-color-inverse_dark); opacity: 0; transition-delay: 300ms; transition: 300ms; transition-duration: 300ms; } .post_info { width: calc(100% - 40px); height: calc( 100% - 40px ); top: 20px; right: 20px; bottom: 20px; left: 20px; padding: 0; background-color: transparent; @include flex; flex-direction: column; justify-content: center; align-items: center; .post_title { font-size: 1.33rem; line-height: 1.25em; letter-spacing: 0; font-weight: 600; color: #ffffff !important; overflow: hidden; text-align: center; a { transform: translateY(100%); transition-delay: 150ms; transition: 300ms; transition-duration: 400ms; color: #ffffff !important; margin-left: 0; overflow: hidden; padding-bottom: 2px; text-overflow: ellipsis; max-width: 100%; display: -webkit-box; -webkit-line-clamp: 3; -webkit-box-orient: vertical; display: -moz-box; -moz-line-clamp: 3; -moz-box-orient: vertical; line-clamp: 3; box-orient: vertical; } } .post_meta { overflow: hidden; .post_categories { font-size: 16px; line-height: 1.4em; color: #ffffff !important; transform: translateY(100%); transition-delay: 0ms; transition: 300ms; transition-duration: 400ms; a { color: #ffffff !important; } } } } &:hover { .mask { transition: all 0.3s; opacity: 0.95; transition-duration: 300ms; } .post_info { .post_title { a { transform: translateY(0); transition-duration: 500ms; } } .post_meta { .post_categories { transform: translateY(0); transition-duration: 500ms; } } } } } } } &.sc_portfolio_band { .sc_portfolio_item { @include flex; flex-direction: row; flex-wrap: nowrap; align-items: stretch; .post_featured { flex-basis: 49%; flex-shrink: 0; margin-bottom: 0; } .post_content_wrap { box-sizing: border-box; padding: 2.2em 2.2em 1.9em; display: -webkit-flex; @include flex; flex-direction: column; justify-content: center; align-content: flex-start; align-self: center; flex-basis: 51%; max-width: 51%; .post_title { margin-bottom: 27px; a { color: var(--theme-color-text_dark) !important; &:hover { color: var(--theme-color-text_dark) !important; } } } .post_description_content { margin-bottom: 15px; } .post_meta { + .post_title { margin-top: 12px; } .post_categories { width: 100%; font-size: 14px; line-height: 25px; font-weight: 700; letter-spacing: 1px; text-transform: uppercase; color: var(--theme-color-text_dark); a { color: var(--theme-color-text_dark) !important; } } } .theme_button { margin-top: 5%; margin-bottom: -5%; font-size: 14px; line-height: 21px; font-weight: 700; letter-spacing: 1px; text-transform: uppercase; padding: 0; background-color: transparent !important; color: var(--theme-color-text_dark) !important; .hover-arrow { display: inline-block; width: 39px; height: 17px; line-height: 20px; overflow: hidden; position: relative; @include transition-all(0.4s); will-change: transform; margin-left: 15px; &:before { top: -2px; right: 2px; position: absolute; display: block; font-family: $theme_icons; color: var(--theme-color-text_dark); font-size: 11px; font-weight: 400; line-height: 20px; content: '\EA04'; @include transition-all(0.4s); } } &:hover { .hover-arrow { width: 59px; margin-left: 35px; &:before { color: var(--theme-color-text_link); } } } } } } .sc_portfolio_content { .sc_portfolio_item { .post_content_wrap { padding: 3.2em 0 3.8em 3.9em; } + .sc_portfolio_item { margin-top: 30px; } } &.no_margin { .sc_portfolio_item { + .sc_portfolio_item { margin-top: 0; } } } } .content_wrap_fullscreen .elementor-section-full_width & { .sc_portfolio_content { .sc_portfolio_item { .post_content_wrap { margin-right: calc((100vw - var(--theme-var-page))/2); .theme_button { margin-top: 27%; margin-bottom: -27%; } } } } } .sc_portfolio_columns_wrap { [class*="trx_addons_column-"] { .sc_portfolio_item { .post_content_wrap { padding: 1.5em 1.5em; margin-right: 0; align-self: flex-start; .theme_button { .hover-arrow { margin-left: 15px; width: 20px; } &:hover { .hover-arrow { margin-left: 15px; width: 38px; } } } } } } } } // for related in single portfolio width detail default_style .detail_default_style ~ &.sc_portfolio_simple.related_wrap { .related_wrap_title { width: calc(37% - 20px); } .related_columns { width: 63%; } } &.sc_portfolio_simple { &.related_wrap { @include flex; flex-direction: row; justify-content: flex-start; align-items: flex-start; .related_wrap_title { margin-right: 20px; width: calc(34% - 20px); line-height: 1em; margin-top: -6px; } .related_columns { width: 66%; padding-top: 3.1em; border-top: 1px solid var(--theme-color-text_dark); .sc_portfolio_item { padding: 0 33px 34px 0; display: inline-block; .post_title { font-size: 1.333em; } .post_meta { display: inline-block; .post_categories { text-transform: none; } } } } } .sc_portfolio_item { padding: 0 33px 18px 0; display: inline-block; width: auto; &:last-child { padding-right: 0; } .post_content_wrap { @include flex; flex-direction: row-reverse; justify-content: flex-end; align-items: baseline; .post_title { font-size: 1.944em; margin-bottom: 0; } .post_meta { color: var(--theme-color-alter_text); margin-top: 0; margin-bottom: 3px; display: none; .post_categories { font-size: 16px; letter-spacing: 0; font-weight: inherit; color: var(--theme-color-alter_text); a { color: var(--theme-color-alter_text) !important; &:hover { color: var(--theme-color-text_link) !important; } } } &:before { content: '/'; margin: 0 5px 0 9px; } } } } } &.sc_portfolio_fill { .sc_portfolio_item { .post_featured { overflow: hidden; position: relative; margin-bottom: 0; width: 100%; height: 100%; > a { position: absolute; top: 0; left: 0; width: 100%; height: 100%; z-index: 7; } .mask { top: 10px; left: 10px; bottom: 10px; right: 10px; display: block; background: var(--theme-color-bg_color); opacity: 0; transition-delay: 300ms; transition: 300ms; transition-duration: 300ms; } .post_info { width: calc(100% - 40px); height: calc(100% - 40px); padding: 0; background-color: transparent; @include flex; flex-direction: column; justify-content: center; align-items: center; text-align: center; top: 20px; left: 20px; right: 20px; bottom: 20px; .post_title { font-size: 1.33rem; line-height: 1.25em; letter-spacing: 0; font-weight: 600; color: var(--theme-color-text_dark) !important; overflow: hidden; width: 100%; text-align: center; a { transform: translateY(100%); transition-delay: 150ms; transition: 300ms; transition-duration: 400ms; color: var(--theme-color-text_dark) !important; text-overflow: ellipsis; max-width: 100%; display: -webkit-box; -webkit-line-clamp: 3; -webkit-box-orient: vertical; display: -moz-box; -moz-line-clamp: 3; -moz-box-orient: vertical; line-clamp: 3; box-orient: vertical; overflow: hidden; } } .post_meta { overflow: hidden; .post_categories { font-size: 16px; line-height: 1.4em; color: var(--theme-color-text_light) !important; transform: translateY(100%); transition-delay: 0ms; transition: 300ms; transition-duration: 400ms; overflow: hidden; text-overflow: ellipsis; max-width: 100%; display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; display: -moz-box; -moz-line-clamp: 2; -moz-box-orient: vertical; line-clamp: 2; box-orient: vertical; a { color: var(--theme-color-text_light) !important; } } } } &:hover { .mask { transition: all 0.3s; opacity: 1; transition-duration: 300ms; } .post_info { .post_title { a { transform: translateY(0); transition-duration: 500ms; } } .post_meta { .post_categories { transform: translateY(0); transition-duration: 500ms; } } } } } } .sc_item_posts_container { display: grid; gap: 30px 30px; grid-template: auto / repeat(4 , 1fr); grid-auto-flow: dense; .sc_portfolio_item { min-height: 390px; } &.no_margin { gap: 0 0; } &[class*="grid_wrap_"] { margin: 0 !important; } &.grid_wrap_1 { grid-template-columns: 1fr !important; grid-template-rows: 500px !important; gap: 30px 30px; grid-template-areas: "md-1"; .sc_portfolio_item { min-height: unset; &:nth-child(1) { grid-area: md-1; } } &.no_margin { gap: 0 0; } } &.grid_wrap_2 { grid-template-columns: 1fr 1fr !important; grid-template-rows: 500px !important; gap: 30px 30px; grid-template-areas: "md-1 md-2"; .sc_portfolio_item { min-height: unset; &:nth-child(1) { grid-area: md-1; } &:nth-child(2) { grid-area: md-2; } } &.no_margin { gap: 0 0; } } &.grid_wrap_3 { grid-template-columns: 1fr 1fr !important; grid-template-rows: 1fr 1fr 1fr 1fr 1fr !important; gap: 30px 30px; grid-template-areas: "md-1 md-3" "md-1 md-3" "md-1 md-3" "md-2 md-3" "md-2 md-3"; .sc_portfolio_item { min-height: unset; &:nth-child(1) { grid-area: md-1; } &:nth-child(2) { grid-area: md-2; } &:nth-child(3) { grid-area: md-3; } } &.no_margin { gap: 0 0; } } &.grid_wrap_4 { grid-template-columns: 1fr 1fr !important; grid-template-rows: 1fr 1fr 1fr 1fr 1fr !important; gap: 30px 30px; grid-template-areas: "md-1 md-3" "md-1 md-3" "md-1 md-4" "md-2 md-4" "md-2 md-4"; .sc_portfolio_item { min-height: unset; &:nth-child(1) { grid-area: md-1; } &:nth-child(2) { grid-area: md-2; } &:nth-child(3) { grid-area: md-3; } &:nth-child(4) { grid-area: md-4; } } &.no_margin { gap: 0 0; } } &.grid_wrap_5 { grid-template-columns: 1fr 1fr 1fr !important; grid-template-rows: 1fr 1fr 1fr 1fr 1fr !important; gap: 30px 30px; grid-template-areas: "md-1 md-3 md-5" "md-1 md-3 md-5" "md-1 md-4 md-5" "md-2 md-4 md-5" "md-2 md-4 md-5"; .sc_portfolio_item { min-height: unset; &:nth-child(1) { grid-area: md-1; } &:nth-child(2) { grid-area: md-2; } &:nth-child(3) { grid-area: md-3; } &:nth-child(4) { grid-area: md-4; } &:nth-child(5) { grid-area: md-5; } } &.no_margin { gap: 0 0; } } &.grid_wrap_6 { grid-template-columns: 1fr 1fr 1fr !important; grid-template-rows: repeat(12, 1fr) !important; gap: 30px 30px; grid-template-areas: "md-1 md-3 md-5" "md-1 md-3 md-5" "md-1 md-3 md-5" "md-1 md-3 md-5" "md-1 md-3 md-5" "md-2 md-3 md-5" "md-2 md-3 md-6" "md-2 md-4 md-6" "md-2 md-4 md-6" "md-2 md-4 md-6" "md-2 md-4 md-6" "md-2 md-4 md-6"; .sc_portfolio_item { min-height: unset; &:nth-child(1) { grid-area: md-1; } &:nth-child(2) { grid-area: md-2; } &:nth-child(3) { grid-area: md-3; } &:nth-child(4) { grid-area: md-4; } &:nth-child(5) { grid-area: md-5; } &:nth-child(6) { grid-area: md-6; } } &.no_margin { gap: 0 0; } } &.grid_wrap_7 { grid-template-columns: 1fr 1fr 1fr 1fr !important; grid-template-rows: repeat(12, 1fr) !important; gap: 30px 30px; grid-template-areas: "md-1 md-3 md-5 md-7" "md-1 md-3 md-5 md-7" "md-1 md-3 md-5 md-7" "md-1 md-3 md-5 md-7" "md-1 md-3 md-5 md-7" "md-2 md-3 md-5 md-7" "md-2 md-3 md-6 md-7" "md-2 md-4 md-6 md-7" "md-2 md-4 md-6 md-7" "md-2 md-4 md-6 md-7" "md-2 md-4 md-6 md-7" "md-2 md-4 md-6 md-7"; .sc_portfolio_item { min-height: unset; &:nth-child(1) { grid-area: md-1; } &:nth-child(2) { grid-area: md-2; } &:nth-child(3) { grid-area: md-3; } &:nth-child(4) { grid-area: md-4; } &:nth-child(5) { grid-area: md-5; } &:nth-child(6) { grid-area: md-6; } &:nth-child(7) { grid-area: md-7; } } &.no_margin { gap: 0 0; } } &.grid_wrap_8 { grid-template-columns: 1fr 1fr 1fr 1fr !important; grid-template-rows: repeat(12, 1fr) !important; gap: 30px 30px; grid-template-areas: "md-1 md-3 md-5 md-7" "md-1 md-3 md-5 md-7" "md-1 md-3 md-5 md-7" "md-1 md-3 md-5 md-7" "md-1 md-3 md-5 md-7" "md-2 md-3 md-5 md-7" "md-2 md-3 md-6 md-7" "md-2 md-4 md-6 md-7" "md-2 md-4 md-6 md-8" "md-2 md-4 md-6 md-8" "md-2 md-4 md-6 md-8" "md-2 md-4 md-6 md-8"; .sc_portfolio_item { min-height: unset; &:nth-child(1) { grid-area: md-1; } &:nth-child(2) { grid-area: md-2; } &:nth-child(3) { grid-area: md-3; } &:nth-child(4) { grid-area: md-4; } &:nth-child(5) { grid-area: md-5; } &:nth-child(6) { grid-area: md-6; } &:nth-child(7) { grid-area: md-7; } &:nth-child(8) { grid-area: md-8; } } &.no_margin { gap: 0 0; } } } } } .sc_portfolio { .sc_portfolio_item { .post_featured.with_thumb { .post_video_hover { top: 20px; right: 20px; margin: 0; left: auto; width: 40px; height: 40px; line-height: 40px; font-size: 12px; letter-spacing: -4px; } } } } .sc_blogger_lay_portfolio, .sc_blogger_lay_portfolio_grid { .sc_blogger_item { .sc_blogger_item_body { .post_featured.with_thumb { .post_video_hover { top: 20px; right: 20px; margin: 0; left: auto; width: 40px; height: 40px; line-height: 40px; font-size: 12px; letter-spacing: -4px; z-index: 2001; @include box-shadow(0 0 4px 0 rgba(0, 0, 0, 0.05)); } } .post_video_play [class*="post_info_"] { display: none !important; } } .post_meta .post_sponsored { display: none; } } } /* Style 1 */ .sc_blogger_lay_portfolio { &.sc_blogger_lay_portfolio_style-1 { .sc_blogger_item { .sc_blogger_item_body { .post_featured { margin-bottom: 17px; } .sc_blogger_item_content { margin-bottom: 20px; text-align: left; .sc_blogger_item_title { a { color: var(--theme-color-text_dark) !important; } } .post_meta { margin: 3px 0 0 0; .post_meta_item a, .post_meta_item { color: var(--theme-color-alter_text) !important; } .post_categories { font-size: 16px; } } } } } } } /* Style 5 */ .sc_blogger_lay_portfolio { &.sc_blogger_lay_portfolio_style_5 { .sc_blogger_item { .sc_blogger_item_body { .post_featured { .post_info_bl { opacity: 0; transition: all 0.3s; transform: scale(0.8); bottom: 30px; left: 30px; padding: 20px 26px 17px; background-color: var(--theme-color-bg_color); .sc_blogger_item_title { @include font(1.33rem, 1.4rem); a { color: var(--theme-color-text_dark) !important; } } .post_meta { margin-top: 3px; .post_categories { font-size: 16px; } .post_meta_item a, .post_meta_item { color: var(--theme-color-alter_text)!important; } } } &:hover { .post_info_bl { opacity: 1; transition: all 0.3s; transform: scale(1); } } } } .post_featured_bg { &[data-ratio="10:9"]:before { padding-top: 94%; } } } } } /* Style 6 */ .sc_blogger_lay_portfolio { &.sc_blogger_lay_portfolio_style_6 { .sc_blogger_item { .sc_blogger_item_body { .post_featured { .post_info_bc { transition: all 0.4s; transform: translateY(100%); bottom: 0; left: 0; right: 0; margin: 0 auto; padding: 21px 26px 17px; width: 70%; max-width: 70%; background-color: var(--theme-color-bg_color); opacity: 0; .sc_blogger_item_title { font-size: 1.33rem; a { color: var(--theme-color-text_dark) !important; overflow: hidden; text-overflow: ellipsis; max-width: 100%; display: -webkit-box; -webkit-line-clamp: 3; -webkit-box-orient: vertical; display: -moz-box; -moz-line-clamp: 3; -moz-box-orient: vertical; line-clamp: 3; box-orient: vertical; } } .post_meta { &.post_meta_categories { margin-top: 6px; .post_categories { font-size: 16px; overflow: hidden; text-overflow: ellipsis; max-width: 100%; display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; display: -moz-box; -moz-line-clamp: 2; -moz-box-orient: vertical; line-clamp: 2; box-orient: vertical; } } .post_meta_item a, .post_meta_item { color: var(--theme-color-alter_text) !important; } } } &.hover_link.with_thumb { > .bg_in { transition: all 0.3s ease; transform: scale(1.009, 1.009); } &:hover { > .bg_in { transform: scale(1.04, 1.04); } } } &:hover { .post_info_bc { transition: all 0.4s; transform: translateY(0); bottom: 38px; opacity: 1; } } } } .post_featured_bg { &[data-ratio="10:9"]:before { padding-top: 94%; } } } } } /* Style 7 */ .sc_blogger_lay_portfolio { &.sc_blogger_lay_portfolio_style_7 { .sc_blogger_item { .sc_blogger_item_body { .post_featured { .post_info_bl { left: 15%; bottom: 10%; background-color: transparent; overflow: hidden; padding: 0; text-align: left; .sc_blogger_item_title { font-size: 1.33rem; line-height: 1.25em; letter-spacing: 0; font-weight: 600; padding: 12px 18px; background-color: #191615; transform: translateX(-105%); transition: all 0.3s; transition-duration: 0.3s; transition-delay: 0ms; a { color: #ffffff !important; } } .post_meta { margin-top: 5px; transform: translateX(-105%); transition: all 0.3s; transition-delay: 50ms; transition-duration: 0.3s; .post_categories { font-size: 16px; line-height: 1.6em; padding: 6px 20px; background-color: #191615; a { color: #ffffff !important; } } } } &:hover { .post_info_bl { .sc_blogger_item_title { transform: translateX(0); transition: all 0.7s; transition-delay: 0ms; transition-duration: 0.5s; } .post_meta { transform: translateX(0); transition: all 0.7s; transition-delay: 50ms; transition-duration: 0.5s; } } } } } } } } /* Style 8 */ .sc_blogger_lay_portfolio { &.sc_blogger_lay_portfolio_style-8 { .sc_blogger_item { .sc_blogger_item_body { .post_featured { margin-bottom: 19px; .mask { display: none; } } .sc_blogger_item_content { margin-bottom: 10px; text-align: center; .sc_blogger_item_title { font-size: 1.2rem; a { color: var(--theme-color-text_dark) !important; } } .post_meta { margin: 4px 0 0 0; .post_meta_item a, .post_meta_item { color: var(--theme-color-alter_text) !important; } .post_categories { font-size: 16px; } } } } } .sc_blogger_columns_wrap { .trx_addons_column-1_2 { .sc_blogger_item { .sc_blogger_item_body { .sc_blogger_item_content { .sc_blogger_item_title { font-size: 1.55rem; } } } } } } .sc_blogger_content { .sc_blogger_item { .sc_blogger_item_body { .sc_blogger_item_content { .sc_blogger_item_title { font-size: 1.55rem; } } } + .sc_blogger_item { padding-top: 30px; } } } } } /* Style 14 */ .sc_blogger_lay_portfolio { &.sc_blogger_lay_portfolio_style_14 { .sc_blogger_item { width: 100%; height: 100%; .sc_blogger_item_body { .post_featured { .link { z-index: 10; display: block; } .bg_in { transform: scale(1.02, 1.02); } .post_info_bc { transition: all 0.3s; max-width: unset; @include flex; flex-direction: column; justify-content: center; text-align: center; bottom: 0; left: 0; right: 0; top: 0; padding: 20px; background-color: transparent; transform: none; .sc_blogger_item_title { font-size: 1.33rem; line-height: 1.4em; overflow: hidden; color: #ffffff !important; a { transform: translateY(100%); transition-delay: 150ms; transition: 300ms; transition-duration: 400ms; color: #ffffff !important; overflow: hidden; text-overflow: ellipsis; max-width: 100%; display: -webkit-box; -webkit-line-clamp: 3; -webkit-box-orient: vertical; display: -moz-box; -moz-line-clamp: 3; -moz-box-orient: vertical; line-clamp: 3; box-orient: vertical; } } .post_meta { margin-top: 3px; overflow: hidden; .post_meta_item a, .post_meta_item { color: #ffffff !important; } .post_categories { font-size: 16px; transform: translateY(100%); transition-delay: 0ms; transition: 300ms; transition-duration: 400ms; width: 100%; overflow: hidden; text-overflow: ellipsis; max-width: 100%; display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; display: -moz-box; -moz-line-clamp: 2; -moz-box-orient: vertical; line-clamp: 2; box-orient: vertical; } } &:before { content: ''; position: absolute; width: 100%; height: 100%; left: 0; top: 0; display: block; z-index: -1; background-color: var(--theme-color-inverse_dark); opacity: 0; transition-delay: 300ms; transition: 300ms; transition-duration: 300ms; } } &:hover { .post_info_bc { &:before { transition: all 0.3s; opacity: 0.95; transition-duration: 300ms; } .sc_blogger_item_title { a { transform: translateY(0); transition-duration: 500ms; } } .post_meta { .post_categories { transform: translateY(0); transition-duration: 500ms; } } } } } } .post_featured_bg { &[data-ratio="10:7"]:before { padding-top: 72%; } } } .trx_addons_columns_wrap { margin-right: 0; > [class*="trx_addons_column-"] { padding-right: 0; } &.columns_padding_bottom { > [class*="trx_addons_column-"] { padding-bottom: 0; } } } } } /* Style 15 */ .sc_blogger_lay_portfolio { &.sc_blogger_lay_portfolio_style_15 { .sc_blogger_item { .sc_blogger_item_body { .post_featured { .link { z-index: 10; display: block; } .post_info_bc { transition: all 0.3s; max-width: unset; @include flex; flex-direction: column; justify-content: center; text-align: center; bottom: 0; left: 0; right: 0; top: 0; padding: 20px; background-color: transparent; transform: none; .sc_blogger_item_title { font-size: 1.33rem; line-height: 1.4em; overflow: hidden; color: #ffffff !important; a { transform: translateY(100%); transition-delay: 150ms; transition: 300ms; transition-duration: 400ms; color: #ffffff !important; text-overflow: ellipsis; max-width: 100%; display: -webkit-box; -webkit-line-clamp: 3; -webkit-box-orient: vertical; display: -moz-box; -moz-line-clamp: 3; -moz-box-orient: vertical; line-clamp: 3; box-orient: vertical; overflow: hidden; } } .post_meta { margin-top: 3px; overflow: hidden; .post_meta_item a, .post_meta_item { color: #ffffff !important; } .post_categories { font-size: 16px; transform: translateY(100%); transition-delay: 0ms; transition: 300ms; transition-duration: 400ms; width: 100%; overflow: hidden; text-overflow: ellipsis; max-width: 100%; display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; display: -moz-box; -moz-line-clamp: 2; -moz-box-orient: vertical; line-clamp: 2; box-orient: vertical; } } &:before { content: ''; position: absolute; width: 100%; height: 100%; left: 0; top: 0; display: block; z-index: -1; background-color: var(--theme-color-inverse_dark); opacity: 0; transition-delay: 300ms; transition: 300ms; transition-duration: 300ms; } } &:hover { .post_info_bc { &:before { transition: all 0.3s; opacity: 0.95; transition-duration: 300ms; } .sc_blogger_item_title { a { transform: translateY(0); transition-duration: 500ms; } } .post_meta { .post_categories { transform: translateY(0); transition-duration: 500ms; } } } } } } } .trx_addons_columns_wrap { margin-right: 0; > [class*="trx_addons_column-"] { padding-right: 0; padding-bottom: 0 !important; } &.columns_padding_bottom { > [class*="trx_addons_column-"] { padding-bottom: 0; } } } } } /* Style 16 */ .sc_blogger_lay_portfolio { &.sc_blogger_lay_portfolio_style_16 { .sc_blogger_item { .sc_blogger_item_body { .post_featured { .link { z-index: 10; display: block; } .post_info_bl { opacity: 0; transition: all 0.3s; transform: scale(0.8); max-width: unset; @include flex; flex-direction: column; justify-content: flex-end; bottom: 30px; left: 30px; right: 30px; top: 30px; padding: 20px 39px 30px; background-color: var(--theme-color-bg_color); .sc_blogger_item_title { font-size: 1.33rem; line-height: 1.3em; padding-bottom: 1px; text-overflow: ellipsis; max-width: 100%; display: -webkit-box; -webkit-line-clamp: 3; -webkit-box-orient: vertical; display: -moz-box; -moz-line-clamp: 3; -moz-box-orient: vertical; line-clamp: 3; box-orient: vertical; overflow: hidden; a { color: var(--theme-color-text_dark) !important; } } .post_meta { margin-top: 3px; .post_categories { font-size: 16px; } .post_meta_item a, .post_meta_item { color: var(--theme-color-alter_text)!important; } } } &:hover { .post_info_bl { opacity: 1; transition: all 0.3s; transform: scale(1); } } } } .post_featured_bg { &[data-ratio="10:9"]:before { padding-top: 96%; } } } } } /* Grid Portfolio */ .sc_blogger_lay_portfolio_grid { .sc_item_featured [class*="post_info_"] { z-index: 2001 !important; } .sc_blogger_item .post_featured.without_thumb { height: 100%; .slider-slide, .slider_outer, .slider_container { height: 100% !important; min-height: 200px !important; } } /* Grid style 3 */ &.sc_blogger_lay_portfolio_grid_grid_style_3 { .sc_blogger_item { .sc_blogger_item_body { width: 100%; height: 100%; .post_featured_bg { width: 100%; height: 100%; } .post_featured { .post_info_bl { opacity: 0; transition: all 0.3s; transform: scale(0.8); bottom: 50px; left: 50px; padding: 20px 27px 17px; max-height: calc(100% - 100px); max-width: calc(100% - 100px); background-color: var(--theme-color-bg_color); overflow: hidden; .sc_blogger_item_title { font-size: 1.33rem; a { color: var(--theme-color-text_dark) !important; overflow: hidden; text-overflow: ellipsis; max-width: 100%; display: -webkit-box; -webkit-line-clamp: 3; -webkit-box-orient: vertical; display: -moz-box; -moz-line-clamp: 3; -moz-box-orient: vertical; line-clamp: 3; box-orient: vertical; } } .post_meta { margin-top: 3px; .post_categories { font-size: 16px; width: 100%; overflow: hidden; text-overflow: ellipsis; max-width: 100%; display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; display: -moz-box; -moz-line-clamp: 2; -moz-box-orient: vertical; line-clamp: 2; box-orient: vertical; } .post_meta_item a, .post_meta_item { color: var(--theme-color-alter_text)!important; } } } &:hover { .post_info_bl { opacity: 1; transition: all 0.3s; transform: scale(1); } } } } } .sc_blogger_grid_wrap { &.sc_blogger_grid_1 { display: grid; grid-template-columns: 1fr; grid-template-rows: 323px 323px; gap: 0 0; grid-template-areas: "md-1" "md-1"; .sc_blogger_item { &:nth-child(1) { grid-area: md-1; } } } &.sc_blogger_grid_2 { display: grid; grid-template-columns: 1fr 1fr; grid-template-rows: 323px 323px; gap: 0 0; grid-template-areas: "md-1 md-2" "md-1 md-2"; .sc_blogger_item { &:nth-child(1) { grid-area: md-1; } &:nth-child(2) { grid-area: md-2; } } } &.sc_blogger_grid_3 { display: grid; grid-template-columns: 1fr 1fr 1fr 1fr; grid-template-rows: 323px 323px; gap: 0 0; grid-template-areas: "md-3-1 md-3-1 md-3-2 md-3-2" "md-3-1 md-3-1 md-3-3 md-3-3"; .sc_blogger_item { &:nth-child(1) { grid-area: md-3-1; } &:nth-child(2) { grid-area: md-3-2; } &:nth-child(3) { grid-area: md-3-3; } } } &.sc_blogger_grid_4 { display: grid; grid-template-columns: 1fr 1fr 1fr 1fr; grid-template-rows: 323px 323px; gap: 0 0; grid-template-areas: "lg-3-1 lg-3-1 md-3-1 md-3-1" "lg-3-1 lg-3-1 sm-3-1 sm-3-2"; .sc_blogger_item { &:nth-child(1) { grid-area: lg-3-1; } &:nth-child(2) { grid-area: md-3-1; } &:nth-child(3) { grid-area: sm-3-1; } &:nth-child(4) { grid-area: sm-3-2; } } } &.sc_blogger_grid_5 { display: grid; grid-template-columns: 1fr 1fr 1fr 1fr; grid-template-rows: 323px 323px; gap: 0 0; grid-template-areas: "lg-3-1 lg-3-1 sm-3-1 sm-3-2" "lg-3-1 lg-3-1 sm-3-3 sm-3-4"; .sc_blogger_item { &:nth-child(1) { grid-area: lg-3-1; } &:nth-child(2) { grid-area: sm-3-1; } &:nth-child(3) { grid-area: sm-3-2; } &:nth-child(4) { grid-area: sm-3-3; } &:nth-child(5) { grid-area: sm-3-4; } } } &.sc_blogger_grid_6 { display: grid; grid-template-columns: 1fr 1fr 1fr 1fr; grid-template-rows: 323px 323px 323px 323px; gap: 0 0; grid-template-areas: "lg-3-1 lg-3-1 md-3-1 md-3-1" "lg-3-1 lg-3-1 md-3-2 md-3-2" "md-3-3 md-3-4 lg-3-2 lg-3-2" "md-3-3 md-3-4 lg-3-2 lg-3-2"; .sc_blogger_item { &:nth-child(1) { grid-area: lg-3-1; } &:nth-child(2) { grid-area: md-3-1; } &:nth-child(3) { grid-area: md-3-2; } &:nth-child(4) { grid-area: md-3-3; } &:nth-child(5) { grid-area: md-3-4; } &:nth-child(6) { grid-area: lg-3-2; } } } &.sc_blogger_grid_7 { display: grid; grid-template-columns: 1fr 1fr 1fr 1fr; grid-template-rows: 323px 323px 323px 323px; gap: 0 0; grid-template-areas: "lg-3-1 lg-3-1 md-3-1 md-3-1" "lg-3-1 lg-3-1 sm-3-1 sm-3-2" "md-3-2 md-3-3 lg-3-2 lg-3-2" "md-3-2 md-3-3 lg-3-2 lg-3-2"; .sc_blogger_item { &:nth-child(1) { grid-area: lg-3-1; } &:nth-child(2) { grid-area: md-3-1; } &:nth-child(3) { grid-area: sm-3-1; } &:nth-child(4) { grid-area: sm-3-2; } &:nth-child(5) { grid-area: md-3-2; } &:nth-child(6) { grid-area: md-3-3; } &:nth-child(7) { grid-area: lg-3-2; } } } &.sc_blogger_grid_8 { display: grid; grid-template-columns: 1fr 1fr 1fr 1fr; grid-template-rows: 323px 323px 323px 323px; gap: 0 0; grid-template-areas: "lg-3-1 lg-3-1 md-3-1 md-3-1" "lg-3-1 lg-3-1 sm-3-1 sm-3-2" "sm-3-3 md-3-2 lg-3-2 lg-3-2" "sm-3-4 md-3-2 lg-3-2 lg-3-2"; .sc_blogger_item { &:nth-child(1) { grid-area: lg-3-1; } &:nth-child(2) { grid-area: md-3-1; } &:nth-child(3) { grid-area: sm-3-1; } &:nth-child(4) { grid-area: sm-3-2; } &:nth-child(5) { grid-area: lg-3-2; } &:nth-child(6) { grid-area: md-3-2; } &:nth-child(7) { grid-area: sm-3-3; } &:nth-child(8) { grid-area: sm-3-4; } } } &.sc_blogger_grid_9 { display: grid; grid-template-columns: 1fr 1fr 1fr 1fr; grid-template-rows: 323px 323px 323px 323px; gap: 0 0; grid-template-areas: "lg-3-1 lg-3-1 md-3-1 md-3-1" "lg-3-1 lg-3-1 sm-3-1 sm-3-2" "sm-3-3 md-3-2 lg-3-2 lg-3-2" "sm-3-4 md-3-3 lg-3-2 lg-3-2"; .sc_blogger_item { &:nth-child(1) { grid-area: lg-3-1; } &:nth-child(2) { grid-area: md-3-1; } &:nth-child(3) { grid-area: sm-3-1; } &:nth-child(4) { grid-area: sm-3-2; } &:nth-child(5) { grid-area: lg-3-2; } &:nth-child(6) { grid-area: md-3-2; } &:nth-child(7) { grid-area: sm-3-3; } &:nth-child(8) { grid-area: sm-3-4; } &:nth-child(9) { grid-area: md-3-3; } } } &.sc_blogger_grid_10 { display: grid; grid-template-columns: 1fr 1fr 1fr 1fr; grid-template-rows: 323px 323px 323px 323px; gap: 0 0; grid-template-areas: "lg-3-1 lg-3-1 md-3-1 md-4-1" "lg-3-1 lg-3-1 sm-3-1 sm-3-2" "sm-3-3 md-3-2 lg-3-2 lg-3-2" "sm-3-4 md-3-3 lg-3-2 lg-3-2"; .sc_blogger_item { &:nth-child(1) { grid-area: lg-3-1; } &:nth-child(2) { grid-area: md-3-1; } &:nth-child(3) { grid-area: sm-3-1; } &:nth-child(4) { grid-area: md-4-1; } &:nth-child(5) { grid-area: sm-3-2; } &:nth-child(6) { grid-area: lg-3-2; } &:nth-child(7) { grid-area: md-3-2; } &:nth-child(8) { grid-area: sm-3-3; } &:nth-child(9) { grid-area: sm-3-4; } &:nth-child(10) { grid-area: md-3-3; } } } &.sc_blogger_grid_11 { display: grid; grid-template-columns: 1fr 1fr 1fr 1fr; grid-template-rows: 323px 323px 323px 323px 323px 323px; gap: 0 0; grid-template-areas: "lg-3-1 lg-3-1 md-3-1 md-3-1" "lg-3-1 lg-3-1 sm-3-1 sm-3-2" "sm-3-3 md-3-2 lg-3-2 lg-3-2" "sm-3-4 md-3-2 lg-3-2 lg-3-2" "lg-3-3 lg-3-3 md-3-3 md-3-4" "lg-3-3 lg-3-3 md-3-3 md-3-4"; .sc_blogger_item { &:nth-child(1) { grid-area: lg-3-1; } &:nth-child(2) { grid-area: md-3-1; } &:nth-child(3) { grid-area: sm-3-1; } &:nth-child(4) { grid-area: sm-3-2; } &:nth-child(5) { grid-area: sm-3-3; } &:nth-child(6) { grid-area: sm-3-4; } &:nth-child(7) { grid-area: md-3-2; } &:nth-child(8) { grid-area: lg-3-2; } &:nth-child(9) { grid-area: lg-3-3; } &:nth-child(10) { grid-area: md-3-3; } &:nth-child(11) { grid-area: md-3-4; } } } &.sc_blogger_grid_12 { display: grid; grid-template-columns: 1fr 1fr 1fr 1fr; grid-template-rows: 323px 323px 323px 323px 323px 323px; gap: 0 0; grid-template-areas: "lg-3-1 lg-3-1 md-3-1 md-3-1" "lg-3-1 lg-3-1 sm-3-1 sm-3-2" "sm-3-3 md-3-2 lg-3-2 lg-3-2" "sm-3-4 md-3-2 lg-3-2 lg-3-2" "lg-3-3 lg-3-3 md-3-3 md-3-3" "lg-3-3 lg-3-3 sm-3-5 sm-3-6"; .sc_blogger_item { &:nth-child(1) { grid-area: lg-3-1; } &:nth-child(2) { grid-area: md-3-1; } &:nth-child(3) { grid-area: sm-3-1; } &:nth-child(4) { grid-area: sm-3-2; } &:nth-child(5) { grid-area: sm-3-3; } &:nth-child(6) { grid-area: sm-3-4; } &:nth-child(7) { grid-area: md-3-2; } &:nth-child(8) { grid-area: lg-3-2; } &:nth-child(9) { grid-area: lg-3-3; } &:nth-child(10) { grid-area: md-3-3; } &:nth-child(11) { grid-area: sm-3-5; } &:nth-child(12) { grid-area: sm-3-6; } } } } } /* grid Style 4 */ &.sc_blogger_lay_portfolio_grid_grid_style_4 { .sc_blogger_item { .sc_blogger_item_body { width: 100%; height: 100%; .post_featured_bg { width: 100%; height: 100%; } .post_featured { .link { z-index: 10; display: block; } .post_info_bl { transition: all 0.3s; max-width: unset; @include flex; flex-direction: column; justify-content: center; text-align: center; bottom: 0; left: 0; right: 0; top: 0; padding: 20px; background-color: transparent; .sc_blogger_item_title { font-size: 1.33rem; line-height: 1.4em; transform: translateY(20px); opacity: 0; transition-delay: 50ms; transition: 400ms; transition-duration: 300ms; overflow: hidden; text-overflow: ellipsis; max-width: 100%; display: -webkit-box; -webkit-line-clamp: 3; -webkit-box-orient: vertical; display: -moz-box; -moz-line-clamp: 3; -moz-box-orient: vertical; line-clamp: 3; box-orient: vertical; a { color: var(--theme-color-text_dark) !important; } } .post_meta { margin-top: 3px; transform: translateY(20px); opacity: 0; transition-delay: 0ms; transition: 400ms; transition-duration: 300ms; .post_meta_item a, .post_meta_item { color: var(--theme-color-alter_text)!important; } .post_categories { font-size: 16px; width: 100%; overflow: hidden; text-overflow: ellipsis; max-width: 100%; display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; display: -moz-box; -moz-line-clamp: 2; -moz-box-orient: vertical; line-clamp: 2; box-orient: vertical; } } .sc_blogger_item_excerpt { opacity: 0; transform: translateY(20px); transition-delay: 0ms; transition: 300ms; transition-duration: 300ms; } .sc_blogger_item_button { opacity: 0; transform: translateY(20px); transition-delay: 0ms; transition: 300ms; transition-duration: 300ms; .item_more_link, .item_more_link:hover, .item_more_link:focus { color: var(--theme-color-text_dark); } } &:before { content: ''; position: absolute; width: 100%; height: 100%; left: 0; top: 0; display: block; z-index: -1; background-color: var(--theme-color-bg_color); opacity: 0; transition-delay: 300ms; transition: 300ms; transition-duration: 300ms; } } &:hover { .post_info_bl { &:before { transition: all 0.3s; opacity: 1; transition-duration: 300ms; } .sc_blogger_item_title { transform: translateY(0); transition-delay: 150ms; opacity: 1; transition-duration: 400ms; } .post_meta { transform: translateY(0); opacity: 1; transition-delay: 200ms; transition-duration: 400ms; } .sc_blogger_item_excerpt { opacity: 1; transform: translateY(0); transition-delay: 250ms; transition-duration: 400ms; } .sc_blogger_item_button { opacity: 1; transform: translateY(0); transition-delay: 300ms; transition-duration: 400ms; } } } } } } .sc_blogger_grid_wrap { &.sc_blogger_grid_1 { display: grid; grid-template-columns: 1fr; grid-template-rows: 480px 480px; gap: 0 0; grid-template-areas: "md-1" "md-1"; .sc_blogger_item { &:nth-child(1) { grid-area: md-1; } } } &.sc_blogger_grid_2 { display: grid; grid-template-columns: 1fr 1fr; grid-template-rows: 480px 480px; gap: 0 0; grid-template-areas: "md-1 md-2" "md-1 md-2"; .sc_blogger_item { &:nth-child(1) { grid-area: md-1; } &:nth-child(2) { grid-area: md-2; } } } &.sc_blogger_grid_3 { display: grid; grid-template-columns: 1fr 1fr 1fr 1fr; grid-template-rows: 480px 480px; gap: 0 0; grid-template-areas: "lg-13-1 lg-13-1 md-13-1 md-13-1" "lg-13-1 lg-13-1 md-13-2 md-13-2"; .sc_blogger_item { &:nth-child(1) { grid-area: lg-13-1; } &:nth-child(2) { grid-area: md-13-1; } &:nth-child(3) { grid-area: md-13-2; } } } &.sc_blogger_grid_4 { display: grid; grid-template-columns: 1fr 1fr 1fr 1fr; grid-template-rows: 480px 480px; gap: 0 0; grid-template-areas: "md-4-1 sm-4-1 lg-4-1 lg-4-1" "md-4-1 sm-4-2 lg-4-1 lg-4-1"; .sc_blogger_item { &:nth-child(1) { grid-area: md-4-1; } &:nth-child(2) { grid-area: sm-4-1; } &:nth-child(3) { grid-area: sm-4-2; } &:nth-child(4) { grid-area: lg-4-1; } } } &.sc_blogger_grid_5 { display: grid; grid-template-columns: 1fr 1fr 1fr 1fr; grid-template-rows: 480px 480px; gap: 0 0; grid-template-areas: "lg-4-1 lg-4-1 sm-4-1 sm-4-2" "lg-4-1 lg-4-1 sm-4-3 sm-4-4"; .sc_blogger_item { &:nth-child(1) { grid-area: lg-4-1; } &:nth-child(2) { grid-area: sm-4-1; } &:nth-child(3) { grid-area: sm-4-2; } &:nth-child(4) { grid-area: sm-4-3; } &:nth-child(5) { grid-area: sm-4-4; } } } &.sc_blogger_grid_6 { display: grid; grid-template-columns: 1fr 1fr 1fr 1fr; grid-template-rows: 480px 480px 480px 480px; gap: 0 0; grid-template-areas: "lg-4-1 lg-4-1 md-4-1 md-4-1" "lg-4-1 lg-4-1 md-4-2 md-4-2" "md-4-3 md-4-4 lg-4-2 lg-4-2" "md-4-3 md-4-4 lg-4-2 lg-4-2"; .sc_blogger_item { &:nth-child(1) { grid-area: lg-4-1; } &:nth-child(2) { grid-area: md-4-1; } &:nth-child(3) { grid-area: md-4-2; } &:nth-child(4) { grid-area: md-4-3; } &:nth-child(5) { grid-area: md-4-4; } &:nth-child(6) { grid-area: lg-4-2; } } } &.sc_blogger_grid_7 { display: grid; grid-template-columns: 1fr 1fr 1fr 1fr; grid-template-rows: 480px 480px 480px 480px; gap: 0 0; grid-template-areas: "lg-13-1 lg-13-1 sm-13-1 sm-13-2" "lg-13-1 lg-13-1 md-13-1 md-13-1" "md-13-2 md-13-3 lg-13-2 lg-13-2" "md-13-2 md-13-3 lg-13-2 lg-13-2"; .sc_blogger_item { &:nth-child(1) { grid-area: lg-13-1; } &:nth-child(2) { grid-area: sm-13-1; } &:nth-child(3) { grid-area: sm-13-2; } &:nth-child(4) { grid-area: md-13-1; } &:nth-child(5) { grid-area: md-13-2; } &:nth-child(6) { grid-area: md-13-3; } &:nth-child(7) { grid-area: lg-13-2; } } } &.sc_blogger_grid_8 { display: grid; grid-template-columns: 1fr 1fr 1fr 1fr; grid-template-rows: 480px 480px 480px 480px; gap: 0 0; grid-template-areas: "lg-4-1 lg-4-1 sm-4-1 sm-4-2" "lg-4-1 lg-4-1 md-4-1 md-4-1" "md-4-2 sm-4-3 lg-4-2 lg-4-2" "md-4-2 sm-4-4 lg-4-2 lg-4-2"; .sc_blogger_item { &:nth-child(1) { grid-area: lg-4-1; } &:nth-child(2) { grid-area: sm-4-1; } &:nth-child(3) { grid-area: sm-4-2; } &:nth-child(4) { grid-area: md-4-1; } &:nth-child(5) { grid-area: lg-4-2; } &:nth-child(6) { grid-area: sm-4-3; } &:nth-child(7) { grid-area: sm-4-4; } &:nth-child(8) { grid-area: md-4-2; } } } &.sc_blogger_grid_9 { display: grid; grid-template-columns: 1fr 1fr 1fr 1fr; grid-template-rows: 480px 480px 480px 480px; gap: 0 0; grid-template-areas: "lg-4-1 lg-4-1 sm-4-1 sm-4-2" "lg-4-1 lg-4-1 sm-4-3 sm-4-4" "md-4-2 sm-4-5 lg-4-2 lg-4-2" "md-4-2 sm-4-6 lg-4-2 lg-4-2"; .sc_blogger_item { &:nth-child(1) { grid-area: lg-4-1; } &:nth-child(2) { grid-area: sm-4-1; } &:nth-child(3) { grid-area: sm-4-2; } &:nth-child(4) { grid-area: lg-4-2; } &:nth-child(5) { grid-area: md-4-2; } &:nth-child(6) { grid-area: sm-4-3; } &:nth-child(7) { grid-area: sm-4-4; } &:nth-child(8) { grid-area: sm-4-5; } &:nth-child(9) { grid-area: sm-4-6; } } } &.sc_blogger_grid_10 { display: grid; grid-template-columns: 1fr 1fr 1fr 1fr; grid-template-rows: 480px 480px 480px 480px; gap: 0 0; grid-template-areas: "lg-13-1 lg-13-1 sm-13-1 sm-13-2" "lg-13-1 lg-13-1 sm-13-3 sm-13-4" "sm-13-5 sm-13-6 lg-13-2 lg-13-2" "sm-13-7 sm-13-8 lg-13-2 lg-13-2"; .sc_blogger_item { &:nth-child(1) { grid-area: lg-13-1; } &:nth-child(2) { grid-area: sm-13-1; } &:nth-child(3) { grid-area: sm-13-2; } &:nth-child(4) { grid-area: sm-13-3; } &:nth-child(5) { grid-area: sm-13-4; } &:nth-child(6) { grid-area: sm-13-5; } &:nth-child(7) { grid-area: sm-13-6; } &:nth-child(8) { grid-area: lg-13-2; } &:nth-child(9) { grid-area: sm-13-7; } &:nth-child(10) { grid-area: sm-13-8; } } } &.sc_blogger_grid_11 { display: grid; grid-template-columns: 1fr 1fr 1fr 1fr; grid-template-rows: repeat(6, 480px); gap: 0 0; grid-template-areas: "lg-13-1 lg-13-1 sm-13-1 sm-13-2" "lg-13-1 lg-13-1 md-13-1 md-13-1" "md-13-2 md-13-3 lg-13-2 lg-13-2" "md-13-2 md-13-3 lg-13-2 lg-13-2" "lg-13-3 lg-13-3 sm-13-3 sm-13-4" "lg-13-3 lg-13-3 md-13-4 md-13-4"; .sc_blogger_item { &:nth-child(1) { grid-area: lg-13-1; } &:nth-child(2) { grid-area: sm-13-1; } &:nth-child(3) { grid-area: sm-13-2; } &:nth-child(4) { grid-area: md-13-1; } &:nth-child(5) { grid-area: md-13-2; } &:nth-child(6) { grid-area: md-13-3; } &:nth-child(7) { grid-area: lg-13-2; } &:nth-child(8) { grid-area: lg-13-3; } &:nth-child(9) { grid-area: sm-13-3; } &:nth-child(10) { grid-area: sm-13-4; } &:nth-child(11) { grid-area: md-13-4; } } } &.sc_blogger_grid_12 { display: grid; grid-template-columns: 1fr 1fr 1fr 1fr; grid-template-rows: repeat(6, 480px); gap: 0 0; grid-template-areas: "lg-13-1 lg-13-1 sm-13-1 sm-13-2" "lg-13-1 lg-13-1 md-13-1 md-13-1" "md-13-2 sm-13-3 lg-13-2 lg-13-2" "md-13-2 sm-13-4 lg-13-2 lg-13-2" "lg-13-3 lg-13-3 sm-13-5 sm-13-6" "lg-13-3 lg-13-3 md-13-3 md-13-3"; .sc_blogger_item { &:nth-child(1) { grid-area: lg-13-1; } &:nth-child(2) { grid-area: sm-13-1; } &:nth-child(3) { grid-area: sm-13-2; } &:nth-child(4) { grid-area: md-13-1; } &:nth-child(5) { grid-area: md-13-2; } &:nth-child(6) { grid-area: sm-13-3; } &:nth-child(7) { grid-area: sm-13-4; } &:nth-child(8) { grid-area: lg-13-2; } &:nth-child(9) { grid-area: lg-13-3; } &:nth-child(10) { grid-area: sm-13-5; } &:nth-child(11) { grid-area: sm-13-6; } &:nth-child(12) { grid-area: md-13-3; } } } } } /* Grid style 5 */ &.sc_blogger_lay_portfolio_grid_grid_style_5 { .no_margin .sc_blogger_grid_wrap { gap: 0 !important; + .sc_blogger_grid_wrap { margin-top: 0 !important; } .sc_blogger_item + .sc_blogger_item { margin-top: 0 !important; } } .sc_blogger_item { .sc_blogger_item_body { width: 100%; height: 100%; .post_featured_bg { width: 100%; height: 100%; } .post_featured { .post_info_bl { transition: all 0.3s; transform: translateX(-100%); bottom: 30px; max-width: calc( 100% - 60px ); left: 0; padding: 20px 26px 17px; background-color: var(--theme-color-bg_color); .sc_blogger_item_title { font-size: 1.33rem; overflow: hidden; text-overflow: ellipsis; max-width: 100%; display: -webkit-box; -webkit-line-clamp: 3; -webkit-box-orient: vertical; display: -moz-box; -moz-line-clamp: 3; -moz-box-orient: vertical; line-clamp: 3; box-orient: vertical; a { color: var(--theme-color-text_dark) !important; } } .post_meta { &.post_meta_categories { margin-top: 3px; .post_categories { font-size: 16px; overflow: hidden; text-overflow: ellipsis; max-width: 100%; display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; display: -moz-box; -moz-line-clamp: 2; -moz-box-orient: vertical; line-clamp: 2; box-orient: vertical; } } .post_meta_item a, .post_meta_item { color: var(--theme-color-alter_text)!important; } + .post_meta { margin-top: 5px; } } .item_more_link, .item_more_link:hover, .item_more_link:focus { color: var(--theme-color-text_dark); } } &:hover { .post_info_bl { left: 30px; transition: all 0.3s; transform: translateX(0); } } } } } .sc_blogger_grid_wrap { + .sc_blogger_grid_wrap { margin-top: 30px; } &.sc_blogger_grid_1 { display: grid; grid-template-columns: 1fr; grid-template-rows: 19.4rem 19.4rem; gap: 0 0; grid-template-areas: "md-1" "md-1"; .sc_blogger_item { &:nth-child(1) { grid-area: md-1; } } } &.sc_blogger_grid_2 { display: grid; grid-template-columns: 1fr 1fr; grid-template-rows: 19.4rem 19.4rem; gap: 30px 30px; grid-template-areas: "md-1 md-2" "md-1 md-2"; .sc_blogger_item { &:nth-child(1) { grid-area: md-1; } &:nth-child(2) { grid-area: md-2; } } } &.sc_blogger_grid_3 { display: grid; grid-template-columns: 1fr 1fr 1fr 1fr; grid-template-rows: 19.4rem 19.4rem; gap: 30px 30px; grid-template-areas: "md-1 md-1 sm-1 sm-1" "md-1 md-1 sm-2 sm-2"; .sc_blogger_item { &:nth-child(1) { grid-area: md-1; } &:nth-child(2) { grid-area: sm-1; } &:nth-child(3) { grid-area: sm-2; } } } &.sc_blogger_grid_4 { display: grid; grid-template-columns: 1fr 1fr; grid-template-rows: 19.4rem 19.4rem 19.4rem 19.4rem; gap: 30px 30px; grid-template-areas: "md-5 sm-5-1" "md-5 sm-5-2" "lg-5 lg-5" "lg-5 lg-5"; .sc_blogger_item { &:nth-child(1) { grid-area: md-5; } &:nth-child(2) { grid-area: sm-5-1; } &:nth-child(3) { grid-area: sm-5-2; } &:nth-child(4) { grid-area: lg-5; } } } &.sc_blogger_grid_5 { display: grid; grid-template-columns: 1fr 1fr 1fr 1fr; grid-template-rows: 19.4rem 19.4rem 19.4rem 19.4rem; gap: 30px 30px; grid-template-areas: "md-5-1 md-5-1 sm-5-1 sm-5-1" "md-5-1 md-5-1 sm-5-2 sm-5-2" "md-5-2 md-5-2 md-5-3 md-5-3" "md-5-2 md-5-2 md-5-3 md-5-3"; .sc_blogger_item { &:nth-child(1) { grid-area: md-5-1; } &:nth-child(2) { grid-area: sm-5-1; } &:nth-child(3) { grid-area: sm-5-2; } &:nth-child(4) { grid-area: md-5-2; } &:nth-child(5) { grid-area: md-5-3; } } } &.sc_blogger_grid_6 { display: grid; grid-template-columns: 1fr 1fr 1fr 1fr; grid-template-rows: 19.4rem 19.4rem 19.4rem 19.4rem; gap: 30px 30px; grid-template-areas: "md-5-1 md-5-1 sm-5-1 sm-5-1" "md-5-1 md-5-1 sm-5-2 sm-5-2" "sm-5-3 sm-5-3 md-5-2 md-5-2" "sm-5-4 sm-5-4 md-5-2 md-5-2"; .sc_blogger_item { &:nth-child(1) { grid-area: md-5-1; } &:nth-child(2) { grid-area: sm-5-1; } &:nth-child(3) { grid-area: sm-5-2; } &:nth-child(4) { grid-area: md-5-2; } &:nth-child(5) { grid-area: sm-5-3; } &:nth-child(6) { grid-area: sm-5-4; } } } } } /* Grid style 7 */ &.sc_blogger_lay_portfolio_grid_grid_style_7 { .elementor-edit-area & .post_featured_bg.with_thumb[class*="hover_on_"] .trx_addons_image_effect_original_image { display: none; } .sc_blogger_item { position: relative; .sc_blogger_item_body { width: 100%; height: 100%; .post_featured_bg { width: 100%; height: 100%; } .post_featured { overflow: visible; .bg_in_wrap { display: block; position: absolute; top: 0; left: 0; width: 100%; height: 100%; overflow: hidden; .post_thumb { @include abs-cover; @include bg-cover; } .bg_in { transition: all 0.5s ease; transform: scale(1, 1); } } .post_info_bl { width: max-content; height: auto; left: 30px; bottom: 30px; top: auto; right: auto; background-color: transparent; overflow: hidden; padding: 0; opacity: 0; will-change: scroll-position; .sc_blogger_item_title { font-size: 1.33rem; line-height: 1.25em; letter-spacing: 0; font-weight: 500; padding: 10px 22px 12px 18px; background-color: #1F242E; width: 50%; transition: all 0s ease; transition-duration: 0s; transition-delay: 0ms; white-space: nowrap; overflow: hidden; a { color: #ffffff !important; } } .post_meta { width: 30%; margin-top: 5px; transition: all 0s ease; transition-delay: 0ms; transition-duration: 0s; overflow: hidden; .post_categories { font-size: 16px; line-height: 1.4em; padding: 5px 24px 7px 20px; background-color: #323641; white-space: nowrap; > * { color: #ffffff !important; } } } } &:hover { .bg_in_wrap { .post_thumb { @include abs-cover; @include bg-cover; } .bg_in { transform: scale(1.07, 1.07); } } .post_info_bl { opacity: 1; width: auto; max-width: 100vw; .sc_blogger_item_title { width: 100%; transition: all 0.4s ease; transition-delay: 0ms; transition-duration: 0.40s; } .post_meta { width: 100%; transition: all 0.4s ease; transition-delay: 0ms; transition-duration: 0.40s; } } } } } } .sc_blogger_grid_wrap { &.sc_blogger_grid_1 { display: grid; grid-template-columns: 1fr; grid-template-rows: 480px 480px; gap: 0 0; grid-template-areas: "md-1" "md-1"; .sc_blogger_item { &:nth-child(1) { grid-area: md-1; } } } &.sc_blogger_grid_2 { display: grid; grid-template-columns: 1fr 1fr; grid-template-rows: 480px 480px; gap: 0 0; grid-template-areas: "md-1 md-2" "md-1 md-2"; .sc_blogger_item { &:nth-child(1) { grid-area: md-1; } &:nth-child(2) { grid-area: md-2; } } } &.sc_blogger_grid_3 { display: grid; grid-template-columns: 1fr 1fr 1fr 1fr; grid-template-rows: 480px 480px; gap: 0 0; grid-template-areas: "lg-3-1 lg-3-1 md-3-1 md-3-1" "lg-3-1 lg-3-1 md-3-2 md-3-2"; .sc_blogger_item { &:nth-child(1) { grid-area: lg-3-1; } &:nth-child(2) { grid-area: md-3-1; } &:nth-child(3) { grid-area: md-3-2; } } } &.sc_blogger_grid_4 { display: grid; grid-template-columns: 1fr 1fr 1fr 1fr; grid-template-rows: 480px 480px; gap: 0 0; grid-template-areas: "lg-3-1 lg-3-1 md-3-1 md-3-1" "lg-3-1 lg-3-1 sm-3-1 sm-3-2"; .sc_blogger_item { &:nth-child(1) { grid-area: lg-3-1; } &:nth-child(2) { grid-area: md-3-1; } &:nth-child(3) { grid-area: sm-3-1; } &:nth-child(4) { grid-area: sm-3-2; } } } &.sc_blogger_grid_5 { display: grid; grid-template-columns: 1fr 1fr 1fr 1fr; grid-template-rows: 480px 480px; gap: 0 0; grid-template-areas: "lg-7-1 lg-7-1 sm-7-1 sm-7-2" "lg-7-1 lg-7-1 sm-7-3 sm-7-4"; .sc_blogger_item { &:nth-child(1) { grid-area: lg-7-1; } &:nth-child(2) { grid-area: sm-7-1; } &:nth-child(3) { grid-area: sm-7-2; } &:nth-child(4) { grid-area: sm-7-3; } &:nth-child(5) { grid-area: sm-7-4; } } } &.sc_blogger_grid_6 { display: grid; grid-template-columns: 1fr 1fr 1fr 1fr; grid-template-rows: 480px 480px 480px 480px; gap: 0 0; grid-template-areas: "lg-3-1 lg-3-1 md-3-1 md-3-1" "lg-3-1 lg-3-1 md-3-2 md-3-2" "md-3-3 md-3-4 lg-3-2 lg-3-2" "md-3-3 md-3-4 lg-3-2 lg-3-2"; .sc_blogger_item { &:nth-child(1) { grid-area: lg-3-1; } &:nth-child(2) { grid-area: md-3-1; } &:nth-child(3) { grid-area: md-3-2; } &:nth-child(4) { grid-area: md-3-3; } &:nth-child(5) { grid-area: md-3-4; } &:nth-child(6) { grid-area: lg-3-2; } } } &.sc_blogger_grid_7 { display: grid; grid-template-columns: 1fr 1fr 1fr 1fr; grid-template-rows: 480px 480px 480px 480px; gap: 0 0; grid-template-areas: "lg-3-1 lg-3-1 md-3-1 md-3-1" "lg-3-1 lg-3-1 sm-3-1 sm-3-2" "md-3-2 md-3-3 lg-3-2 lg-3-2" "md-3-2 md-3-3 lg-3-2 lg-3-2"; .sc_blogger_item { &:nth-child(1) { grid-area: lg-3-1; } &:nth-child(2) { grid-area: md-3-1; } &:nth-child(3) { grid-area: sm-3-1; } &:nth-child(4) { grid-area: sm-3-2; } &:nth-child(5) { grid-area: md-3-2; } &:nth-child(6) { grid-area: md-3-3; } &:nth-child(7) { grid-area: lg-3-2; } } } &.sc_blogger_grid_8 { display: grid; grid-template-columns: 1fr 1fr 1fr 1fr; grid-template-rows: 480px 480px 480px 480px; gap: 0 0; grid-template-areas: "lg-3-1 lg-3-1 md-3-1 md-3-1" "lg-3-1 lg-3-1 sm-3-1 sm-3-2" "sm-3-3 md-3-2 lg-3-2 lg-3-2" "sm-3-4 md-3-2 lg-3-2 lg-3-2"; .sc_blogger_item { &:nth-child(1) { grid-area: lg-3-1; } &:nth-child(2) { grid-area: md-3-1; } &:nth-child(3) { grid-area: sm-3-1; } &:nth-child(4) { grid-area: sm-3-2; } &:nth-child(5) { grid-area: lg-3-2; } &:nth-child(6) { grid-area: md-3-2; } &:nth-child(7) { grid-area: sm-3-3; } &:nth-child(8) { grid-area: sm-3-4; } } } &.sc_blogger_grid_9 { display: grid; grid-template-columns: 1fr 1fr 1fr 1fr; grid-template-rows: 480px 480px 480px 480px; gap: 0 0; grid-template-areas: "lg-3-1 lg-3-1 sm-3-1 sm-3-2" "lg-3-1 lg-3-1 sm-3-3 sm-3-4" "md-3-1 sm-3-5 lg-3-2 lg-3-2" "md-3-1 sm-3-6 lg-3-2 lg-3-2"; .sc_blogger_item { &:nth-child(1) { grid-area: lg-3-1; } &:nth-child(2) { grid-area: sm-3-1; } &:nth-child(3) { grid-area: sm-3-2; } &:nth-child(4) { grid-area: sm-3-3; } &:nth-child(5) { grid-area: sm-3-4; } &:nth-child(6) { grid-area: md-3-1; } &:nth-child(7) { grid-area: sm-3-5; } &:nth-child(8) { grid-area: sm-3-6; } &:nth-child(9) { grid-area: lg-3-2; } } } &.sc_blogger_grid_10 { display: grid; grid-template-columns: 1fr 1fr 1fr 1fr; grid-template-rows: 480px 480px 480px 480px; gap: 0 0; grid-template-areas: "lg-3-1 lg-3-1 sm-3-1 sm-3-2" "lg-3-1 lg-3-1 sm-3-3 sm-3-4" "sm-3-5 sm-3-6 lg-3-2 lg-3-2" "sm-3-7 sm-3-8 lg-3-2 lg-3-2"; .sc_blogger_item { &:nth-child(1) { grid-area: lg-3-1; } &:nth-child(2) { grid-area: sm-3-1; } &:nth-child(3) { grid-area: sm-3-2; } &:nth-child(4) { grid-area: sm-3-3; } &:nth-child(5) { grid-area: sm-3-4; } &:nth-child(6) { grid-area: sm-3-5; } &:nth-child(7) { grid-area: sm-3-6; } &:nth-child(8) { grid-area: sm-3-7; } &:nth-child(9) { grid-area: sm-3-8; } &:nth-child(10) { grid-area: lg-3-2; } } } &.sc_blogger_grid_11 { display: grid; grid-template-columns: 1fr 1fr 1fr 1fr; grid-template-rows: 480px 480px 480px 480px 480px 480px; gap: 0 0; grid-template-areas: "lg-3-1 lg-3-1 md-3-1 md-3-1" "lg-3-1 lg-3-1 sm-3-1 sm-3-2" "sm-3-3 md-3-2 lg-3-2 lg-3-2" "sm-3-4 md-3-2 lg-3-2 lg-3-2" "lg-3-3 lg-3-3 md-3-3 md-3-4" "lg-3-3 lg-3-3 md-3-3 md-3-4"; .sc_blogger_item { &:nth-child(1) { grid-area: lg-3-1; } &:nth-child(2) { grid-area: md-3-1; } &:nth-child(3) { grid-area: sm-3-1; } &:nth-child(4) { grid-area: sm-3-2; } &:nth-child(5) { grid-area: sm-3-3; } &:nth-child(6) { grid-area: sm-3-4; } &:nth-child(7) { grid-area: md-3-2; } &:nth-child(8) { grid-area: lg-3-2; } &:nth-child(9) { grid-area: lg-3-3; } &:nth-child(10) { grid-area: md-3-3; } &:nth-child(11) { grid-area: md-3-4; } } } &.sc_blogger_grid_12 { display: grid; grid-template-columns: 1fr 1fr 1fr 1fr; grid-template-rows: 480px 480px 480px 480px 480px 480px; gap: 0 0; grid-template-areas: "lg-3-1 lg-3-1 md-3-1 md-3-1" "lg-3-1 lg-3-1 sm-3-1 sm-3-2" "sm-3-3 md-3-2 lg-3-2 lg-3-2" "sm-3-4 md-3-2 lg-3-2 lg-3-2" "lg-3-3 lg-3-3 md-3-3 md-3-3" "lg-3-3 lg-3-3 sm-3-5 sm-3-6"; .sc_blogger_item { &:nth-child(1) { grid-area: lg-3-1; } &:nth-child(2) { grid-area: md-3-1; } &:nth-child(3) { grid-area: sm-3-1; } &:nth-child(4) { grid-area: sm-3-2; } &:nth-child(5) { grid-area: sm-3-3; } &:nth-child(6) { grid-area: sm-3-4; } &:nth-child(7) { grid-area: md-3-2; } &:nth-child(8) { grid-area: lg-3-2; } &:nth-child(9) { grid-area: lg-3-3; } &:nth-child(10) { grid-area: md-3-3; } &:nth-child(11) { grid-area: sm-3-5; } &:nth-child(12) { grid-area: sm-3-6; } } } } } /* Grid style 8 */ &.sc_blogger_lay_portfolio_grid_grid_style_8 { .sc_blogger_item { .sc_blogger_item_body { width: 100%; height: 100%; .post_featured { width: 100%; height: 100%; .link { z-index: 10; display: block; } .post_info_bc { transition: all 0.3s; max-width: unset; @include flex; flex-direction: column; justify-content: center; text-align: center; bottom: 0; left: 0; right: 0; top: 0; padding: 20px; background-color: transparent; transform: none; .sc_blogger_item_title { font-size: 1.33rem; line-height: 1.4em; overflow: hidden; color: var(--theme-color-inverse_link) !important; a { transform: translateY(100%); transition-delay: 150ms; transition: 300ms; transition-duration: 400ms; color: var(--theme-color-inverse_link) !important; text-overflow: ellipsis; max-width: 100%; display: -webkit-box; -webkit-line-clamp: 3; -webkit-box-orient: vertical; display: -moz-box; -moz-line-clamp: 3; -moz-box-orient: vertical; line-clamp: 3; box-orient: vertical; overflow: hidden; } } .post_meta { margin-top: 5px; overflow: hidden; .post_meta_item a, .post_meta_item { color: var(--theme-color-inverse_link) !important; } .post_categories { font-size: 16px; transform: translateY(100%); transition-delay: 0ms; transition: 300ms; transition-duration: 400ms; } } &:before { content: ''; position: absolute; width: 100%; height: 100%; left: 0; top: 0; display: block; z-index: -1; background-color: var(--theme-color-text_link); opacity: 0; transition-delay: 300ms; transition: 300ms; transition-duration: 300ms; } } &:hover { .post_info_bc { &:before { transition: all 0.3s; opacity: 1; transition-duration: 300ms; transition-delay: 0ms; } .sc_blogger_item_title { a { transform: translateY(0); transition-duration: 500ms; transition-delay: 200ms; } } .post_meta { .post_categories { transform: translateY(0); transition-duration: 500ms; transition-delay: 200ms; } } } } } } } .sc_blogger_grid_wrap { &.sc_blogger_grid_1 { display: grid; grid-template-columns: 1fr; grid-template-rows: 480px 480px; gap: 0 0; grid-template-areas: "md-1" "md-1"; .sc_blogger_item { &:nth-child(1) { grid-area: md-1; } } } &.sc_blogger_grid_2 { display: grid; grid-template-columns: 1fr 1fr; grid-template-rows: 480px 480px; gap: 0 0; grid-template-areas: "md-1 md-2" "md-1 md-2"; .sc_blogger_item { &:nth-child(1) { grid-area: md-1; } &:nth-child(2) { grid-area: md-2; } } } &.sc_blogger_grid_3 { display: grid; grid-template-columns: 1fr 1fr 1fr 1fr; grid-template-rows: 480px 480px; gap: 0 0; grid-template-areas: "md-1 md-1 sm-1 sm-1" "md-1 md-1 sm-2 sm-2"; .sc_blogger_item { &:nth-child(1) { grid-area: md-1; } &:nth-child(2) { grid-area: sm-1; } &:nth-child(3) { grid-area: sm-2; } } } &.sc_blogger_grid_4 { display: grid; grid-template-columns: 1fr 1fr 1fr 1fr; grid-template-rows: 480px 480px; gap: 0 0; grid-template-areas: "lg-8-1 lg-8-1 sm-8-1 sm-8-2" "lg-8-1 lg-8-1 md-8-1 md-8-1"; .sc_blogger_item { &:nth-child(1) { grid-area: lg-8-1; } &:nth-child(2) { grid-area: sm-8-1; } &:nth-child(3) { grid-area: sm-8-2; } &:nth-child(4) { grid-area: md-8-1; } } } &.sc_blogger_grid_5 { display: grid; grid-template-columns: 1fr 1fr 1fr 1fr; grid-template-rows: 480px 480px; gap: 0 0; grid-template-areas: "lg-5-1 lg-5-1 sm-5-1 sm-5-2" "lg-5-1 lg-5-1 sm-5-3 sm-5-4"; .sc_blogger_item { &:nth-child(1) { grid-area: lg-5-1; } &:nth-child(2) { grid-area: sm-5-1; } &:nth-child(3) { grid-area: sm-5-2; } &:nth-child(4) { grid-area: sm-5-3; } &:nth-child(5) { grid-area: sm-5-4; } } } &.sc_blogger_grid_6 { display: grid; grid-template-columns: 1fr 1fr 1fr 1fr; grid-template-rows: 480px 480px 480px 480px; gap: 0 0; grid-template-areas: "lg-5-1 lg-5-1 md-5-1 md-5-1" "lg-5-1 lg-5-1 md-5-2 md-5-2" "md-5-3 md-5-3 lg-5-2 lg-5-2" "md-5-4 md-5-4 lg-5-2 lg-5-2"; .sc_blogger_item { &:nth-child(1) { grid-area: lg-5-1; } &:nth-child(2) { grid-area: md-5-1; } &:nth-child(3) { grid-area: md-5-2; } &:nth-child(4) { grid-area: md-5-3; } &:nth-child(5) { grid-area: md-5-4; } &:nth-child(6) { grid-area: lg-5-2; } } } &.sc_blogger_grid_7 { display: grid; grid-template-columns: 1fr 1fr 1fr 1fr; grid-template-rows: 480px 480px 480px 480px; gap: 0 0; grid-template-areas: "lg-5-1 lg-5-1 sm-5-1 sm-5-2" "lg-5-1 lg-5-1 md-5-1 md-5-1" "md-5-2 md-5-2 lg-5-2 lg-5-2" "md-5-3 md-5-3 lg-5-2 lg-5-2"; .sc_blogger_item { &:nth-child(1) { grid-area: lg-5-1; } &:nth-child(2) { grid-area: sm-5-1; } &:nth-child(3) { grid-area: sm-5-2; } &:nth-child(4) { grid-area: md-5-1; } &:nth-child(5) { grid-area: md-5-2; } &:nth-child(6) { grid-area: lg-5-2; } &:nth-child(7) { grid-area: md-5-3; } } } &.sc_blogger_grid_8 { display: grid; grid-template-columns: 1fr 1fr 1fr 1fr; grid-template-rows: 480px 480px 480px 480px; gap: 0 0; grid-template-areas: "lg-5-1 lg-5-1 sm-5-1 sm-5-2" "lg-5-1 lg-5-1 md-5-1 md-5-1" "sm-5-3 sm-5-4 lg-5-2 lg-5-2" "md-5-2 md-5-2 lg-5-2 lg-5-2"; .sc_blogger_item { &:nth-child(1) { grid-area: lg-5-1; } &:nth-child(2) { grid-area: sm-5-1; } &:nth-child(3) { grid-area: sm-5-2; } &:nth-child(4) { grid-area: md-5-1; } &:nth-child(5) { grid-area: sm-5-3; } &:nth-child(6) { grid-area: sm-5-4; } &:nth-child(7) { grid-area: lg-5-2; } &:nth-child(8) { grid-area: md-5-2; } } } &.sc_blogger_grid_9 { display: grid; grid-template-columns: 1fr 1fr 1fr 1fr; grid-template-rows: 480px 480px 480px 480px; gap: 0 0; grid-template-areas: "lg-5-1 lg-5-1 sm-5-1 sm-5-2" "lg-5-1 lg-5-1 md-5-1 md-5-1" "sm-5-3 sm-5-4 lg-5-2 lg-5-2" "sm-5-5 sm-5-6 lg-5-2 lg-5-2"; .sc_blogger_item { &:nth-child(1) { grid-area: lg-5-1; } &:nth-child(2) { grid-area: sm-5-1; } &:nth-child(3) { grid-area: sm-5-2; } &:nth-child(4) { grid-area: md-5-1; } &:nth-child(5) { grid-area: sm-5-3; } &:nth-child(6) { grid-area: sm-5-4; } &:nth-child(7) { grid-area: sm-5-5; } &:nth-child(8) { grid-area: sm-5-6; } &:nth-child(9) { grid-area: lg-5-2; } } } &.sc_blogger_grid_10 { display: grid; grid-template-columns: 1fr 1fr 1fr 1fr; grid-template-rows: 480px 480px 480px 480px; gap: 0 0; grid-template-areas: "lg-5-1 lg-5-1 sm-5-1 sm-5-2" "lg-5-1 lg-5-1 sm-5-3 sm-5-4" "sm-5-5 sm-5-6 lg-5-2 lg-5-2" "sm-5-7 sm-5-8 lg-5-2 lg-5-2"; .sc_blogger_item { &:nth-child(1) { grid-area: lg-5-1; } &:nth-child(2) { grid-area: sm-5-1; } &:nth-child(3) { grid-area: sm-5-2; } &:nth-child(4) { grid-area: sm-5-3; } &:nth-child(5) { grid-area: sm-5-4; } &:nth-child(6) { grid-area: sm-5-5; } &:nth-child(7) { grid-area: sm-5-6; } &:nth-child(8) { grid-area: sm-5-7; } &:nth-child(9) { grid-area: sm-5-8; } &:nth-child(10) { grid-area: lg-5-2; } } } &.sc_blogger_grid_11 { display: grid; grid-template-columns: 1fr 1fr 1fr 1fr; grid-template-rows: 480px 480px 480px 480px 480px 480px; gap: 0 0; grid-template-areas: "lg-5-1 lg-5-1 sm-5-1 sm-5-2" "lg-5-1 lg-5-1 md-5-1 md-5-1" "sm-5-3 sm-5-4 lg-5-2 lg-5-2" "md-5-2 md-5-2 lg-5-2 lg-5-2" "lg-5-3 lg-5-3 md-5-3 md-5-4" "lg-5-3 lg-5-3 md-5-3 md-5-4"; .sc_blogger_item { &:nth-child(1) { grid-area: lg-5-1; } &:nth-child(2) { grid-area: sm-5-1; } &:nth-child(3) { grid-area: sm-5-2; } &:nth-child(4) { grid-area: md-5-1; } &:nth-child(5) { grid-area: sm-5-3; } &:nth-child(6) { grid-area: sm-5-4; } &:nth-child(7) { grid-area: lg-5-2; } &:nth-child(8) { grid-area: md-5-2; } &:nth-child(9) { grid-area: lg-5-3; } &:nth-child(10) { grid-area: md-5-3; } &:nth-child(11) { grid-area: md-5-4; } } } &.sc_blogger_grid_12 { display: grid; grid-template-columns: 1fr 1fr 1fr 1fr; grid-template-rows: 480px 480px 480px 480px 480px 480px; gap: 0 0; grid-template-areas: "lg-5-1 lg-5-1 sm-5-1 sm-5-2" "lg-5-1 lg-5-1 md-5-1 md-5-1" "sm-5-3 sm-5-4 lg-5-2 lg-5-2" "md-5-2 md-5-2 lg-5-2 lg-5-2" "lg-5-3 lg-5-3 sm-5-5 sm-5-6" "lg-5-3 lg-5-3 md-5-3 md-5-3"; .sc_blogger_item { &:nth-child(1) { grid-area: lg-5-1; } &:nth-child(2) { grid-area: sm-5-1; } &:nth-child(3) { grid-area: sm-5-2; } &:nth-child(4) { grid-area: md-5-1; } &:nth-child(5) { grid-area: sm-5-3; } &:nth-child(6) { grid-area: sm-5-4; } &:nth-child(7) { grid-area: lg-5-2; } &:nth-child(8) { grid-area: md-5-2; } &:nth-child(9) { grid-area: lg-5-3; } &:nth-child(10) { grid-area: sm-5-5; } &:nth-child(11) { grid-area: sm-5-6; } &:nth-child(12) { grid-area: md-5-3; } } } } } /* Grid style 9 */ &.sc_blogger_lay_portfolio_grid_grid_style_9 { .elementor-edit-area & .post_featured_bg.with_thumb[class*="hover_on_"] .trx_addons_image_effect_original_image { display: none; } .no_margin .sc_blogger_grid_wrap { gap: 0 !important; + .sc_blogger_grid_wrap { margin-top: 0 !important; } .sc_blogger_item + .sc_blogger_item { margin-top: 0 !important; } } .sc_blogger_item { position: relative; .sc_blogger_item_body { width: 100%; height: 100%; .post_featured_bg { width: 100%; height: 100%; } .post_featured { overflow: visible; .bg_in_wrap { display: block; position: absolute; top: 0; left: 0; width: 100%; height: 100%; overflow: hidden; .post_thumb { @include abs-cover; @include bg-cover; } .bg_in { transition: all 0.5s ease; transform: scale(1, 1); } } .post_info_bl { width: max-content; left: 30px; right: auto; bottom: 30px; top: auto; background-color: transparent; overflow: hidden; padding: 0; opacity: 0; will-change: scroll-position; .sc_blogger_item_title { font-size: 1.33rem; line-height: 1.25em; letter-spacing: 0; font-weight: 600; padding: 10px 19px 12px 19px; background-color: #23201E; width: 50%; transition: all 0s ease; transition-duration: 0s; transition-delay: 0ms; will-change: transform; white-space: nowrap; overflow: hidden; a { color: #ffffff !important; } } .post_meta { margin-top: 5px; transition: all 0s ease; transition-delay: 0ms; transition-duration: 0s; will-change: transform; width: 30%; overflow: hidden; .post_categories { font-size: 16px; line-height: 1.4em; padding: 5px 20px 7px; background-color: #23201E; margin-right: 5px; white-space: nowrap; &:last-child { margin-right: 0; } > * { color: #ffffff !important; } } } } &:hover { .bg_in_wrap { .post_thumb { @include abs-cover; @include bg-cover; } .bg_in { transform: scale(1.07, 1.07); } } .post_info_bl { opacity: 1; width: auto; max-width: 100vw; .sc_blogger_item_title { width: 100%; transition: all 0.40s ease; transition-delay: 0ms; transition-duration: 0.40s; } .post_meta { width: 100%; transition: all 0.40s ease; transition-delay: 0ms; transition-duration: 0.40s; } } } } } } .sc_blogger_grid_wrap { + .sc_blogger_grid_wrap { margin-top: 30px; } &.sc_blogger_grid_1 { display: grid; grid-template-columns: 1fr; grid-template-rows: 300px 300px; gap: 0 0; grid-template-areas: "md-1" "md-1"; .sc_blogger_item { &:nth-child(1) { grid-area: md-1; } } } &.sc_blogger_grid_2 { display: grid; grid-template-columns: 1fr 1fr; grid-template-rows: 300px 300px; gap: 30px 30px; grid-template-areas: "md-1 md-2" "md-1 md-2"; .sc_blogger_item { &:nth-child(1) { grid-area: md-1; } &:nth-child(2) { grid-area: md-2; } } } &.sc_blogger_grid_3 { display: grid; grid-template-columns: 1fr 1fr 1fr 1fr; grid-template-rows: 300px 300px; gap: 30px 30px; grid-template-areas: "lg-3-1 lg-3-1 md-3-1 md-3-2" "lg-3-1 lg-3-1 md-3-1 md-3-2"; .sc_blogger_item { &:nth-child(1) { grid-area: lg-3-1; } &:nth-child(2) { grid-area: md-3-1; } &:nth-child(3) { grid-area: md-3-2; } } } &.sc_blogger_grid_4 { display: grid; grid-template-columns: 1fr 1fr 1fr 1fr; grid-template-rows: 300px 300px; gap: 30px 30px; grid-template-areas: "lg-9-1 lg-9-1 md-9-1 sm-9-1" "lg-9-1 lg-9-1 md-9-1 sm-9-2"; .sc_blogger_item { &:nth-child(1) { grid-area: lg-9-1; } &:nth-child(2) { grid-area: md-9-1; } &:nth-child(3) { grid-area: sm-9-1; } &:nth-child(4) { grid-area: sm-9-2; } } } &.sc_blogger_grid_5 { display: grid; grid-template-columns: 1fr 1fr 1fr 1fr; grid-template-rows: 300px 300px; gap: 30px 30px; grid-template-areas: "lg-7-1 lg-7-1 sm-7-1 sm-7-2" "lg-7-1 lg-7-1 sm-7-3 sm-7-4"; .sc_blogger_item { &:nth-child(1) { grid-area: lg-7-1; } &:nth-child(2) { grid-area: sm-7-1; } &:nth-child(3) { grid-area: sm-7-2; } &:nth-child(4) { grid-area: sm-7-3; } &:nth-child(5) { grid-area: sm-7-4; } } } &.sc_blogger_grid_6 { display: grid; grid-template-columns: 1fr 1fr 1fr 1fr; grid-template-rows: 300px 300px 300px 300px; gap: 30px 30px; grid-template-areas: "lg-3-1 lg-3-1 md-3-1 md-3-2" "lg-3-1 lg-3-1 md-3-1 md-3-2" "md-3-3 md-3-3 lg-3-2 lg-3-2" "md-3-4 md-3-4 lg-3-2 lg-3-2"; .sc_blogger_item { &:nth-child(1) { grid-area: lg-3-1; } &:nth-child(2) { grid-area: md-3-1; } &:nth-child(3) { grid-area: md-3-2; } &:nth-child(4) { grid-area: md-3-3; } &:nth-child(5) { grid-area: md-3-4; } &:nth-child(6) { grid-area: lg-3-2; } } } &.sc_blogger_grid_7 { display: grid; grid-template-columns: 1fr 1fr 1fr 1fr; grid-template-rows: 300px 300px 300px 300px; gap: 30px 30px; grid-template-areas: "lg-9-1 lg-9-1 md-9-1 sm-9-1" "lg-9-1 lg-9-1 md-9-1 sm-9-2" "md-9-2 md-9-2 lg-9-2 lg-9-2" "md-9-3 md-9-3 lg-9-2 lg-9-2"; .sc_blogger_item { &:nth-child(1) { grid-area: lg-9-1; } &:nth-child(2) { grid-area: md-9-1; } &:nth-child(3) { grid-area: sm-9-1; } &:nth-child(4) { grid-area: sm-9-2; } &:nth-child(5) { grid-area: lg-9-2; } &:nth-child(6) { grid-area: md-9-2; } &:nth-child(7) { grid-area: md-9-3; } } } &.sc_blogger_grid_8 { display: grid; grid-template-columns: 1fr 1fr 1fr 1fr; grid-template-rows: 300px 300px 300px 300px; gap: 30px 30px; grid-template-areas: "lg-3-1 lg-3-1 md-3-1 sm-3-1" "lg-3-1 lg-3-1 md-3-1 sm-3-2" "sm-3-3 sm-3-4 lg-3-2 lg-3-2" "md-3-2 md-3-2 lg-3-2 lg-3-2"; .sc_blogger_item { &:nth-child(1) { grid-area: lg-3-1; } &:nth-child(2) { grid-area: md-3-1; } &:nth-child(3) { grid-area: sm-3-1; } &:nth-child(4) { grid-area: sm-3-2; } &:nth-child(5) { grid-area: sm-3-3; } &:nth-child(6) { grid-area: sm-3-4; } &:nth-child(7) { grid-area: md-3-2; } &:nth-child(8) { grid-area: lg-3-2; } } } &.sc_blogger_grid_9 { display: grid; grid-template-columns: 1fr 1fr 1fr 1fr; grid-template-rows: 300px 300px 300px 300px; gap: 30px 30px; grid-template-areas: "lg-7-1 lg-7-1 sm-7-1 sm-7-2" "lg-7-1 lg-7-1 sm-7-3 sm-7-4" "sm-7-5 sm-7-6 lg-7-2 lg-7-2" "md-7-1 md-7-1 lg-7-2 lg-7-2"; .sc_blogger_item { &:nth-child(1) { grid-area: lg-7-1; } &:nth-child(2) { grid-area: sm-7-1; } &:nth-child(3) { grid-area: sm-7-2; } &:nth-child(4) { grid-area: sm-7-3; } &:nth-child(5) { grid-area: sm-7-4; } &:nth-child(6) { grid-area: sm-7-5; } &:nth-child(7) { grid-area: sm-7-6; } &:nth-child(8) { grid-area: md-7-1; } &:nth-child(9) { grid-area: lg-7-2; } } } &.sc_blogger_grid_10 { display: grid; grid-template-columns: 1fr 1fr 1fr 1fr; grid-template-rows: 300px 300px 300px 300px; gap: 30px 30px; grid-template-areas: "lg-7-1 lg-7-1 sm-7-1 sm-7-2" "lg-7-1 lg-7-1 sm-7-3 sm-7-4" "sm-7-5 sm-7-6 lg-7-2 lg-7-2" "sm-7-7 sm-7-8 lg-7-2 lg-7-2"; .sc_blogger_item { &:nth-child(1) { grid-area: lg-7-1; } &:nth-child(2) { grid-area: sm-7-1; } &:nth-child(3) { grid-area: sm-7-2; } &:nth-child(4) { grid-area: sm-7-3; } &:nth-child(5) { grid-area: sm-7-4; } &:nth-child(6) { grid-area: sm-7-5; } &:nth-child(7) { grid-area: sm-7-6; } &:nth-child(8) { grid-area: sm-7-7; } &:nth-child(9) { grid-area: sm-7-8; } &:nth-child(10) { grid-area: lg-7-2; } } } &.sc_blogger_grid_11 { display: grid; grid-template-columns: 1fr 1fr 1fr 1fr; grid-template-rows: 300px 300px 300px 300px 300px 300px; gap: 30px 30px; grid-template-areas: "lg-3-1 lg-3-1 md-3-1 sm-3-1" "lg-3-1 lg-3-1 md-3-1 sm-3-2" "md-3-2 md-3-2 lg-3-2 lg-3-2" "md-3-3 md-3-3 lg-3-2 lg-3-2" "lg-3-3 lg-3-3 md-3-4 md-3-4" "lg-3-3 lg-3-3 sm-3-3 sm-3-4"; .sc_blogger_item { &:nth-child(1) { grid-area: lg-3-1; } &:nth-child(2) { grid-area: md-3-1; } &:nth-child(3) { grid-area: sm-3-1; } &:nth-child(4) { grid-area: sm-3-2; } &:nth-child(5) { grid-area: md-3-2; } &:nth-child(6) { grid-area: md-3-3; } &:nth-child(7) { grid-area: lg-3-2; } &:nth-child(8) { grid-area: lg-3-3; } &:nth-child(9) { grid-area: md-3-4; } &:nth-child(10) { grid-area: sm-3-3; } &:nth-child(11) { grid-area: sm-3-4; } } } &.sc_blogger_grid_12 { display: grid; grid-template-columns: 1fr 1fr 1fr 1fr; grid-template-rows: 300px 300px 300px 300px 300px 300px; gap: 30px 30px; grid-template-areas: "lg-3-1 lg-3-1 md-3-1 sm-3-1" "lg-3-1 lg-3-1 md-3-1 sm-3-2" "sm-3-3 sm-3-4 lg-3-2 lg-3-2" "md-3-2 md-3-2 lg-3-2 lg-3-2" "lg-3-3 lg-3-3 md-3-3 md-3-3" "lg-3-3 lg-3-3 sm-3-5 sm-3-6"; .sc_blogger_item { &:nth-child(1) { grid-area: lg-3-1; } &:nth-child(2) { grid-area: md-3-1; } &:nth-child(3) { grid-area: sm-3-1; } &:nth-child(4) { grid-area: sm-3-2; } &:nth-child(5) { grid-area: sm-3-3; } &:nth-child(6) { grid-area: sm-3-4; } &:nth-child(7) { grid-area: md-3-2; } &:nth-child(8) { grid-area: lg-3-2; } &:nth-child(9) { grid-area: lg-3-3; } &:nth-child(10) { grid-area: md-3-3; } &:nth-child(11) { grid-area: sm-3-5; } &:nth-child(12) { grid-area: sm-3-6; } } } } } /* grid Style 13 */ &.sc_blogger_lay_portfolio_grid_grid_style_13 { .no_margin .sc_blogger_grid_wrap { gap: 0 !important; + .sc_blogger_grid_wrap { margin-top: 0 !important; } .sc_blogger_item + .sc_blogger_item { margin-top: 0 !important; } } .sc_blogger_item { .sc_blogger_item_body { width: 100%; height: 100%; .post_featured_bg { width: 100%; height: 100%; } .post_featured { .link { z-index: 10; display: block; } .post_info_bl { opacity: 0; transition: all 0.3s; transform: scale(0.8); max-width: unset; @include flex; flex-direction: column; justify-content: flex-end; bottom: 10px; left: 10px; right: 10px; top: 10px; padding: 20px 35px 26px; background-color: var(--theme-color-bg_color); will-change: transform; .sc_blogger_item_title { line-height: 1.2em; font-size: 1.33rem; overflow: hidden; text-overflow: ellipsis; max-width: 100%; display: -webkit-box; -webkit-line-clamp: 3; -webkit-box-orient: vertical; display: -moz-box; -moz-line-clamp: 3; -moz-box-orient: vertical; line-clamp: 3; box-orient: vertical; padding-bottom: 2px; a { color: var(--theme-color-text_dark) !important; } } .post_meta { margin-top: 1px; .post_meta_item a, .post_meta_item { color: var(--theme-color-alter_text)!important; } .post_categories { font-size: 16px; width: 100%; overflow: hidden; text-overflow: ellipsis; max-width: 100%; display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; display: -moz-box; -moz-line-clamp: 2; -moz-box-orient: vertical; line-clamp: 2; box-orient: vertical; } } } &:hover { .post_info_bl { opacity: 1; transition: all 0.3s; transform: scale(1); } } } } } .sc_blogger_grid_wrap { + .sc_blogger_grid_wrap { margin-top: 30px; } &.sc_blogger_grid_1 { display: grid; grid-template-columns: 1fr; grid-template-rows: 300px 300px; gap: 0 0; grid-template-areas: "md-1" "md-1"; .sc_blogger_item { &:nth-child(1) { grid-area: md-1; } } } &.sc_blogger_grid_2 { display: grid; grid-template-columns: 1fr 1fr; grid-template-rows: 300px 300px; gap: 30px 30px; grid-template-areas: "md-1 md-2" "md-1 md-2"; .sc_blogger_item { &:nth-child(1) { grid-area: md-1; } &:nth-child(2) { grid-area: md-2; } } } &.sc_blogger_grid_3 { display: grid; grid-template-columns: 1fr 1fr 1fr; grid-template-rows: 300px 300px; gap: 30px 30px; grid-template-areas: "lg-13-1 lg-13-1 sm-13-1" "lg-13-1 lg-13-1 sm-13-2"; .sc_blogger_item { &:nth-child(1) { grid-area: lg-13-1; } &:nth-child(2) { grid-area: sm-13-1; } &:nth-child(3) { grid-area: sm-13-2; } } } &.sc_blogger_grid_4 { display: grid; grid-template-columns: 1fr 1fr 1fr; grid-template-rows: 300px 300px 300px; gap: 30px 30px; grid-template-areas: "lg-13-1 lg-13-1 sm-13-1" "lg-13-1 lg-13-1 md-13-1" "md-13-2 md-13-2 md-13-1"; .sc_blogger_item { &:nth-child(1) { grid-area: lg-13-1; } &:nth-child(2) { grid-area: sm-13-1; } &:nth-child(3) { grid-area: md-13-1; } &:nth-child(4) { grid-area: md-13-2; } } } &.sc_blogger_grid_5 { display: grid; grid-template-columns: 1fr 1fr 1fr; grid-template-rows: 300px 300px 300px; gap: 30px 30px; grid-template-areas: "lg-13-1 lg-13-1 sm-13-1" "lg-13-1 lg-13-1 sm-13-2" "sm-13-3 md-13-1 md-13-1"; .sc_blogger_item { &:nth-child(1) { grid-area: lg-13-1; } &:nth-child(2) { grid-area: sm-13-1; } &:nth-child(3) { grid-area: sm-13-3; } &:nth-child(4) { grid-area: sm-13-2; } &:nth-child(5) { grid-area: md-13-1; } } } &.sc_blogger_grid_6 { display: grid; grid-template-columns: 1fr 1fr 1fr 1fr; grid-template-rows: 300px 300px 300px; gap: 30px 30px; grid-template-areas: "sm-13-2 lg-13-1 lg-13-1 sm-13-1" "md-13-3 lg-13-1 lg-13-1 md-13-1" "md-13-3 md-13-2 md-13-2 md-13-1"; .sc_blogger_item { &:nth-child(1) { grid-area: lg-13-1; } &:nth-child(2) { grid-area: sm-13-1; } &:nth-child(3) { grid-area: md-13-1; } &:nth-child(4) { grid-area: md-13-2; } &:nth-child(5) { grid-area: md-13-3; } &:nth-child(6) { grid-area: sm-13-2; } } } &.sc_blogger_grid_7 { display: grid; grid-template-columns: 1fr 1fr 1fr 1fr; grid-template-rows: 300px 300px 300px; gap: 30px 30px; grid-template-areas: "sm-13-4 lg-13-1 lg-13-1 sm-13-1" "md-13-2 lg-13-1 lg-13-1 sm-13-2" "md-13-2 sm-13-3 md-13-1 md-13-1"; .sc_blogger_item { &:nth-child(1) { grid-area: lg-13-1; } &:nth-child(2) { grid-area: sm-13-1; } &:nth-child(3) { grid-area: sm-13-2; } &:nth-child(4) { grid-area: md-13-1; } &:nth-child(5) { grid-area: sm-13-3; } &:nth-child(6) { grid-area: md-13-2; } &:nth-child(7) { grid-area: sm-13-4; } } } &.sc_blogger_grid_8 { display: grid; grid-template-columns: 1fr 1fr 1fr 1fr; grid-template-rows: 300px 300px 300px 300px; gap: 30px 30px; grid-template-areas: "sm-13-4 lg-13-1 lg-13-1 sm-13-1" "sm-13-3 lg-13-1 lg-13-1 md-13-1" "lg-13-2 lg-13-2 sm-13-2 md-13-1" "lg-13-2 lg-13-2 md-13-2 md-13-2"; .sc_blogger_item { &:nth-child(1) { grid-area: lg-13-1; } &:nth-child(2) { grid-area: sm-13-1; } &:nth-child(3) { grid-area: lg-13-2; } &:nth-child(4) { grid-area: md-13-1; } &:nth-child(5) { grid-area: md-13-2; } &:nth-child(6) { grid-area: sm-13-2; } &:nth-child(7) { grid-area: sm-13-3; } &:nth-child(8) { grid-area: sm-13-4; } } } &.sc_blogger_grid_9 { display: grid; grid-template-columns: 1fr 1fr 1fr 1fr; grid-template-rows: 300px 300px 300px 300px; gap: 30px 30px; grid-template-areas: "sm-13-4 lg-13-1 lg-13-1 sm-13-1" "md-13-2 lg-13-1 lg-13-1 sm-13-2" "md-13-2 sm-13-3 md-13-1 md-13-1" "md-13-4 md-13-4 md-13-3 md-13-3"; .sc_blogger_item { &:nth-child(1) { grid-area: lg-13-1; } &:nth-child(2) { grid-area: sm-13-1; } &:nth-child(3) { grid-area: sm-13-2; } &:nth-child(4) { grid-area: md-13-1; } &:nth-child(5) { grid-area: sm-13-3; } &:nth-child(6) { grid-area: md-13-2; } &:nth-child(7) { grid-area: sm-13-4; } &:nth-child(8) { grid-area: md-13-3; } &:nth-child(9) { grid-area: md-13-4; } } } &.sc_blogger_grid_10 { display: grid; grid-template-columns: 1fr 1fr 1fr 1fr; grid-template-rows: 300px 300px 300px 300px 300px; gap: 30px 30px; grid-template-areas: "sm-13-4 lg-13-1 lg-13-1 sm-13-1" "md-13-2 lg-13-1 lg-13-1 sm-13-2" "md-13-2 sm-13-3 md-13-1 md-13-1" "lg-13-2 lg-13-2 md-13-3 md-13-4" "lg-13-2 lg-13-2 md-13-3 md-13-4"; .sc_blogger_item { &:nth-child(1) { grid-area: lg-13-1; } &:nth-child(2) { grid-area: sm-13-1; } &:nth-child(3) { grid-area: sm-13-2; } &:nth-child(4) { grid-area: md-13-1; } &:nth-child(5) { grid-area: sm-13-3; } &:nth-child(6) { grid-area: md-13-2; } &:nth-child(7) { grid-area: sm-13-4; } &:nth-child(8) { grid-area: lg-13-2; } &:nth-child(9) { grid-area: md-13-3; } &:nth-child(10) { grid-area: md-13-4; } } } &.sc_blogger_grid_11 { display: grid; grid-template-columns: 1fr 1fr 1fr 1fr; grid-template-rows: 300px 300px 300px 300px 300px; gap: 30px 30px; grid-template-areas: "sm-13-4 lg-13-1 lg-13-1 sm-13-1" "md-13-2 lg-13-1 lg-13-1 sm-13-2" "md-13-2 sm-13-3 md-13-1 md-13-1" "lg-13-2 lg-13-2 sm-13-5 md-13-4" "lg-13-2 lg-13-2 sm-13-6 md-13-4"; .sc_blogger_item { &:nth-child(1) { grid-area: lg-13-1; } &:nth-child(2) { grid-area: sm-13-1; } &:nth-child(3) { grid-area: sm-13-2; } &:nth-child(4) { grid-area: md-13-1; } &:nth-child(5) { grid-area: sm-13-3; } &:nth-child(6) { grid-area: md-13-2; } &:nth-child(7) { grid-area: sm-13-4; } &:nth-child(8) { grid-area: lg-13-2; } &:nth-child(9) { grid-area: md-13-4; } &:nth-child(10) { grid-area: sm-13-5; } &:nth-child(11) { grid-area: sm-13-6; } } } &.sc_blogger_grid_12 { display: grid; grid-template-columns: 1fr 1fr 1fr 1fr; grid-template-rows: 300px 300px 300px 300px 300px; gap: 30px 30px; grid-template-areas: "sm-13-4 lg-13-1 lg-13-1 sm-13-1" "md-13-2 lg-13-1 lg-13-1 sm-13-2" "md-13-2 sm-13-3 md-13-1 md-13-1" "md-13-4 md-13-5 sm-13-5 md-13-6" "md-13-4 md-13-5 sm-13-6 md-13-6"; .sc_blogger_item { &:nth-child(1) { grid-area: lg-13-1; } &:nth-child(2) { grid-area: sm-13-1; } &:nth-child(3) { grid-area: sm-13-2; } &:nth-child(4) { grid-area: md-13-1; } &:nth-child(5) { grid-area: sm-13-3; } &:nth-child(6) { grid-area: md-13-2; } &:nth-child(7) { grid-area: sm-13-4; } &:nth-child(8) { grid-area: md-13-4; } &:nth-child(9) { grid-area: md-13-5; } &:nth-child(10) { grid-area: sm-13-5; } &:nth-child(11) { grid-area: sm-13-6; } &:nth-child(12) { grid-area: md-13-6; } } } } } } /* Over Image Portfolio */ html.portfolio_preview_opened { overflow-y: hidden !important; height: 100%; } .sc_blogger_portmodern { width: 100%; height: 100%; @include flex; align-content: center; align-items: center; justify-content: center; padding-top: 10%; padding-bottom: 5%; min-height: 100vh; z-index: auto; .sc_item_filters_wrap { position: relative; z-index: 2; .sc_item_filters { padding-bottom: 0; margin-bottom: 4rem; border-bottom: none; } } .elementor-section-boxed & { .decor_image_wrap { left: -30px; width: calc(100% + 60px); } } .decor_image_wrap { position: absolute; top: 0 !important; left: 0; width: 100%; height: 100%; z-index: 0; overflow: hidden; .image_item { position: absolute; top: 0; left: 0; background-size: cover; background-position: center; background-repeat: no-repeat; width: 100%; height: 100%; opacity: 0; transition: opacity 0.5s ease, transform 4s ease; &.active_image { opacity: 0.8; transform: scale(1.04); } } } .sc_blogger_content { max-width: var(--theme-var-page); margin: 0 auto; .sc_blogger_item { display: inline-block; padding-right: 3rem; margin-right: 3rem; padding-bottom: 2rem; position: relative; &:after { content: '/'; position: absolute; right: 0; bottom: 2.55rem; color: var(--theme-color-bd_color); font-size: 2rem; opacity: 1; transition: opacity 0.3s ease; } &:last-child { padding-right: 0; margin-right: 0; &:after { display: none; } } .sc_blogger_item_body { .sc_blogger_item_title { opacity: 1; transition: all 0.2s ease-in-out; will-change: opacity; &:hover { cursor: pointer; } &.anim_fade { opacity: 0; } } } } &.active_items { .sc_blogger_item { &:after { opacity: 0.1; } .sc_blogger_item_body { .sc_blogger_item_title { opacity: 0.1; &.active_item { //animation: colorInAnimPort 0.2s ease-out both; opacity: 1; color: var(--theme-color-text_link); } } } } } } .portfolio_preview { display: none; position: fixed; top: 0; left: 0; z-index: 9999999 !important; width: 100vw; height: 100vh; background-color: var(--theme-color-bg_color); opacity: 0; will-change: opacity; .inner_preview { @include flex; flex-direction: row; width: 100%; height: 100%; .portfolio_image { width: 55%; height: 100%; background-position: center; background-repeat: no-repeat; background-size: cover; flex: 0 0 auto; z-index: 1; } .close { position: absolute; top: 3em; right: 4em; width: 41px; height: 41px; line-height: 1em; text-align: center; color: var(--theme-color-text_dark); transition: 0.3s ease; will-change: transform; opacity: 1; font-size: 21px; animation: transformAnimOutPort .4s ease-out both; padding: 10px; background-color: var(--theme-color-bg_color); border-radius: 50%; z-index: 2 !important; &:before { content: '\E9E1'; font-family: $theme_icons; position: relative; opacity: 0.3; } &:hover { cursor: pointer; animation: transformAnimInPort .4s ease-out both; } } .portfolio_description { padding: 5rem 10% 2rem 7%; width: auto; @include flex; align-content: center; height: auto; z-index: 1; .post_details { overflow-y: auto; overflow-x: hidden; padding-right: 25px; display: block; height: 100%; // Firefox scrollbar-width: thin; // WebKit-based browsers &::-webkit-scrollbar { width: 6px; } &::-webkit-scrollbar-track { background: var(--theme-color-alter_bd_color); } &::-webkit-scrollbar-thumb { background-color: var(--theme-color-text_dark); } .post_title { margin-bottom: 40px; } .post_description { .portfolio_page_details { .portfolio_page_details_item { &_title { color: var(--theme-color-text_dark); font-weight: 500; } &_value { color: var(--theme-color-text_light); font-weight: inherit; } + .portfolio_page_details_item { margin-top: 10px; } + .portfolio_page_details_button_link { margin-top: 1em; } &.portfolio_page_details_share { margin-top: 1.8em; padding-top: 1.8em; border-top: 1px solid var(--theme-color-text_dark_015); .portfolio_page_details_item_title { color: var(--theme-color-text_dark); font-weight: 500; } .socials_share { .social_items { .social_item { margin: 0 2em 8px 0; &:last-child { margin-right: 0 !important; } } } } } } } .post_description_content { margin-top: 1.4em; color: var(--theme-color-text_dark); } .post_readmore { margin-top: 3em; box-shadow: none; } } } } } &.portfolio_preview_show { display: block; opacity: 1; animation: fadeInAnimPort .3s ease-out both; + .sc_item_filters_wrap .sc_item_posts_container .sc_blogger_item:after, + .sc_item_posts_container .sc_blogger_item:after { display: none; } .portfolio_description { .post_details { .post_title { animation: fadeInUpAnimPort .3s 100ms ease-out both; } .post_description { .portfolio_page_details { animation: fadeInUpAnimPort .3s 200ms ease-out both; } .post_description_content { animation: fadeInUpAnimPort .3s 300ms ease-out both; } .post_readmore { animation: fadeInUpAnimPort .3s 400ms ease-out both; } } } } } } } /* Portfolio Anim */ @-webkit-keyframes fadeInAnimPort { 0% {opacity: 0;} 100% {opacity: 1;} } @keyframes fadeInAnimPort { 0% {opacity: 0;} 100% {opacity: 1;} } @-webkit-keyframes colorInAnimPort { 0% { opacity: 0.1; color: var(--theme-color-text_dark); } 100% { opacity: 1; color: var(--theme-color-text_link); } } @keyframes colorInAnimPort { 0% { opacity: 0.1; color: var(--theme-color-text_dark); } 100% { opacity: 1; color: var(--theme-color-text_link); } } @-webkit-keyframes fadeInUpAnimPort { 0% {opacity: 0; -webkit-transform: translateY(20px)} 100% {opacity: 1; -webkit-transform: translateY(0)} } @keyframes fadeInUpAnimPort { 0% {opacity: 0; transform: translateY(20px)} 100% {opacity: 1; transform: translateY(0)} } @-webkit-keyframes transformAnimInPort { 0% {@include transform(rotate(0));} 100% {@include transform(rotate(360deg));} } @keyframes transformAnimInPort { 0% {@include transform(rotate(0));} 100% {@include transform(rotate(360deg));} } @-webkit-keyframes transformAnimOutPort { 0% {@include transform(rotate(360deg));} 100% {@include transform(rotate(0));} } @keyframes transformAnimOutPort { 0% {@include transform(rotate(360deg));} 100% {@include transform(rotate(0));} } /* Portfolio Estate */ .sc_blogger_portestate { .sc_blogger_filters { padding-bottom: 3em; margin-bottom: 0 !important; border-bottom: none; } .sc_blogger_item { background-color: var(--theme-color-alter_bg_color); .post_featured { display: block; } .sc_blogger_item_content { padding: 1.35em 2.2em 1.5em; > .sc_blogger_item_meta:last-child { margin-bottom: 0 !important; } .sc_blogger_item_meta { @include font(16px, 1.3em); margin: 5px 0 16px 0; .post_sponsored { display: none; } .post_categories { width: 100%; a { color: var(--theme-color-alter_light); } } } .portfolio_page_details { .portfolio_page_details_item { font-size: 16px; &_title { color: var(--theme-color-alter_dark); font-weight: 500; width: 40%; padding-right: 0.5em; } &_value { color: var(--theme-color-alter_light); font-weight: 400; text-align: right; width: 60%; } + .portfolio_page_details_item { margin-top: 8px; padding-top: 6px; border-top: 1px solid var(--theme-color-bd_color); } } } } } } /* Single Portfolio */ .single-cpt_portfolio .portfolio_page_gallery { .sc_slider_controls.slider_pagination_style_bullets .slider_pagination_bullet, .slider_container .slider_pagination_wrap .swiper-pagination-bullet, .slider_outer .slider_pagination_wrap .swiper-pagination-bullet, .swiper-pagination-custom .swiper-pagination-button { border-color: var(--theme-color-alter_bd_color); background-color: var(--theme-color-alter_bd_color); &:hover, &.swiper-pagination-bullet-active { border-color: var(--theme-color-alter_link); background-color: var(--theme-color-alter_link); } } .slider_outer.slider_outer_pagination_pos_bottom_outside .swiper-pagination-bullets { margin-top: 2.3rem; } .slider_container.slider_controls_side { .slider_controls_wrap > a { background-color: var(--theme-color-bg_color); border-color: var(--theme-color-bg_color); &.slider_prev { margin-left: 30px; } &.slider_next { margin-right: 30px; } } &:hover { .slider_controls_wrap > a { &.slider_prev { margin-left: 30px; } &.slider_next { margin-right: 30px; } } } } } .portfolio_page { .portfolio_page_title { max-width: 80%; margin-top: 0; margin-bottom: 1.2em; } .portfolio_page_title + .portfolio_page_meta { display: none; } .portfolio_page_video { margin-bottom: var(--theme-var-grid_gap); } .portfolio_page_content { margin-bottom: 1.5em; & > { h1:first-child, h2:first-child, h3:first-child, h4:first-child, h5:first-child, h6:first-child { margin-top: 0 !important; } } p:last-child { margin-bottom: 0; } } .portfolio_page_details_wrap { .portfolio_page_subtitle { font-size: 1.94rem; line-height: 1.08em; } .portfolio_page_description { p:last-child { margin-bottom: 0; } } .portfolio_page_details { .portfolio_page_details_button_link:first-child { margin-top: 0; } .portfolio_page_details_item { .portfolio_page_details_item_title { font-size: 1rem; font-weight: 500; color: var(--theme-color-text_dark); width: 30%; } .portfolio_page_details_item_value { font-size: 1rem; font-weight: 400; color: var(--theme-color-text); width: 70%; } &.portfolio_page_details_share { padding-top: 0; border-top: none; margin-top: 1.9em !important; .portfolio_page_details_item_title { display: none; + .portfolio_page_details_item_value { width: 100%; } } .portfolio_page_details_item_value { width: 100%; } .socials_wrap { margin-right: 0; margin-bottom: -15px; .social_item { margin: 0 35px 15px 0; font-size: 17px; } } } + .portfolio_page_details_item { margin-top: 11px; } + .portfolio_page_details_button_link { margin-top: 1.9em !important; } } } &.light_style { .portfolio_page_details { .portfolio_page_details_item { .portfolio_page_details_item_title { font-weight: 400; color: var(--theme-color-text_light); } .portfolio_page_details_item_value { color: var(--theme-color-text_dark); } + .portfolio_page_details_item { margin-top: 1px; } } + .portfolio_page_description { margin-top: 1.4em; } } .socials_share { margin-top: 1.9em !important; .social_items { .social_item { margin: 0 8px 8px 0; font-size: 17px; width: 42px; height: 42px; line-height: 42px; border: 1px solid var(--theme-color-bd_color); @include border-radius(50%); color: var(--theme-color-text_dark); &:hover { color: var(--theme-color-text_link); } } } } } } .portfolio_page_content_wrap { .portfolio_page_featured { + .portfolio_page_content { margin-top: 30px; } } .portfolio_page_gallery:last-child { margin-bottom: 0; } } &.portfolio_page_details_right, &.portfolio_page_details_left { .sc_column_fixed { &.portfolio_page_details_wrap { top: 4em; } } .portfolio_page_details_wrap { width: 37%; .portfolio_page_subtitle { margin-top: -4px; margin-bottom: 26px; } .portfolio_page_description { + .portfolio_page_details { padding-top: 35px; } } &.light_style { width: 34%; .portfolio_page_subtitle { margin-top: 1px; } } } .light_style + .portfolio_page_content_wrap { width: 66%; } .portfolio_page_video, .portfolio_page_gallery, .portfolio_page_content_wrap { width: 63%; } .portfolio_page_content_wrap { .portfolio_page_video, .portfolio_page_gallery { width: 100%; } } } &.portfolio_page_details_left { .portfolio_page_video, .portfolio_page_gallery { margin-left: auto; margin-right: 0; } } &.portfolio_page_details_bottom, &.portfolio_page_details_top { .portfolio_page_details_wrap { margin-bottom: 1.4em; .portfolio_page_subtitle { margin-bottom: 26px; } .portfolio_page_description { width: 74%; + .portfolio_page_details { padding-left: 3em; } } .portfolio_page_details { width: 26%; .portfolio_page_details_item { .portfolio_page_details_item_title { width: 40%; } .portfolio_page_details_item_value { width: 60%; } &.portfolio_page_details_share { margin-top: 1.5em !important; } + .portfolio_page_details_item { margin-top: 13px; } } } } } } body.body_style_wide:not(.expand_content) { .portfolio_page_details_left, .portfolio_page_details_right { .portfolio_page_details_wrap { .portfolio_page_details { .portfolio_page_details_item { .portfolio_page_details_item_value, .portfolio_page_details_item_title { display: block; width: 100%; padding-right: 0; } } } } } .portfolio_page_details_left { .portfolio_page_details_wrap { padding-right: 2em; } } .portfolio_page_details_right { .portfolio_page_details_wrap { padding-left: 2em; } } } body.body_style_wide:not(.expand_content) { .portfolio_page_details_top, .portfolio_page_details_bottom { .portfolio_page_details_wrap .portfolio_page_description { width: 100%; } .portfolio_page_details_wrap .portfolio_page_details { width: 100%; } .portfolio_page_details_wrap .portfolio_page_description + .portfolio_page_details { padding-left: 0; margin-top: 1.5em; } .portfolio_page_details .portfolio_page_details_item .portfolio_page_details_item_title { width: 15%; } } } /* Portfolio single navigation */ .single-cpt_portfolio { .post-navigation { .nav-links { @include flex; flex-direction: row; justify-content: space-between; align-items: center; margin-top: 5em; .nav-next, .nav-previous { a { font-size: 14px; font-weight: 700; letter-spacing: 1px; text-transform: uppercase; color: var(--theme-color-text_dark); &:hover { color: var(--theme-color-text_link); } span { &:after, &:before { content: ''; font-family: $theme_icons; font-size: 12px; font-weight: 400; position: relative; top: -1px; } } } } .nav-previous { a { span { &:before { content: '\EA07'; padding-right: 13px; } } } } .nav-next { a { span { &:after { content: '\E9A4'; padding-left: 13px; } } } } } } } /* Blogger */ .sidebar_inner { .sc_blogger .sc_blogger_item_title + .sc_blogger_item_excerpt, .sc_blogger .sc_blogger_item_meta + .sc_blogger_item_excerpt { margin-top: 0.5em; } .sc_blogger .sc_blogger_columns_wrap > div + div { margin-top: 1.5em; } } /* more_link */ .sc_blogger { .sc_blogger_item_button .item_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: 1px; color: var(--theme-color-text_dark); z-index: 1; overflow: hidden; .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; } } .link_text { position: relative; margin-top: 1px; margin-right: 0; display: inline-block; vertical-align: middle; text-indent: -110px; visibility: hidden; white-space: nowrap; opacity: 0; @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; } } .sc_blogger_item:hover .sc_blogger_item_button .item_more_link, .sc_blogger_item_body:hover .sc_blogger_item_button .item_more_link, .sc_blogger_item_button .item_more_link:hover { .link_text { opacity: 1; text-indent: 0; margin-right: 9px; visibility: visible; @include transition(visibility .4s ease, margin-right .3s ease-out, text-indent .4s ease-out, opacity .4s ease); } } } // Title max height in specific types .sc_blogger_list.sc_blogger_list_hover_2 .sc_blogger_item_title, .sc_blogger_default.sc_blogger_default_over_bottom .sc_blogger_item_title, .sc_blogger_default.sc_blogger_default_over_centered_hover .sc_item_featured [class*="post_info_"] .sc_blogger_item_title, .sc_blogger_default.sc_blogger_default_over_centered_hover_3 .sc_item_featured [class*="post_info_"] .sc_blogger_item_title, .sc_blogger_default.sc_blogger_default_over_centered_hover_2 .sc_item_featured [class*="post_info_"] .sc_blogger_item_title { max-height: 4.9em; overflow: hidden; padding-bottom: 2px; } .sc_blogger .sc_blogger_item_featured .post_meta_label { display: inline-block; } /* blogger_default + masonry */ .sc_blogger.sc_blogger_default .masonry_wrap .sc_blogger_item_featured { margin-bottom: 0; } /* default -> classic */ .sc_blogger_default.sc_blogger_default_classic { .sc_blogger_item_default.sc_blogger_item_image_position_top .sc_blogger_item_featured { margin-bottom: 0; + .sc_blogger_item_content { margin-top: 1em; } } .sc_blogger_item_body:hover { .post_featured.hover_link.with_thumb > .bg_in, .post_featured.hover_link img { -webkit-transform: scale(1.07, 1.07); -ms-transform: scale(1.07, 1.07); transform: scale(1.07, 1.07); } } /* bullets */ .slider_container.slider_pagination_pos_bottom .swiper-pagination-bullets .swiper-pagination-bullet, .slider_outer.slider_outer_pagination_pos_bottom .swiper-pagination-bullets .swiper-pagination-bullet, .slider_outer.slider_outer_pagination_pos_bottom_outside .swiper-pagination-bullets .swiper-pagination-bullet { margin: 0 6px; background-color: #E2E1E0; border-color: #E2E1E0; opacity: 1; width: 8px; height: 8px; } .swiper-pagination-custom .swiper-pagination-button.swiper-pagination-button-active, .sc_slider_controls.slider_pagination_style_bullets .slider_pagination_bullet.swiper-pagination-bullet-active, .sc_slider_controls.slider_pagination_style_bullets .slider_pagination_bullet:hover, .slider_container .slider_pagination_wrap .swiper-pagination-bullet.swiper-pagination-bullet-active, .slider_outer .slider_pagination_wrap .swiper-pagination-bullet.swiper-pagination-bullet-active, .slider_container .slider_pagination_wrap .swiper-pagination-bullet:hover, .slider_outer .slider_pagination_wrap .swiper-pagination-bullet:hover { border-color: var(--theme-color-text_link); background-color: var(--theme-color-text_link); } /* title */ .sc_blogger_item_title { font-size: 24px; line-height: 1.2em; font-weight: 600; a { color: var(--theme-color-text_dark); &:hover { color: var(--theme-color-text); } } } .sc_item_columns_1, .sc_item_columns_2, .sc_item_columns_3 { .sc_blogger_item_title { font-size: 28px; } } .slider_outer_centered { .sc_blogger_item_title { font-size: 28px; line-height: 1.2em; } .sc_blogger_item_default.sc_blogger_item_image_position_top .sc_blogger_item_featured + .sc_blogger_item_content { margin-top: 1.2em; } } /* meta */ .post_meta { margin-top: 0.9em; } /* meta -> top cat */ .post_meta_categories { margin: 0 0 0.9em; text-transform: uppercase; font-weight: 700; letter-spacing: 1px; .post_meta_item, .post_meta_item a { color: var(--theme-color-text_dark); } .post_meta_item a:hover { color: var(--theme-color-text_link); } .post_sponsored { .post_sponsored_label { color: var(--theme-color-text_link); } a.post_sponsored_label:hover { color: var(--theme-color-text_dark); } } } } /* default -> classic_simple */ .sc_blogger_default.sc_blogger_default_classic_simple { &.sc_blogger_item_image_position_left .sc_blogger_item_content, &.sc_blogger_item_image_position_alter.sc_blogger_item_odd .sc_blogger_item_content { padding-left: 2.2em; } &.sc_blogger_item_image_position_right .sc_blogger_item_content { padding-right: 2.2em; } .sc_blogger_content .sc_blogger_item_default + .sc_blogger_item_default { margin-top: 30px; } .sc_blogger_item_body:hover { .post_featured.hover_link.with_thumb > .bg_in, .post_featured.hover_link img { -webkit-transform: scale(1.07, 1.07); -ms-transform: scale(1.07, 1.07); transform: scale(1.07, 1.07); } } /* title */ .sc_blogger_item_title { font-size: 28px; line-height: 1.2em; a { color: var(--theme-color-text_dark); &:hover { color: var(--theme-color-text); } } } /* meta */ .post_meta { margin: 0 0 1.1em 0; .post_meta_item.post_categories { text-transform: uppercase; font-weight: 700; letter-spacing: 1px; color: var(--theme-color-text_dark); a { color: var(--theme-color-text_dark); } a:hover { color: var(--theme-color-text_link); } } } /* on plate */ .sc_blogger_item_default.sc_blogger_item_on_plate .sc_blogger_item_body:hover { .post_featured.hover_link.with_thumb > .bg_in, .post_featured.hover_link.with_thumb > img { -webkit-transform: scale(1.07, 1.07); -ms-transform: scale(1.07, 1.07); transform: scale(1.07, 1.07); } } .sc_blogger_item_default.sc_blogger_item_on_plate .sc_blogger_item_content { padding: 40px 50px; .sc_blogger_item_title + .sc_blogger_item_excerpt, .sc_blogger_item_meta + .sc_blogger_item_excerpt { margin-top: 0.8em; } .sc_blogger_item_title + .sc_blogger_item_button, .sc_blogger_item_meta + .sc_blogger_item_button, .sc_blogger_item_excerpt + .sc_blogger_item_button { margin-top: 1em; } .sc_blogger_item_excerpt { font-size: 17px; } .sc_blogger_item_excerpt:after { display: none; } } .sc_blogger_item_default.sc_blogger_item_on_plate.sc_blogger_item_image_position_top { .sc_blogger_item_content { border: 1px solid var(--theme-color-alter_bd_color); @include box-shadow(0 3px 30px var(--theme-color-text_dark_003)); } .sc_blogger_item_featured + .sc_blogger_item_content { border-top: none; } } /* link */ .sc_blogger_item_button .item_more_link { .link_text { display: none; } .link_icon { width: 17px; height: 20px; line-height: 20px; overflow: hidden; position: relative; @include transition-all(0.4s); will-change: transform; &:before { top: 0; right: 1px; position: absolute; display: block; font-size: 11px; font-weight: 400; line-height: 20px; content: '\e9e2'; } } } .sc_blogger_item:hover .sc_blogger_item_button .item_more_link:hover .link_icon, .sc_blogger_item:hover .sc_blogger_item_button .item_more_link .link_icon { width: 38px; } } /* default -> classic_3 */ .sc_blogger_default.sc_blogger_default_classic_3 { .sc_blogger_item:hover { .post_featured.hover_link.with_thumb > .bg_in, .post_featured.hover_link img { -webkit-transform: scale(1.07, 1.07); -ms-transform: scale(1.07, 1.07); transform: scale(1.07, 1.07); } } /* title */ .sc_blogger_item_title { font-size: 28px; line-height: 1.2em; a { color: var(--theme-color-text_dark); &:hover { color: var(--theme-color-text); } } } /* meta */ .post_meta { margin: 0 0 1em 0; .post_meta_item.post_categories { text-transform: uppercase; font-weight: 700; letter-spacing: 1px; color: var(--theme-color-text_dark); a, a:hover { color: var(--theme-color-text_dark); } } } /* on plate */ .sc_blogger_item_default.sc_blogger_item_on_plate { @include box-shadow(0 3px 20px var(--theme-color-text_dark_003)); height: auto; } .sc_blogger_item_default.sc_blogger_item_on_plate .sc_blogger_item_content { padding: 25px 32px; .sc_blogger_item_title + .sc_blogger_item_excerpt, .sc_blogger_item_meta + .sc_blogger_item_excerpt { margin-top: 0.8em; } .sc_blogger_item_title + .sc_blogger_item_button, .sc_blogger_item_meta + .sc_blogger_item_button, .sc_blogger_item_excerpt + .sc_blogger_item_button { margin-top: 0.7em; } .sc_blogger_item_excerpt { font-size: 17px; } .sc_blogger_item_excerpt:after { display: none; } } .sc_blogger_item_default.sc_blogger_item_on_plate.sc_blogger_item_image_position_top { .sc_blogger_item_header { margin: 0; padding: 25px 32px; background-color: var(--theme-color-alter_bg_color); border-top: 2px solid var(--theme-color-alter_bg_color); @include transition-all(0.4s); } &:hover .sc_blogger_item_header { border-color: var(--theme-color-alter_dark); } } /* link */ .sc_blogger_item_button .item_more_link { font-size: 14px; } } /* default -> classic_time */ .sc_blogger_default.sc_blogger_default_classic_time { /* title */ .sc_blogger_item_title { font-size: 28px; line-height: 1.2em; a { color: var(--theme-color-text_dark); &:hover { color: var(--theme-color-text); } } } /* meta */ .post_meta { margin: 0 0 0.9em 0; .post_meta_item.post_categories { text-transform: uppercase; font-weight: 700; letter-spacing: 1px; color: var(--theme-color-text_dark); a { color: var(--theme-color-text_dark); } a:hover { color: var(--theme-color-text_link); } } } /* date */ .post_meta.sc_blogger_item_meta.post_meta_date { padding: 0; font-size: 13px; line-height: 1em; font-weight: 600; text-transform: uppercase; display: inline-block; width: 100%; .post_date { width: auto; min-width: 67px; max-width: 100px; padding: 17px 15px 16px; text-align: center; display: inline-block; @include box-sizing(border-box); background-color: var(--theme-color-text_dark); color: var(--theme-color-inverse_hover); } b { margin-top: -7px; font-size: 35px; line-height: 1em; font-weight: 600; display: block; margin-bottom: 5px; } a, a:hover { color: var(--theme-color-inverse_hover); } } /* on plate */ .sc_blogger_item_default.sc_blogger_item_on_plate { @include box-shadow(0 3px 20px var(--theme-color-text_dark_003)); height: auto; .sc_blogger_item_body:hover { .post_featured.hover_link.with_thumb > .bg_in, .post_featured.hover_link img { -webkit-transform: scale(1.07, 1.07); -ms-transform: scale(1.07, 1.07); transform: scale(1.07, 1.07); } } } .sc_blogger_item_default.sc_blogger_item_on_plate .sc_blogger_item_content { padding: 42px 38px; position: relative; z-index: 9; @include transform(translateZ(99px)); .sc_blogger_item_title + .sc_blogger_item_excerpt, .sc_blogger_item_meta + .sc_blogger_item_excerpt { margin-top: 0.8em; } .sc_blogger_item_title + .sc_blogger_item_button, .sc_blogger_item_meta + .sc_blogger_item_button, .sc_blogger_item_excerpt + .sc_blogger_item_button { margin-top: 1em; } .sc_blogger_item_excerpt { font-size: 17px; } .sc_blogger_item_excerpt:after { display: none; } } .sc_blogger_item_default.sc_blogger_item_on_plate.sc_blogger_item_image_position_top { position: relative; z-index: 1; .post_meta.sc_blogger_item_meta.post_meta_date { margin: 0; text-align: right; position: absolute; right: 30px; top: -42px; width: auto; z-index: 9999; } } /* link */ .sc_blogger_item_button .item_more_link { .link_text { display: none; } .link_icon { width: 17px; height: 20px; line-height: 20px; overflow: hidden; position: relative; @include transition-all(0.4s); will-change: transform; &:before { top: 0; right: 1px; position: absolute; display: block; font-size: 11px; font-weight: 400; line-height: 20px; content: '\e9e2'; } } } .sc_blogger_item:hover .sc_blogger_item_button .item_more_link:hover .link_icon, .sc_blogger_item:hover .sc_blogger_item_button .item_more_link .link_icon { width: 38px; } } /* default -> classic_time_2 */ .sc_blogger_default.sc_blogger_default_classic_time_2 { .sc_blogger_item_body:hover { .post_featured.hover_link.with_thumb > .bg_in, .post_featured.hover_link img { -webkit-transform: scale(1.07, 1.07); -ms-transform: scale(1.07, 1.07); transform: scale(1.07, 1.07); } } .sc_blogger_item_default.sc_blogger_item_image_position_top .sc_blogger_item_featured + .sc_blogger_item_content { margin-top: 1.5em; } .sc_blogger_item_content { position: relative; .sc_blogger_item_excerpt:after { display: none; } > .post_meta.sc_blogger_item_meta.post_meta_date { position: absolute; left: 0; top: 0; ~ * { margin-left: 100px; } } } .sc_blogger_item_title + .sc_blogger_item_excerpt, .sc_blogger_item_meta + .sc_blogger_item_excerpt { margin-top: 0.8em; } /* post_info */ .sc_item_featured [class*="post_info_"] { padding: 30px; background: transparent !important; .post_meta_item.post_categories a { &:hover, &:focus { background-color: var(--theme-color-text_hover2) !important; color: var(--theme-color-inverse_link) !important; } } } /* cat */ .post_meta.sc_blogger_item_meta.post_meta_categories { margin: 0; .post_category { margin: 0; } .post_categories { color: transparent !important; } .post_meta_item.post_categories a { @include border-radius(0); background-color: var(--theme-color-text_link2); color: var(--theme-color-inverse_link); text-transform: uppercase; padding: 6px 16px; @include box-sizing(border-box); font-size: 11px; line-height: 14px; letter-spacing: 1px; margin: 4px 0 4px 0; display: inline-block; &:hover, &:focus { background-color: var(--theme-color-text_dark); color: var(--theme-color-inverse_hover); } } .post_meta_item.post_sponsored .post_sponsored_label { @include border-radius(0); background-color: var(--theme-color-text_link); color: var(--theme-color-inverse_link); text-transform: uppercase; padding: 6px 16px; @include box-sizing(border-box); font-size: 11px; line-height: 14px; letter-spacing: 1px; margin: 4px 0 4px 0; display: inline-block; } .post_meta_item.post_sponsored:after { color: var(--theme-color-alter_bg_color_07); } .post_meta_item.post_sponsored a.post_sponsored_label:hover { background-color: var(--theme-color-text_dark); color: var(--theme-color-inverse_hover); } } /* title */ .sc_blogger_item_title { font-size: 35px; line-height: 1.2em; a, a:hover { color: var(--theme-color-text_dark); } } /* meta */ .post_meta { margin: 1.1em 0 0 0; .post_meta_item.post_categories { text-transform: uppercase; font-weight: 700; letter-spacing: 1px; color: var(--theme-color-text_dark); a { color: var(--theme-color-text_dark); } a:hover { color: var(--theme-color-text_link); } } } /* date */ .post_meta.sc_blogger_item_meta.post_meta_date { padding: 0; margin: 0; font-size: 13px; line-height: 1em; font-weight: 600; letter-spacing: 1px; text-transform: uppercase; display: inline-block; width: auto; .post_date { width: 65px; padding: 0; text-align: center; display: inline-block; @include box-sizing(border-box); color: var(--theme-color-text_dark); } b { font-size: 48px; line-height: 1em; font-weight: 600; display: block; margin-top: 2px; margin-bottom: 5px; } a, a:hover { color: var(--theme-color-text_dark); } } /* on plate */ .sc_blogger_item_default.sc_blogger_item_on_plate { height: auto; } } /* default -> over_bottom */ .sc_blogger_default.sc_blogger_default_over_bottom { .sc_item_featured { .mask { background-color: rgba(0,0,0,0.6); opacity: 1 !important; } &:hover { .mask { background-color: rgba(0,0,0,0.75); } } } .sc_item_featured [class*="post_info_"] { padding: 45px; background-color: transparent; max-width: 100%; width: 100%; @include box-sizing(border-box); /* meta */ .post_meta { margin: 0 0 1.1em 0; a { color: #D2D3D5; } a:hover { color: #ffffff; } .post_meta_item.post_categories { text-transform: uppercase; font-weight: 700; letter-spacing: 1px; color: var(--theme-color-inverse_link); a { color: var(--theme-color-inverse_link); } a:hover { color: #D2D3D5; } } } .sc_blogger_item_button .item_more_link { color: var(--theme-color-inverse_link); } } /* title */ .sc_blogger_item_title { font-size: 28px; line-height: 1.2em; a, a:hover { color: var(--theme-color-inverse_link); } } /* link */ .sc_blogger_item_button .item_more_link { .link_text { display: none; } .link_icon { width: 17px; height: 20px; line-height: 20px; overflow: hidden; position: relative; @include transition-all(0.4s); will-change: transform; &:before { top: 0; right: 1px; position: absolute; display: block; font-size: 11px; font-weight: 400; line-height: 20px; content: '\e9e2'; } } } .sc_blogger_item:hover .sc_blogger_item_button .item_more_link:hover .link_icon, .sc_blogger_item:hover .sc_blogger_item_button .item_more_link .link_icon { width: 38px; } } /* default -> over_centered_hover */ .sc_blogger_default.sc_blogger_default_over_centered_hover { /* divider */ .trx_addons_columns_wrap.no_margin { overflow: hidden; > [class*="trx_addons_column-"] .sc_blogger_item { &:before, &:after { content: ''; display: block; position: absolute; z-index: 99; background-color: var(--theme-color-alter_bd_color); } &:before { height: 1px; width: 100%; top: -1px; right: 0; } &:after { height: 100%; width: 1px; top: 0; right: -1px; } } > [class*="trx_addons_column-"]:last-child .sc_blogger_item:after { display: none; } } .sc_item_featured { &:hover .mask, .mask { background-color: rgba(0,0,0,0.65); opacity: 1 !important; } } .sc_item_featured [class*="post_info_"] { padding: 40px 48px 20px; max-width: calc(100% + 2px); min-width: calc(100% + 2px); min-height: calc(100% + 2px); width: calc(100% + 2px); height: calc(100% + 2px); text-align: left; @include box-sizing(border-box); @include flex; flex-direction: column; justify-content: center; background-color: var(--theme-color-alter_bg_color); color: var(--theme-color-alter_text); @include transition(all 0.4s ease-out); .sc_blogger_item_excerpt { font-size: 17px; } .sc_blogger_item_title + .sc_blogger_item_excerpt, .sc_blogger_item_meta + .sc_blogger_item_excerpt { margin-top: 0.9em; } /* meta */ .post_meta { margin: 0 0 1.1em 0; @include transition(inherit); a { @include transition(inherit); } a:hover, a { color: var(--theme-color-alter_light); } .post_meta_item.post_categories { text-transform: uppercase; font-weight: 700; letter-spacing: 1px; color: var(--theme-color-text_dark); @include transition(inherit); a { @include transition(inherit); } a:hover, a { color: var(--theme-color-text_dark); } } .post_meta_item.post_sponsored .post_sponsored_label { color: var(--theme-color-text_link); } } /* title */ .sc_blogger_item_title { margin: 0 !important; font-size: 28px; line-height: 1.2em; @include transition(inherit); a { @include transition(inherit); } a, a:hover { color: var(--theme-color-text_dark); } } /* link */ .sc_blogger_item_button .item_more_link { color: var(--theme-color-text_dark); .link_text { color: currentColor; } } } /* hover */ .sc_item_featured:hover [class*="post_info_"] { color: #D2D3D5; background-color: transparent !important; .post_meta { color: #96999F; a { color: #96999F; } a:hover { color: #ffffff; } .post_meta_item.post_categories { color: var(--theme-color-inverse_link); a { color: var(--theme-color-inverse_link); } a:hover { color: #D2D3D5; } } .post_meta_item.post_sponsored .post_sponsored_label { color: var(--theme-color-inverse_link); } .post_meta_item.post_sponsored a.post_sponsored_label:hover { color: #D2D3D5; } } .sc_blogger_item_title { a, a:hover { color: #FCFCFC; } } .sc_blogger_item_button .item_more_link { color: #F9F9F9; } } .sc_blogger_item_body:hover .sc_blogger_item_button .item_more_link, .sc_blogger_item_body .sc_blogger_item_button .item_more_link:hover { .link_text { transition-delay: 0.1s; } } } /* default -> over_centered_hover_2 */ .sc_blogger_default.sc_blogger_default_over_centered_hover_2 { .slider_controls_wrap > a { z-index: 99; } // audio format .format-audio .post_featured.without_thumb { .post_audio:not(.with_iframe) { padding: 25px; } .post_info_mc { position: relative !important; top: 0; left: 0; right: 0; @include transform(none); opacity: 1 !important; } [class*="post_info_"] { opacity: 1 !important; } .post_info_mc { padding: 25px !important; } [class*="post_info_"] .post_meta.sc_blogger_item_meta.post_meta_categories { position: relative !important; top: 0 !important; left: 0 !important; } [class*="post_info_"] .post_meta .post_meta_item:after, [class*="post_info_"] .post_meta a, &:hover [class*="post_info_"] .post_meta .post_meta_item:after, &:hover [class*="post_info_"] .post_meta a { color: var(--theme-color-text_light); } [class*="post_info_"] .post_meta a:hover, &:hover [class*="post_info_"] .post_meta a:hover { color: var(--theme-color-text_link); } [class*="post_info_"] .sc_blogger_item_title a, &:hover [class*="post_info_"] .sc_blogger_item_title a { color: var(--theme-color-text_dark); } [class*="post_info_"] .sc_blogger_item_title a:hover, &:hover [class*="post_info_"] .sc_blogger_item_title a:hover { color: var(--theme-color-text_link); } } .sc_blogger_item_body { > .post_info_mc { padding: 25px; .post_meta { margin: 0 0 1em 0; } .post_meta:not(.post_meta_categories) { margin: 1em 0 0 0; } } .sc_blogger_item_title { margin: 0 !important; font-size: 28px; line-height: 1.2em; } .sc_blogger_item_excerpt { font-size: 17px; } .sc_blogger_item_title + .sc_blogger_item_excerpt, .sc_blogger_item_meta + .sc_blogger_item_excerpt { margin-top: 0.9em; } } .sc_item_featured { &:hover .mask, .mask { background-color: rgba(0,0,0,0.5); opacity: 1 !important; } } .sc_item_featured [class*="post_info_"] { padding: 45px 40px; max-width: calc(100% + 4px); min-width: calc(100% + 4px); min-height: calc(100% + 4px); max-height: calc(100% + 4px); width: calc(100% + 4px); height: calc(100% + 4px); text-align: left; @include box-sizing(border-box); @include flex; flex-direction: column; justify-content: flex-end; background-color: var(--theme-color-alter_bg_color); color: var(--theme-color-alter_text); @include transition(all 0.4s ease-out); .sc_blogger_item_excerpt { font-size: 17px; } .sc_blogger_item_title + .sc_blogger_item_excerpt, .sc_blogger_item_meta + .sc_blogger_item_excerpt { margin-top: 0.9em; } /* cat */ .post_meta.sc_blogger_item_meta.post_meta_categories { margin: 0; position: absolute; top: 45px; left: 40px; right: 40px; .post_categories { color: transparent !important; font-weight: 700; } .post_meta_item.post_categories a { @include transition-all(0.3s); @include border-radius(0); background-color: var(--theme-color-text_link2); color: var(--theme-color-inverse_link); text-transform: uppercase; padding: 6px 16px; @include box-sizing(border-box); font-size: 11px; line-height: 14px; letter-spacing: 1px; margin: 4px 0 4px 0; display: inline-block; &:hover, &:focus { background-color: var(--theme-color-text_hover2); color: var(--theme-color-inverse_link); } } .post_meta_item.post_sponsored .post_sponsored_label { @include transition-all(0.3s); @include border-radius(0); background-color: var(--theme-color-text_link); color: var(--theme-color-inverse_link); text-transform: uppercase; padding: 6px 16px; @include box-sizing(border-box); font-size: 11px; line-height: 14px; letter-spacing: 1px; margin: 4px 0 4px 0; display: inline-block; } .post_meta_item.post_sponsored a.post_sponsored_label:hover { background-color: var(--theme-color-text_hover2); color: var(--theme-color-inverse_link); } } /* meta */ .post_meta { margin: 1.1em 0 0 0; @include transition(inherit); .post_meta_item:after, a { @include transition(inherit); } a:hover, a { color: var(--theme-color-alter_light); } } /* title */ .sc_blogger_item_title { margin: 0 !important; font-size: 28px; line-height: 1.2em; @include transition(inherit); a { @include transition(inherit); } a, a:hover { color: var(--theme-color-text_dark); } } } /* hover */ .sc_item_featured:hover [class*="post_info_"] { color: #D2D3D5; background-color: transparent !important; .post_meta { color: #ffffff; .post_meta_item:after, a { color: #ffffff; } a:hover { color: #F6F6F6; } } .sc_blogger_item_title { a, a:hover { color: #FCFCFC; } } } } /* default -> over_centered_hover_3 */ .sc_blogger_default.sc_blogger_default_over_centered_hover_3 { .slider_controls_wrap > a { z-index: 99; } // audio format .format-audio .post_featured.without_thumb { .post_audio:not(.with_iframe) { padding: 25px; } .post_info_mc { position: relative !important; top: 0; left: 0; @include transform(none); opacity: 1 !important; } [class*="post_info_"] { opacity: 1 !important; } .post_info_mc { padding: 25px !important; } [class*="post_info_"] .post_meta.sc_blogger_item_meta.post_meta_categories { position: relative !important; top: 0 !important; left: 0 !important; } [class*="post_info_"] .post_meta .post_meta_item:after, [class*="post_info_"] .post_meta a, &:hover [class*="post_info_"] .post_meta .post_meta_item:after, &:hover [class*="post_info_"] .post_meta a { color: var(--theme-color-text_light); } [class*="post_info_"] .post_meta a:hover, &:hover [class*="post_info_"] .post_meta a:hover { color: var(--theme-color-text_link); } [class*="post_info_"] .sc_blogger_item_title a, &:hover [class*="post_info_"] .sc_blogger_item_title a { color: var(--theme-color-text_dark); } [class*="post_info_"] .sc_blogger_item_title a:hover, &:hover [class*="post_info_"] .sc_blogger_item_title a:hover { color: var(--theme-color-text_link); } } .sc_item_featured { .mask { background-color: var(--theme-color-inverse_dark) !important; opacity: 0 !important; } &:hover .mask { opacity: 0.9 !important; } } .sc_blogger_item_body { > .post_info_mc { padding: 25px; .post_meta { margin: 0 0 1em 0; } .post_meta:not(.post_meta_categories) { margin: 1em 0 0 0; } } .sc_blogger_item_title { margin: 0 !important; font-size: 28px; line-height: 1.2em; } .sc_blogger_item_excerpt { font-size: 17px; } .sc_blogger_item_title + .sc_blogger_item_excerpt, .sc_blogger_item_meta + .sc_blogger_item_excerpt { margin-top: 0.9em; } } .sc_item_featured [class*="post_info_"] { padding: 45px 40px; max-width: 100%; width: 100%; height: 100%; text-align: left; @include box-sizing(border-box); @include flex; flex-direction: column; justify-content: flex-end; background-color: transparent !important; color: var(--theme-color-alter_text); @include transition(all 0.4s ease-out); opacity: 0; .sc_blogger_item_excerpt { font-size: 17px; } .sc_blogger_item_title + .sc_blogger_item_excerpt, .sc_blogger_item_meta + .sc_blogger_item_excerpt { margin-top: 0.9em; } /* cat */ .post_meta.sc_blogger_item_meta.post_meta_categories { margin: 0; position: absolute; top: 45px; left: 40px; .post_categories { color: transparent !important; font-weight: 700; } .post_meta_item.post_categories a { @include transition-all(0.3s); @include border-radius(0); background-color: var(--theme-color-text_link2); color: var(--theme-color-inverse_link); text-transform: uppercase; padding: 6px 16px; @include box-sizing(border-box); font-size: 11px; line-height: 14px; letter-spacing: 1px; margin: 4px 0 4px 0; display: inline-block; &:hover, &:focus { background-color: var(--theme-color-text_hover2); color: var(--theme-color-inverse_link); } } .post_meta_item.post_sponsored .post_sponsored_label { @include transition-all(0.3s); @include border-radius(0); background-color: var(--theme-color-text_link); color: var(--theme-color-inverse_link); text-transform: uppercase; padding: 6px 16px; @include box-sizing(border-box); font-size: 11px; line-height: 14px; letter-spacing: 1px; margin: 4px 0 4px 0; display: inline-block; } .post_meta_item.post_sponsored a.post_sponsored_label:hover { background-color: var(--theme-color-text_hover2); color: var(--theme-color-inverse_link); } } /* meta */ .post_meta { margin: 1.1em 0 0 0; @include transition(inherit); .post_meta_item:after, a { @include transition(inherit); } } /* title */ .sc_blogger_item_title { margin: 0 !important; font-size: 28px; line-height: 1.2em; @include transition(inherit); a { @include transition(inherit); } } } /* hover */ .sc_item_featured [class*="post_info_"], .sc_item_featured:hover [class*="post_info_"] { color: #D2D3D5; background-color: transparent !important; .post_meta { color: #ffffff; .post_meta_item:after, a { color: #ffffff; } a:hover { color: #F6F6F6; } } .sc_blogger_item_title { a, a:hover { color: #FCFCFC; } } } .sc_item_featured:hover [class*="post_info_"] { opacity: 1; } } /* list global */ .sc_blogger_item_list.sc_blogger_item_with_image.sc_blogger_item_image_position_left .sc_blogger_item_title, .sc_blogger_item_list.sc_blogger_item_with_image.sc_blogger_item_image_position_right .sc_blogger_item_title, .sc_blogger_item_list.sc_blogger_item_with_image.sc_blogger_item_image_position_alter .sc_blogger_item_title { margin-top: 0 !important; } .sc_blogger_item_list .sc_blogger_item_meta .post_meta_label { display: inherit; } /* list -> simple */ .sc_blogger_list.sc_blogger_list_simple { /* decor */ .sc_blogger_item_body { position: relative; padding: 0 0 0 50px; &:before { position: absolute; left: 0; top: 9px; width: 35px; height: 2px; content: ""; display: block; background-color: var(--theme-color-text_dark); } } .sc_blogger_item_on_plate .sc_blogger_item_body { padding: 10px; &:before { display: none !important; } } /* title */ .sc_blogger_item_title { font-size: 28px; line-height: 1.2em; a { color: var(--theme-color-text_dark); &:hover { color: var(--theme-color-text); } } } /* meta */ .post_meta { margin: 0 0 1.1em 0; .post_meta_item.post_categories { text-transform: uppercase; font-weight: 700; letter-spacing: 1px; color: var(--theme-color-text_dark); a { color: var(--theme-color-text_dark); } a:hover { color: var(--theme-color-text_link); } } } // more link .sc_blogger_item_title + .sc_blogger_item_button, .sc_blogger_item_meta + .sc_blogger_item_button { margin-top: 1em; } } /* list -> hover */ .sc_blogger_list.sc_blogger_list_hover { .sc_blogger_content .sc_blogger_item_list { margin-bottom: 0; padding-bottom: 0; border-bottom: none; } .sc_blogger_content .sc_blogger_item_list.sc_blogger_item_image_position_top + .sc_blogger_item_list.sc_blogger_item_image_position_top { margin-top: 5em; } /* title */ .sc_blogger_item_title { font-size: 28px; line-height: 1.28em; a:hover, a { color: var(--theme-color-text_dark); } } /* meta */ .post_meta { margin: 0 0 1.1em 0; .post_meta_item.post_categories { text-transform: uppercase; font-weight: 700; letter-spacing: 1px; color: var(--theme-color-text_dark); a { color: var(--theme-color-text_dark); } a:hover { color: var(--theme-color-text_link); } } } // more link .sc_blogger_item_title + .sc_blogger_item_button, .sc_blogger_item_meta + .sc_blogger_item_button { margin-top: 1em; } .sc_blogger_item_button .item_more_link { position: relative; display: inline-block; top: auto; left: auto; height: auto; width: auto; @include font(15px, 21px, 500); color: var(--theme-color-text_dark); z-index: 1; overflow: hidden; .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; } } .link_text { position: relative; margin-right: 0; display: inline-block; vertical-align: middle; text-indent: -110px; visibility: hidden; white-space: nowrap; opacity: 0; @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; } } .sc_blogger_item_body:hover .sc_blogger_item_button .item_more_link, .sc_blogger_item_body .sc_blogger_item_button .item_more_link: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, opacity .4s ease); } } } /* list -> with image */ .sc_blogger_list.sc_blogger_list_with_image { .sc_blogger_item_body:hover { .post_featured.hover_link.with_thumb > .bg_in, .post_featured.hover_link img { -webkit-transform: scale(1.07, 1.07); -ms-transform: scale(1.07, 1.07); transform: scale(1.07, 1.07); } } .post_featured.with_thumb.default-featured-size { @include border-radius(50%); } .sc_blogger_content .sc_blogger_item_list { margin-bottom: 30px; padding-bottom: 30px; &:last-child { margin-bottom: 0; padding-bottom: 0; } } .sc_blogger_item_list.sc_blogger_item_image_position_left .sc_blogger_item_body, .sc_blogger_item_list.sc_blogger_item_image_position_right .sc_blogger_item_body, .sc_blogger_item_list.sc_blogger_item_image_position_alter .sc_blogger_item_body { overflow: hidden; display: -webkit-flex; display: -ms-flexbox; @include flex; -webkit-flex-direction: row; -ms-flex-direction: row; flex-direction: row; -webkit-flex-wrap: nowrap; -ms-flex-wrap: nowrap; flex-wrap: nowrap; -webkit-align-items: center; -ms-flex-align: center; align-items: center; } /* title */ .sc_blogger_item_title { font-size: 24px; line-height: 1.2em; padding-bottom: 3px; a { color: var(--theme-color-text_dark); &:hover { color: var(--theme-color-text); } } } /* meta */ .post_meta { margin: 0 0 0.5em 0; .post_meta_item.post_categories { text-transform: uppercase; font-weight: 700; letter-spacing: 1px; color: var(--theme-color-text_dark); a { color: var(--theme-color-text_dark); } a:hover { color: var(--theme-color-text_link); } } } // more link .sc_blogger_item_title + .sc_blogger_item_button, .sc_blogger_item_meta + .sc_blogger_item_button { margin-top: 1em; } .sc_blogger_item_button .item_more_link { position: relative; display: inline-block; top: auto; left: auto; height: auto; width: auto; @include font(15px, 21px, 500); color: var(--theme-color-text_dark); z-index: 1; overflow: hidden; .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; } } .link_text { position: relative; margin-right: 0; display: inline-block; vertical-align: middle; text-indent: -110px; visibility: hidden; white-space: nowrap; opacity: 0; @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; } } .sc_blogger_item_body:hover .sc_blogger_item_button .item_more_link, .sc_blogger_item_body .sc_blogger_item_button .item_more_link: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, opacity .4s ease); } } } /* list -> hover 2 */ .sc_blogger_list.sc_blogger_list_hover_2 { //.sc_blogger_item_body { // position: relative; // > .link { // @include abs-cover(10); // } //} .no_margin .sc_blogger_item:hover { @include box-shadow(inherit); } .sc_blogger_item { background-color: var(--theme-color-alter_bg_color); position: relative; @include box-shadow(0 0 0 rgba(0,0,0,0)); @include transition-all(0.3s); &:hover { @include box-shadow(0 5px 30px 0 rgba(0,0,0,0.08)); } &:before { content: ' '; width: 0; height: 0; display: inline-block; vertical-align: top; margin-left: -0.3em; padding-top: 102%; } .sc_blogger_item_body { padding: 20px 60px; @include flex; flex-direction: column; justify-content: center; position: absolute; left: 0; top: 0; bottom: 0; height: 100%; z-index: 1; > .link { @include abs-cover(10); } } .sc_blogger_item_excerpt { font-size: 17px; } .sc_blogger_item_title + .sc_blogger_item_excerpt, .sc_blogger_item_meta + .sc_blogger_item_excerpt { margin-top: 0.8em; } } .sc_blogger_content .sc_blogger_item_list { margin-bottom: 0; padding-bottom: 0; border-bottom: none; } .sc_blogger_content .sc_blogger_item_list.sc_blogger_item_image_position_top + .sc_blogger_item_list.sc_blogger_item_image_position_top { margin-top: 5em; } /* title */ .sc_blogger_item_title { font-size: 28px; line-height: 1.2em; a:hover, a { color: var(--theme-color-text_dark); } } /* meta */ .post_meta { margin: 0 0 1.1em 0; .post_meta_item.post_categories { text-transform: uppercase; font-weight: 700; letter-spacing: 1px; color: var(--theme-color-text_dark); a { color: var(--theme-color-text_dark); } a:hover { color: var(--theme-color-text_link); } } } // more link .sc_blogger_item_title + .sc_blogger_item_button, .sc_blogger_item_meta + .sc_blogger_item_button { margin-top: 1em; } /* link */ .sc_blogger_item_button .item_more_link { .link_text { display: none; } .link_icon { width: 17px; height: 20px; line-height: 20px; overflow: hidden; position: relative; @include transition-all(0.4s); will-change: transform; &:before { top: 0; right: 1px; position: absolute; display: block; font-size: 11px; font-weight: 400; line-height: 20px; content: '\e9e2'; } } } .sc_blogger_item:hover .sc_blogger_item_button .item_more_link:hover .link_icon, .sc_blogger_item:hover .sc_blogger_item_button .item_more_link .link_icon { width: 38px; } } /* blogger news */ .sc_blogger_news { .sc_blogger_item_default.sc_blogger_item_image_position_top .sc_blogger_item_featured + .sc_blogger_item_content { margin-top: 1.3em; } .post_meta { margin: 0 0 0.5em; } .sc_blogger_item_title + .post_meta { margin: 0.5em 0 0 0; } .sc_blogger_item_title + .sc_blogger_item_button, .sc_blogger_item_meta + .sc_blogger_item_button, .sc_blogger_item_excerpt + .sc_blogger_item_button { margin-top: 0.7em; } .post_featured.with_thumb .sc_blogger_item_button .item_more_link { color: #ffffff; } } /* blogger blog -> classic masonry */ .sc_blogger_classic-masonry.sc_blogger_classic-masonry_default { .post_layout_classic:hover { .post_featured.hover_link.with_thumb > .bg_in, .post_featured.hover_link img { -webkit-transform: scale(1.07, 1.07); -ms-transform: scale(1.07, 1.07); transform: scale(1.07, 1.07); } } /* bullets */ .slider_container.slider_pagination_pos_bottom .swiper-pagination-bullets .swiper-pagination-bullet, .slider_outer.slider_outer_pagination_pos_bottom .swiper-pagination-bullets .swiper-pagination-bullet, .slider_outer.slider_outer_pagination_pos_bottom_outside .swiper-pagination-bullets .swiper-pagination-bullet { margin: 0 6px; background-color: #E2E1E0; border-color: #E2E1E0; opacity: 1; width: 8px; height: 8px; } .swiper-pagination-custom .swiper-pagination-button.swiper-pagination-button-active, .sc_slider_controls.slider_pagination_style_bullets .slider_pagination_bullet.swiper-pagination-bullet-active, .sc_slider_controls.slider_pagination_style_bullets .slider_pagination_bullet:hover, .slider_container .slider_pagination_wrap .swiper-pagination-bullet.swiper-pagination-bullet-active, .slider_outer .slider_pagination_wrap .swiper-pagination-bullet.swiper-pagination-bullet-active, .slider_container .slider_pagination_wrap .swiper-pagination-bullet:hover, .slider_outer .slider_pagination_wrap .swiper-pagination-bullet:hover { border-color: var(--theme-color-text_link); background-color: var(--theme-color-text_link); } .slider_outer.slider_outer_pagination_pos_bottom_outside .swiper-pagination-bullets, .sc_item_slider.slider_outer_pagination_pos_bottom .swiper-pagination { margin-top: 2em; } .post_layout_classic-masonry { padding-bottom: 2px; .post_title { margin: 0; font-size: 28px; line-height: 1.18em; } &.post_layout_classic_1 .post_title { margin: 0; font-size: 35px; line-height: 1.15em; } .post_featured { margin-bottom: 1.85em; } .post_header { padding: 0 0 0 50px; position: relative; &:before { position: absolute; left: 0; top: 10px; width: 35px; height: 2px; content: ""; display: block; background-color: var(--theme-color-text_dark); } .post_meta { margin: 0 0 12px; } } &.post_layout_classic_1 .post_header { padding-right: 8%; } } } /* blogger blog -> band */ .sc_blogger_band.sc_blogger_band_default .post_layout_band:only-child { .post_content_wrap { padding: 2.5em; } .post_content_wrap .post_title { margin: 0; font-size: 35px; line-height: 1.09em; a { color: var(--theme-color-text_dark); &:hover { color: var(--theme-color-text); } } } .post_featured_bg:after { padding-top: 128%; content: ' '; width: 0; height: 0; display: inline-block; vertical-align: top; margin-left: -0.3em; position: relative; } &:hover { .post_featured.hover_link.with_thumb > .bg_in, .post_featured.hover_link img { -webkit-transform: scale(1.07, 1.07); -ms-transform: scale(1.07, 1.07); transform: scale(1.07, 1.07); } } } /* Categories Lists */ /* Style 1 */ .categories_list_style_1 { .categories_list_item { + .categories_list_item { margin-top: 0.9em; } .categories_list_title { margin: 0.4em 0 0; } } } /* Style 2 */ .widget_categories_list { .categories_list_style_2 { .categories_list_icon { vertical-align: middle; + .categories_list_caption { vertical-align: middle; } } .categories_list_title { font-weight: 600; width: 45%; @include box-shadow(0 0 6px 0 rgba(0, 0, 0, .3)); } } } /* Style 3 */ .widget_categories_list .categories_list_style_3 .categories_list_title { font-weight: 600; } /* Extra 1 */ .categories_list_style_4 { .categories_list_item { position:relative; text-align:center; -webkit-transform-style: preserve-3d; transform-style: preserve-3d; perspective: none; z-index: 1; } .categories_list_item:hover { z-index: 10; } .categories_list_info_wrap { @include flex; position: absolute; z-index: 1; top: 0; left: 0; right: 0; bottom: 0; transform: none; -webkit-backface-visibility: hidden; backface-visibility: hidden; -webkit-transform-style: preserve-3d; transform-style: preserve-3d; &:before { content: ""; @include abs-cc(); width: 100%; height: 100%; opacity: 0.4; background: rgba(0, 0, 0, 0.3); @include transition(all 0.3s ease-in-out); } } .categories_list_info { position: relative; top: auto; left: auto; @include flex; @include flex-direction(column); @include flex-justify-content(center); @include flex-align-items(center); @include border-box; width: 100%; max-height:100%; overflow:hidden; padding: 20px; @include transform(translateZ(60px) scale(0.95)); } .categories_list_link { @include transform(translateZ(90px)); } .categories_list_title { font-weight: 500; font-size: 35px; line-height: 1.3em; color: #ffffff; margin: 13px 0; * { color: #ffffff; } .categories_list_count { margin-left: 0.2em; } } .categories_link_more { @include font(14px, 20px, 700); text-transform: uppercase; letter-spacing: 1.4px; color: #ffffff; display: inline-block; margin-bottom: -18px; opacity: 0; @include transition-all(0.3s); } .categories_list_item:hover { .categories_link_more { opacity: 1; margin-bottom: 0; } } } /* Extra 2 */ .categories_list_style_5 { .categories_list_image { display: block; overflow: hidden; } .categories_list_image img { @include transition(all 0.35s ease-in-out); @include transform(scale(1.01, 1.01)); } .categories_list_item:hover { .categories_list_image img { @include transform(scale(1.07, 1.07)); } .categories_list_info_wrap:before { opacity: 1; } } .trx_addons_columns_wrap { margin: 0 !important; > [class*="trx_addons_column-"] { padding: 0 !important; } } .categories_list_info_wrap { position: absolute; z-index: 1; top: 0; left: 0; right: 0; bottom: 0; overflow: hidden; &:before { content: ""; @include abs-cc(); width: 100%; height: 102%; opacity: 0.6; background: rgba(0,0,0,0.6); background: -moz-linear-gradient(0deg, rgba(0,0,0,0.3) 0%, rgba(0,0,0,0.6) 100%); background: -webkit-linear-gradient(0deg, rgba(0,0,0,0.3) 0%, rgba(0,0,0,0.6) 100%); background: linear-gradient(0deg, rgba(0,0,0,0.3) 0%, rgba(0,0,0,0.6) 100%); @include transition(all 0.35s ease-in-out); } .categories_list_info { z-index: 9; position: relative; top: auto; left: auto; @include flex; @include flex-direction(column); @include flex-justify-content(space-between); @include flex-align-items(self-start); @include border-box; text-align: left; width: 100%; height: 100%; max-height: 100%; overflow:hidden; padding: 53px 48px; } } .categories_list_title { font-weight: 600; font-size: 35px; line-height: 1.12em; color: #FCFCFC; margin: 0; text-align: left; * { color: #FCFCFC; } .categories_list_count { margin-left: 0.2em; } } .categories_link_more { @include font(14px, 20px, 700); text-transform: uppercase; letter-spacing: 1.4px; color: #D2D3D5; display: inline-block; margin: 0; position: relative; vertical-align: middle; &:after { content: '\e9b2'; font-family: $theme_icons; display: inline-block; font-size: 9px; font-weight: 400; margin-left: 13px; vertical-align: middle; margin-top: -3px; line-height: inherit; } } } /* Extra 3 */ .categories_list_style_6 { .categories_list_columns .categories_list_item { height: auto; } .categories_list_image { display: block; overflow: hidden; } .categories_list_image img { @include transition(all 0.35s ease-in-out); @include transform(scale(1.01, 1.01)); width: 100%; height: 100%; -o-object-fit: cover; object-fit: cover; } .categories_list_info_wrap:before { content: ""; @include abs-cc(); width: 100%; height: 100%; opacity: 0.2; background: rgba(0,0,0,0.5); background: -moz-linear-gradient(0deg, rgba(0,0,0,0.9) 0%, rgba(0,0,0,0.3) 100%); background: -webkit-linear-gradient(0deg, rgba(0,0,0,0.9) 0%, rgba(0,0,0,0.3) 100%); background: linear-gradient(0deg, rgba(0,0,0,0.9) 0%, rgba(0,0,0,0.3) 100%); @include transition(all 0.35s ease-in-out); } .categories_list_info_wrap { position: absolute; z-index: 1; top: 0; left: 0; right: 0; bottom: 0; .categories_list_info { z-index: 9; position: relative; top: auto; left: auto; @include flex; @include flex-direction(column); @include flex-justify-content(flex-end); @include flex-align-items(self-start); @include border-box; text-align: left; width: 100%; height: 100%; max-height: 100%; overflow:hidden; padding: 20px 35px; } } .categories_list_title { font-weight: 600; font-size: 28px; line-height: 1.12em; color: #FCFCFC; margin: 0; text-align: left; * { color: #FCFCFC; } .categories_list_count { margin-left: 0.2em; } } .categories_link_more { @include font(14px, 20px, 700); text-transform: uppercase; letter-spacing: 1.4px; color: #F9F9F9; display: inline-block; margin: 14px 0 -18px; opacity: 0; position: relative; vertical-align: middle; &:after { content: '\e9b2'; font-family: $theme_icons; display: inline-block; font-size: 11px; font-weight: 400; margin-left: 13px; vertical-align: middle; margin-top: -3px; line-height: inherit; } } .categories_list_item:hover { .categories_list_image img { @include transform(scale(1.07, 1.07)); } .categories_list_info_wrap:before { opacity: 0.4; } .categories_link_more { margin-bottom: 15px; opacity: 1; } } } /* Grid 1 */ .categories_list_style_7 { display: grid; grid-template-columns: 1fr 1fr; grid-template-rows: 1fr; gap: 0 0; grid-template-areas: "md-1 md-2"; overflow: hidden; &.count_1 { display: grid; grid-template-columns: 1fr; grid-template-rows: 1fr; gap: 0 0; grid-template-areas: "md-1"; .categories_list_item { &:nth-child(1) { grid-area: md-1; } } } &.count_3 { display: grid; grid-template-columns: 1fr 1fr 1fr; grid-template-rows: 200px 200px; gap: 0 0; grid-template-areas: "md-3-1 md-3-2 md-3-3" "md-3-1 md-3-2 md-3-3"; .categories_list_item { &:nth-child(1) { grid-area: md-3-1; } &:nth-child(2) { grid-area: md-3-2; } &:nth-child(3) { grid-area: md-3-3; } } } &.count_4 { display: grid; grid-template-columns: 1fr 1fr 1fr 1fr; grid-template-rows: 1fr 1fr; gap: 0 0; grid-template-areas: "lg-3-1 lg-3-1 sm-3-1 sm-3-2" "lg-3-1 lg-3-1 md-3-1 md-3-1"; .categories_list_item { &:nth-child(1) { grid-area: lg-3-1; } &:nth-child(2) { grid-area: sm-3-1; } &:nth-child(3) { grid-area: sm-3-2; } &:nth-child(4) { grid-area: md-3-1; } } } .categories_list_item { margin: -1px; overflow: hidden; } /* featured */ .post_featured_bg .bg_in { position: absolute; z-index: 1; top: 0; left: 0; right: 0; bottom: 0; } .post_featured_bg { width: 100%; height: 100%; overflow: hidden; display: block; position: relative; &:before { padding-top: 50%; } } .post_featured_bg.hover_link .bg_in { @include transition(all 0.3s ease-in-out); @include transform(scale(1.01, 1.01)); } .categories_list_item:hover .bg_in, .post_featured_bg.hover_link:hover .bg_in { @include transform(scale(1.07, 1.07)); } .categories_list_info_wrap:before { content: ""; @include abs-cc(); width: 100%; height: 100%; opacity: 0.4; background: rgba(0,0,0,0.7); background: -moz-linear-gradient(0deg, rgba(0,0,0,0.7) 0%, rgba(0,0,0,0.3) 100%); background: -webkit-linear-gradient(0deg, rgba(0,0,0,0.7) 0%, rgba(0,0,0,0.3) 100%); background: linear-gradient(0deg, rgba(0,0,0,0.7) 0%, rgba(0,0,0,0.3) 100%); @include transition(all 0.3s ease-in-out); } .categories_list_info_wrap { position: absolute; z-index: 1; top: 0; left: 0; right: 0; bottom: 0; .categories_list_info { z-index: 9; position: relative; top: auto; left: auto; @include flex; @include flex-direction(column); @include flex-justify-content(flex-end); @include flex-align-items(self-start); @include border-box; text-align: left; width: 100%; height: 100%; max-height: 100%; overflow: hidden; padding: 27px 40px; } } .categories_list_title { font-weight: 500; font-size: 28px; line-height: 1.12em; color: #FCFCFC; margin: 0; text-align: left; * { color: #FCFCFC; } .categories_list_count { margin-left: 0.2em; } } .categories_link_more { @include font(14px, 20px, 700); text-transform: uppercase; letter-spacing: 1.4px; color: #F9F9F9; display: inline-block; margin: 14px 0 -18px; opacity: 0; position: relative; vertical-align: middle; &:after { content: '\e9b2'; font-family: $theme_icons; display: inline-block; font-size: 11px; font-weight: 400; margin-left: 13px; vertical-align: middle; margin-top: -3px; line-height: inherit; } } .categories_list_item:hover { .categories_link_more { margin-bottom: 15px; opacity: 1; } } } /* Grid 2 */ .categories_list_style_8 { display: grid; grid-template-columns: 1fr 1fr; grid-template-rows: 1fr; gap: 30px 30px; grid-template-areas: "md-1 md-2"; &.count_1 { display: grid; grid-template-columns: 1fr; grid-template-rows: 1fr; gap: 30px 30px; grid-template-areas: "md-1"; .categories_list_item { &:nth-child(1) { grid-area: md-1; } } } &.count_3 { display: grid; grid-template-columns: 1fr 1fr 1fr; grid-template-rows: 200px 200px; gap: 30px 30px; grid-template-areas: "md-3-1 md-3-2 md-3-3" "md-3-1 md-3-2 md-3-3"; .categories_list_item { &:nth-child(1) { grid-area: md-3-1; } &:nth-child(2) { grid-area: md-3-2; } &:nth-child(3) { grid-area: md-3-3; } } } &.count_4 { display: grid; grid-template-columns: 1fr 1fr 1fr 1fr; grid-template-rows: 1fr 1fr; gap: 30px 30px; grid-template-areas: "lg-3-1 lg-3-1 md-3-1 sm-3-1" "lg-3-1 lg-3-1 md-3-1 sm-3-2"; .categories_list_item { &:nth-child(1) { grid-area: lg-3-1; } &:nth-child(2) { grid-area: md-3-1; } &:nth-child(3) { grid-area: sm-3-1; } &:nth-child(4) { grid-area: sm-3-2; } } } &.count_5 { display: grid; grid-template-columns: 1fr 1fr 1fr 1fr; grid-template-rows: 1fr 1fr; gap: 30px 30px; grid-template-areas: "lg-3-1 lg-3-1 sm-3-1 sm-3-2" "lg-3-1 lg-3-1 sm-3-3 sm-3-4"; .categories_list_item { &:nth-child(1) { grid-area: lg-3-1; } &:nth-child(2) { grid-area: sm-3-1; } &:nth-child(3) { grid-area: sm-3-2; } &:nth-child(4) { grid-area: sm-3-3; } &:nth-child(5) { grid-area: sm-3-4; } } } /* featured */ .post_featured_bg .bg_in { position: absolute; z-index: 1; top: 0; left: 0; right: 0; bottom: 0; } .post_featured_bg { width: 100%; height: 100%; overflow: hidden; display: block; position: relative; &:before { padding-top: 100%; } } .post_featured_bg.hover_link .bg_in { @include transition(all 0.3s ease-in-out); @include transform(scale(1.01, 1.01)); } .categories_list_item:hover .bg_in, .post_featured_bg.hover_link:hover .bg_in { @include transform(scale(1.07, 1.07)); } .categories_list_info_wrap:before { content: ""; @include abs-cc(); width: 100%; height: 100%; opacity: 0.4; background: rgba(0,0,0,0.7); background: -moz-linear-gradient(0deg, rgba(0,0,0,0.7) 0%, rgba(0,0,0,0.3) 100%); background: -webkit-linear-gradient(0deg, rgba(0,0,0,0.7) 0%, rgba(0,0,0,0.3) 100%); background: linear-gradient(0deg, rgba(0,0,0,0.7) 0%, rgba(0,0,0,0.3) 100%); @include transition(all 0.3s ease-in-out); } .categories_list_info_wrap { position: absolute; z-index: 1; top: 0; left: 0; right: 0; bottom: 0; .categories_list_info { z-index: 9; position: relative; top: auto; left: auto; @include flex; @include flex-direction(column); @include flex-justify-content(flex-end); @include flex-align-items(self-start); @include border-box; text-align: left; width: 100%; height: 100%; max-height: 100%; overflow: hidden; padding: 15px 31px; } } .categories_list_title { font-size: 24px; line-height: 1.12em; color: #FCFCFC; margin: 0; text-align: left; * { color: #FCFCFC; } .categories_list_count { margin-left: 0.2em; } } .categories_link_more { @include font(14px, 20px, 700); text-transform: uppercase; letter-spacing: 1px; color: #F9F9F9; display: inline-block; margin: 14px 0 -18px; opacity: 0; position: relative; vertical-align: middle; &:after { content: '\e9b2'; font-family: $theme_icons; display: inline-block; font-size: 9px; font-weight: 400; margin-left: 13px; vertical-align: middle; margin-top: -3px; line-height: inherit; } } .categories_list_item:hover { .categories_link_more { margin-bottom: 15px; opacity: 1; } } } /* Cover */ .cover_hover .sc_cover.sc_cover_default + .elementor-container { .sc_item_title_text { color: inherit; @include transition-all(0.3s); } } .cover_hover .sc_cover.sc_cover_default:hover + .elementor-container { .sc_item_title_text { color: var(--theme-color-text_dark); } .elementor-icon { fill: var(--theme-color-text_link); } } /* Mouse Helper */ .trx_addons_mouse_helper.trx_addons_mouse_helper_top:not(.trx_addons_mouse_helper_centered) { top: var(--mouse-helper-top) !important; } .trx_addons_mouse_helper.trx_addons_mouse_helper_left:not(.trx_addons_mouse_helper_centered) { left: var(--mouse-helper-left) !important; } .trx_addons_mouse_helper { font-size: 16px; text-indent: 0; --mouse-helper-width: 8px; --mouse-helper-height: 8px; --mouse-helper-left: 20px; --mouse-helper-top: 20px; border: none; mix-blend-mode: difference; background-color: #ffffff; @include box-shadow(0 0 0 rgba(0, 0, 0, 0)); @include transition(width 0.3s ease, height 0.3s ease, opacity 0.3s ease, color 0.3s ease, background-color 0.3s ease, left 0.3s ease, top 0.3s ease, border-radius 0.1s ease, box-shadow 0.2s ease); } .trx_addons_mouse_helper.trx_addons_mouse_helper_permanent { opacity: 1; } .trx_addons_mouse_helper.trx_addons_mouse_helper_active { &.trx_addons_mouse_helper_with_icon { --mouse-helper-width: 65px; --mouse-helper-height: 65px; } &.trx_addons_mouse_helper_with_text { --mouse-helper-width: 80px; --mouse-helper-height: 80px; } } .trx_addons_mouse_helper { .trx_addons_mouse_helper_image { background-size: cover; background-position: center center; &:before { @include transition-all(0.3s); content: ' '; position: absolute; z-index: -1; top: 0; left: 0; right: 0; bottom: 0; background: rgba(0, 0, 0, 0); } } } .trx_addons_mouse_helper.trx_addons_mouse_helper_with_image.trx_addons_mouse_helper_with_text, .trx_addons_mouse_helper.trx_addons_mouse_helper_with_image { @include box-shadow(0 3px 46px rgba(0, 0, 0, 0.1)); @include border-radius(0); } .trx_addons_mouse_helper.trx_addons_mouse_helper_active.trx_addons_mouse_helper_with_image.trx_addons_mouse_helper_with_text, .trx_addons_mouse_helper.trx_addons_mouse_helper_active.trx_addons_mouse_helper_with_image { --mouse-helper-width: 288px; --mouse-helper-height: 288px; padding: 0; @include box-sizing('border-box'); } /* Custom Helper */ .custom-helper { width: 67px; height: 67px; line-height: 67px; @include box-sizing(border-box); @include border-radius(50%); @include flex; justify-content: center; align-items: center; span { @include flex; justify-content: center; align-items: center; color: #ffffff; font-size: 10px; font-weight: 400; &:after { content: '\e9e6'; font-family: $theme_icons; will-change: transform; transform: translateX(10px); display: inline-block; @include transition-all(0.3s); } &:before { content: '\e9e5'; font-family: $theme_icons; will-change: transform; transform: translateX(-10px); display: inline-block; @include transition-all(0.3s); } } .direction_vertical & span { @include transform(rotate(90deg)); will-change: transform; } } .trx_addons_mouse_helper.trx_addons_mouse_helper_with_layout { --mouse-helper-width: 66px; --mouse-helper-height: 66px; &.trx_addons_mouse_helper_click { --mouse-helper-width: 56px; --mouse-helper-height: 56px; .custom-helper { span { &:after { transform: translateX(5px); } &:before { transform: translateX(-5px); } } } } } /* Highlight Helper */ [data-mouse-helper="highlight"] { color: var(--theme-color-text_dark_03); background-image: radial-gradient(closest-side, var(--theme-color-text_dark) 78%, transparent 0); } /* Layouts Title */ .sc_layouts_title_breadcrumbs { margin-top: 1.3em; } .sc_layouts_title { .sc_layouts_title_description { margin-top: 0.5em; } .sc_layouts_title_content { max-width: 100%; } .sc_layouts_title_meta { margin: 0 0 1em; } .sc_layouts_title_content > .sc_layouts_title_breadcrumbs:first-child { margin-top: 0; } .breadcrumbs { font-size: 13px; line-height: 18px; font-weight: 700; text-transform: uppercase; letter-spacing: 1.4px; a { color: var(--theme-color-text_dark) !important; } } .trx_addons_video_player.with_video_autoplay { .mejs-container { height: 100% !important; width: 100% !important; .mejs-controls { display: none !important; } video { height: 100% !important; } } .wp-video, .video_frame { height: 100% !important; width: 100% !important; iframe { object-fit: unset; height: 100% !important; width: 100% !important; } } } } /* Single style Gallery Start */ .single-format-gallery { .post_featured.with_gallery { .sc_slider_controller_horizontal { padding-left: 0; padding-right: 0; .slider_controls_wrap { a { display: none; } } .slider-slide.swiper-slide-active:after { display: none; } } .slider_outer_wrap.slider_outer_wrap_controller_pos_bottom .sc_slider_controller .slider_container:not(.slider_type_images) .slider-slide, .slider_outer_wrap.slider_outer_wrap_controller_pos_bottom .sc_slider_controller .slider_container:not(.slider_type_images) { min-height: 1px !important; } } .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 { &.slider_prev { margin-left: 30px; } &.slider_next { margin-right: 30px; } } .sc_slider_controller { .slider_container:not(.slider_multi):not(.slider_type_images), .slider_container:not(.slider_multi):not(.slider_type_images) .slider-slide { min-height: auto; } .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 { &.slider_prev { margin-left: 0; } &.slider_next { margin-right: 0; } } } } /* Single style Gallery End */ /* Single style Video Start */ .single_style_style-5 { &.single-format-video { .post_header_wrap .post_featured.with_thumb .post_video_hover { font-size: 15px; width: 66px; height: 66px; line-height: 66px; overflow: visible; margin: -33px 0 0 -33px; &:after { content: ''; position: absolute; top: -11px; left: -11px; width: 86px; height: 86px; border: 1px solid var(--theme-color-inverse_link); @include border-radius(50%); opacity: 0.2; } } } } /* Single style Gallery End */ /* Popup post details */ #trx_addons_post_details_popup { .trx_addons_post_details_popup_close { &:before { font-size: 24px; font-family: $theme_icons; content: '\e9e1'; @include transition(transform .3s ease-out); } &:hover:before { @include transform(rotate(180deg)); } } .services_page_header .post_details_page_title { padding: 0.3em 4em 0.4em 0.5em; @include font(1.6em, 1.2em); } .post_details_page_price { top: 0.3em; } } /* Layout Languages */ .sc_layouts_language { .sc_layouts_language_menu { > li > a, > li > a:hover, > li.sfHover > a { color: var(--theme-color-text_dark) !important; } > li.menu-item-has-children > a:after { margin-left: 0.5em; position: relative; right: 0; top: 2px; } > li > ul { top: 4.5em; } > li.menu-item > a > img { position: relative; top: 1px; } li.menu-item > a > img { + span { margin-left: 0.5em; } } } } /* Extended Taxonomy */ .trx_addons_extended_taxonomy { vertical-align: inherit; .trx_addons_extended_taxonomy_icon { font-weight: 400; } } .widget .trx_addons_extended_taxonomy .trx_addons_extended_taxonomy_icon { margin-left: 1px; } /* Widget Instagram +++++ +++++++++++++++++++++++++ */ /* Simple */ .widget_instagram_type_simple { .widget_instagram_images_item_wrap { .widget_instagram_images_item_counters { display: none; } .widget_instagram_images_item:before { background-color: rgba(0,0,0,.2); } } } /* Alter */ .widget_instagram_type_alter { .widget_instagram_images { margin: 0 !important; } .widget_instagram_images_item_wrap { padding: 0 !important; .widget_instagram_images_item_counters { display: none; } .widget_instagram_images_item:before { background-color: rgba(0,0,0,.2); } } .widget_instagram_follow_link_wrap { margin: 0 !important; @include abs-cc; .widget_instagram_follow_link { position: relative; margin: 0; padding: 16px 30px; @include border-radius(0); @include font(14px, 17px, 500); letter-spacing: 1.4px; text-transform: uppercase; background: #FFFFFF !important; color: #071021 !important; @include box-shadow(none); &:before { color: inherit; font-family: $theme_icons; content: '\E87E'; font-size: 18px; font-weight: 400; margin: -1px 8px 0 0; display: inline-block; } } } } /* Modern */ .widget_instagram_type_modern { .widget_instagram_images { margin: 0 !important; } .widget_instagram_images_item_wrap { padding: 0 !important; .widget_instagram_images_item_counters { display: none; } .widget_instagram_images_item:before { background-color: rgba(0,0,0,.2); } } .widget_instagram_follow_link_wrap { margin: 0 !important; @include abs-cc; .widget_instagram_follow_link { margin: 0; padding: 0; @include border-radius(50%); color: #A5A6AA !important; background-color: #FFFFFF !important; min-width: 102px; height: 102px; line-height: 102px; text-align: center; vertical-align: middle; @include box-shadow(none); text-indent: -200px; overflow: hidden; display: block; &:before { @include abs-cc; color: inherit; font-family: $theme_icons; content: '\E87E'; font-size: 25px; line-height: 1em; font-weight: 400; text-indent: 0; } } } } /* Hotspot Default */ .sc_hotspot_default { .sc_hotspot_item_sonar { background-color: var(--theme-color-alter_bg_color); } .sc_hotspot_item_icon { background-color: var(--theme-color-alter_bg_color); span { display: block; @include font(14px, 16px); color: var(--theme-color-alter_dark); } } .sc_hotspot_item_popup { width: 300px; padding: 30px; @include border-box; @include box-shadow(0 3px 25px rgba(0, 0, 0, 0.05)); background: var(--theme-color-alter_bg_color); > .sc_hotspot_item_popup_close + [class*="sc_hotspot_item"], > [class*="sc_hotspot_item"]:first-child { margin-top: 0; } .sc_hotspot_item_image + [class*="sc_hotspot_item"] { margin-top: 25px; } .sc_hotspot_item_popup_close { color: var(--theme-color-alter_dark); } .sc_hotspot_item_subtitle { color: var(--theme-color-alter_dark); > span, .post_meta_item { @include font(16px, 20px, 400); } } .sc_hotspot_item_title { margin-top: 8px; @include font(21px, 1.3em); color: var(--theme-color-alter_dark); } .sc_hotspot_item_price { margin-top: 8px; @include font(19px, 1em, 500); color: var(--theme-color-alter_text); } .sc_hotspot_item_description { margin-top: 10px; @include font(16px, 24px); color: var(--theme-color-alter_text); } .sc_hotspot_item_link { margin-top: 15px; } } } /* Hotspot Simple */ .sc_hotspot_simple { .sc_hotspot_item_sonar { background-color: var(--theme-color-text_link); } .sc_hotspot_item_icon { background-color: var(--theme-color-text_link); span { display: block; @include font(12px, 14px); color: var(--theme-color-inverse_link); } } .sc_hotspot_item_popup { width: max-content; max-width: 250px; padding: 9px 20px 12px; @include border-box; background: var(--theme-color-alter_bg_color); @include box-shadow(0 3px 25px rgba(0, 0, 0, 0.05)); > .sc_hotspot_item_popup_close + [class*="sc_hotspot_item"], > [class*="sc_hotspot_item"]:first-child { margin-top: 10px; } > [class*="sc_hotspot_item"]:last-child { margin-bottom: 10px; } > [class*="sc_hotspot_item"]:only-child { margin: 0; } .sc_hotspot_item_image + [class*="sc_hotspot_item"] { margin-top: 10px; } .sc_hotspot_item_popup_close { color: var(--theme-color-alter_dark); } .sc_hotspot_item_subtitle { color: var(--theme-color-alter_dark); line-height: 1; > span, .post_meta_item { @include font(15px, 20px, 400); } } .sc_hotspot_item_title { margin-top: 5px; @include font(16px, 22px); color: var(--theme-color-alter_dark); } .sc_hotspot_item_price { margin-top: 5px; @include font(16px, 22px, var(--theme-font-h5_font-weight)); color: var(--theme-color-alter_text); } .sc_hotspot_item_description { margin-top: 8px; @include font(16px, 24px); color: var(--theme-color-alter_text); } .sc_hotspot_item_link { margin-top: 15px; } .sc_hotspot_item_popup_close { @include box(1.3em, 1.3em, 1.3em); .trx_addons_button_close_icon { font-size: 10px; } } } } /* Images compare */ .sc_icompare_text_before, .sc_icompare_text_after { @include font(15px, 1.2em, 400); background: rgba(0, 0, 0, 0.5); color: #fff; padding: 8px 20px; @include transition-all(0.3s); text-shadow: none; } /* Switcher */ .sc_switcher_controls { margin-bottom: 2.5em; } .sc_switcher_controls_section_title { @include font(1.056em, 1.3em); } .sc_switcher_controls_toggle { @include box(50px, 28px); @include border-radius(30px); background-color: transparent; @include box-shadow(none); border: 1px solid var(--theme-color-bd_color); } .sc_switcher_controls_toggle_button { position: absolute; top: 2px; left: 3px; @include box(22px, 22px, 22px); background-color: var(--theme-color-text_link); .sc_switcher_controls_toggle:not(.sc_switcher_controls_toggle_on) & { @include transform(translateX(20px)); } .sc_switcher_controls_toggle_on & { background-color: var(--theme-color-text_dark); } } .sc_switcher_controls_section1 { margin-right: 1em; } .sc_switcher_controls_section2 { margin-left: 1em; } /* Switcher Tabs */ .sc_switcher_tabs { .sc_switcher_tabs_controls { margin-bottom: var(--theme-var-grid_gap); } .sc_switcher_tab { border-color: var(--theme-color-bd_color); padding: var(--theme-var-grid_gap); @include transition-all(0.3s); + .sc_switcher_tab { margin-left: var(--theme-var-grid_gap); } &.sc_switcher_tab_active { background-color: var(--theme-color-alter_bg_color); border-color: var(--theme-color-bd_color); } } } // custom tabs .style-switcher-tabs { .elementor-section-full_width & .sc_switcher_tabs_controls { max-width: calc( var(--theme-var-page) + var(--theme-var-elm_gap_extended) ); padding: 0 calc( var(--theme-var-elm_gap_extended) / 2 ); margin: 0 auto; } .sc_switcher_tab { width: 100%; padding: calc(var(--theme-var-grid_gap) + 8px) var(--theme-var-grid_gap); h5:first-child:not(:last-child) { margin-bottom: 0.75em; } } } /* Expand / Collapse */ .trx_expcol_on { &.trx_expcol_gradient_on:after { background: -webkit-gradient(linear,left top,left bottom,color-stop(0,var(--theme-color-bg_color_0)),to(var(--theme-color-bg_color))); background: -webkit-linear-gradient(top,var(--theme-color-bg_color_0) 0,var(--theme-color-bg_color) 100%); background: linear-gradient(to bottom,var(--theme-color-bg_color_0) 0,var(--theme-color-bg_color) 100%); } .trx_expcol_button { @include theme_button_template; @include theme_button_colors; padding: 17px 50px; @include translate(-50%, -25%); &.trx_expcol_button_with_shadow { @include translate(-50%, -50%); } &:hover, &:focus { @include theme_button_colors_hover; } } /* // for old trx-addon &.trx_expcol_state_collapsed .trx_expcol_button, &.trx_expcol_state_animated .trx_expcol_button { transform: translate(-50%, -25%); }*/ .trx_expcol_button_icon { font-weight: 400; } } /* AI Helper Image Generator */ .sc_igenerator_form { .trx_addons_loading { background-color: var(--theme-color-bg_color_07); } } .sc_igenerator_form_field_inner { > .select_container select, > .sc_igenerator_form_field_model_wrap > .select_container select, > .sc_igenerator_form_field_numeric_wrap input[type="number"], > input[type="text"], > .theme_form_field_text { padding: 0 20px; height: 60px; border: none; @include border-radius(0); color: var(--theme-color-alter_text); background-color: var(--theme-color-alter_bg_color) !important; &:focus { color: var(--theme-color-alter_dark); } &[placeholder]::-webkit-input-placeholder { color: var(--theme-color-alter_text); } &[placeholder]::-moz-placeholder { color: var(--theme-color-alter_text); } &[placeholder]:-ms-input-placeholder { color: var(--theme-color-alter_text); } &[placeholder]::placeholder { color: var(--theme-color-alter_text); } &[placeholder]:focus::-webkit-input-placeholder { color: var(--theme-color-alter_dark); } &[placeholder]:focus::-moz-placeholder { color: var(--theme-color-alter_dark); } &[placeholder]:focus:-ms-input-placeholder { color: var(--theme-color-alter_dark); } &[placeholder]:focus::placeholder { color: var(--theme-color-alter_dark); } &[placeholder]:active::-webkit-input-placeholder { color: var(--theme-color-alter_dark); } &[placeholder]:active::-moz-placeholder { color: var(--theme-color-alter_dark); } &[placeholder]:active:-ms-input-placeholder { color: var(--theme-color-alter_dark); } &[placeholder]:active::placeholder { color: var(--theme-color-alter_dark); } } > .theme_form_field_text { @include flex; @include flex-align-items(center); } > .sc_igenerator_form_field_numeric_wrap { input[type="number"] { padding-right: 2.8em; } .sc_igenerator_form_field_numeric_wrap_button { padding: 0.15em 0.8em; color: var(--theme-color-alter_text); &:hover { color: var(--theme-color-alter_dark); } &.sc_igenerator_form_field_numeric_wrap_button_inc, &.sc_igenerator_form_field_numeric_wrap_button_dec { &:before { @include box(1em, 0.5em, 0.5em); font-weight: 400; } } } } .select_container { &:after { right: 1em; color: var(--theme-color-alter_text); font-weight: 400; } &:hover:after, &:focus:after { color: var(--theme-color-alter_dark); } } > label { color: var(--theme-color-text_dark); @include font(16px, 1.3em, var(--theme-font-h5_font-weight)); text-transform: uppercase; } } .sc_igenerator_form_field_upload_image_decorator { .sc_igenerator_form_field_upload_image_text { @include font(var(--theme-font-input_font-size), var(--theme-font-input_line-height), var(--theme-font-input_font-weight)); letter-spacing: var(--theme-font-input_letter-spacing); color: var(--theme-color-alter_text); } .sc_igenerator_form_field_upload_image_button { @include font(var(--theme-font-button_font-size), '', var(--theme-font-button_font-weight)); text-transform: var(--theme-font-button_text-transform); letter-spacing: var(--theme-font-button_letter-spacing); right: 20px; padding: 0; border: none; @include border-radius(0); color: var(--theme-color-alter_dark); } } .sc_igenerator_form_field_prompt { .sc_igenerator_form_field_prompt_button { @include abs-rc(5px); @include font(var(--theme-font-button_font-size), '', var(--theme-font-button_font-weight)); text-transform: var(--theme-font-button_text-transform); letter-spacing: var(--theme-font-button_letter-spacing); display: inline-block; padding: 0 25px; height: 50px; line-height: 48px; @include border-radius(0); color: var(--theme-color-inverse_link); background-color: var(--theme-color-alter_link); &:not(.sc_igenerator_form_field_prompt_button_disabled):hover { color: var(--theme-color-inverse_link); background-color: var(--theme-color-alter_hover); } } .sc_igenerator_form_field_prompt_button_disabled { opacity: .8; } } .sc_igenerator_form_field_tags { margin-top: 20px; } .sc_igenerator_form_field_tags_label { padding: 9px 15px 9px 0; @include font(13px, 17px, 600); text-transform: uppercase; } .sc_igenerator_form_field_tags_item { padding: 11px 15px 12px 15px; margin: 0 5px 5px 0; @include font(13px, 1em, 400); @include border-radius(0); color: var(--theme-color-alter_dark); background-color: var(--theme-color-alter_bg_color); &:hover { color: var(--theme-color-inverse_link); background-color: var(--theme-color-text_link); } } .sc_igenerator_form_settings_button { flex-shrink: 0; width: 60px; @include border-radius(0); color: var(--theme-color-alter_dark); background-color: var(--theme-color-alter_bg_color); &:hover, &:focus { color: var(--theme-color-inverse_link); background-color: var(--theme-color-alter_link); } } .sc_igenerator_form_settings, .sc_igenerator_form_settings.sc_igenerator_form_settings_light { max-height: 260px; overflow-y: auto; overflow-x: hidden; @include thin-scrollbar; &::-webkit-scrollbar-thumb { @include border-radius(0); } } .sc_igenerator_form_settings { max-width: 230px; @include border-radius(0); color: var(--theme-color-alter_dark); background-color: var(--theme-color-alter_bg_color); .sc_igenerator_form_settings_field_numeric_wrap { .sc_igenerator_form_settings_field_numeric_wrap_button { padding: 0.1em 0; color: var(--theme-color-input_text); &:hover { color: var(--theme-color-input_dark); } } .sc_igenerator_form_settings_field_numeric_wrap_button_dec:before, .sc_igenerator_form_settings_field_numeric_wrap_button_inc:before { @include box(1em, 0.5em, 0.5em); font-weight: 400; } } &:not(.sc_igenerator_form_settings_light) label { display: block; font-family: var(--theme-font-h5_font-family); @include font(16px, 1.5em, var(--theme-font-h5_font-weight)); text-transform: uppercase; } } .sc_igenerator_form_settings_field_group_title { font-family: var(--theme-font-h5_font-family); @include font(16px, 1.5em, var(--theme-font-h5_font-weight)); text-transform: uppercase; } .sc_igenerator_limits { .sc_igenerator_limits_used { color: var(--theme-color-text_dark); } } /* Extended */ .sc_igenerator_extended { .sc_igenerator_form_actions_item { > a { @include font(16px, 21px, 600); color: var(--theme-color-text); } &.sc_igenerator_form_actions_item_active > a, > a:hover, > a:focus { color: var(--theme-color-text_dark); } } .sc_igenerator_form_actions_list { &:after { background-color: var(--theme-color-bd_color); } } .sc_igenerator_form_actions_slider { background-color: var(--theme-color-text_dark); } .sc_igenerator_form_field_generate { .sc_igenerator_form_field_generate_button { .sc_button_icon { display: none; } &.sc_igenerator_form_field_disabled { opacity: .8; } } } .sc_igenerator_limits { border-color: var(--theme-color-bd_color); } .sc_igenerator_form_field_model_wrap_with_settings { .sc_igenerator_form_settings_field_description { color: var(--theme-color-alter_light); } } } /* AI Helper Text Generator */ .sc_tgenerator_form { .trx_addons_loading { background-color: var(--theme-color-bg_color_07); } } .sc_tgenerator_form_field_prompt { input[type="text"] { padding: 0 140px 0 20px; height: 60px; border: none; @include border-radius(0); color: var(--theme-color-alter_text); background-color: var(--theme-color-alter_bg_color); &:focus { color: var(--theme-color-alter_dark); } &[placeholder]::-webkit-input-placeholder { color: var(--theme-color-alter_text) } &[placeholder]::-moz-placeholder { color: var(--theme-color-alter_text) } &[placeholder]:-ms-input-placeholder { color: var(--theme-color-alter_text) } &[placeholder]::placeholder { color: var(--theme-color-alter_text) } &[placeholder]:focus::-webkit-input-placeholder { color: var(--theme-color-alter_dark) } &[placeholder]:focus::-moz-placeholder { color: var(--theme-color-alter_dark) } &[placeholder]:focus:-ms-input-placeholder { color: var(--theme-color-alter_dark) } &[placeholder]:focus::placeholder { color: var(--theme-color-alter_dark) } &[placeholder]:active::-webkit-input-placeholder { color: var(--theme-color-alter_dark) } &[placeholder]:active::-moz-placeholder { color: var(--theme-color-alter_dark) } &[placeholder]:active:-ms-input-placeholder { color: var(--theme-color-alter_dark) } &[placeholder]:active::placeholder { color: var(--theme-color-alter_dark) } } .sc_tgenerator_form_field_prompt_button { @include abs-rc(5px); @include font(var(--theme-font-button_font-size), '', var(--theme-font-button_font-weight)); text-transform: var(--theme-font-button_text-transform); letter-spacing: var(--theme-font-button_letter-spacing); display: inline-block; padding: 0 25px; height: 50px; line-height: 48px; @include border-radius(0); color: var(--theme-color-inverse_link); background-color: var(--theme-color-alter_link); &:not(.sc_tgenerator_form_field_prompt_button_disabled):hover { color: var(--theme-color-inverse_link); background-color: var(--theme-color-alter_hover); } } .sc_tgenerator_form_field_prompt_button_disabled { opacity: .8; } } .sc_tgenerator_form_field_tags { color: var(--theme-color-text_dark); } .sc_tgenerator_form_field_select { .sc_tgenerator_form_field_select_options { border: 1px solid var(--theme-color-bd_color); background-color: var(--theme-color-bg_color); @include box-shadow(none); max-height: 300px; overflow-y: auto; overflow-x: hidden; @include thin-scrollbar; &::-webkit-scrollbar-thumb { @include border-radius(0); } } .sc_tgenerator_form_field_select_label { color: var(--theme-color-text_link); padding: 0; border-bottom: none; } .sc_tgenerator_form_field_select_option:hover, .sc_tgenerator_form_field_select_option:focus { background-color: var(--theme-color-alter_bg_color); color: var(--theme-color-alter_link); } } .sc_tgenerator_text { margin-top: 1.4em; padding: 18px 22px; border: none; @include border-radius(0); color: var(--theme-color-alter_text); &:focus { color: var(--theme-color-alter_dark); } &[placeholder]::-webkit-input-placeholder { color: var(--theme-color-alter_text) } &[placeholder]::-moz-placeholder { color: var(--theme-color-alter_text) } &[placeholder]:-ms-input-placeholder { color: var(--theme-color-alter_text) } &[placeholder]::placeholder { color: var(--theme-color-alter_text) } &[placeholder]:focus::-webkit-input-placeholder { color: var(--theme-color-alter_dark) } &[placeholder]:focus::-moz-placeholder { color: var(--theme-color-alter_dark) } &[placeholder]:focus:-ms-input-placeholder { color: var(--theme-color-alter_dark) } &[placeholder]:focus::placeholder { color: var(--theme-color-alter_dark) } &[placeholder]:active::-webkit-input-placeholder { color: var(--theme-color-alter_dark) } &[placeholder]:active::-moz-placeholder { color: var(--theme-color-alter_dark) } &[placeholder]:active:-ms-input-placeholder { color: var(--theme-color-alter_dark) } &[placeholder]:active::placeholder { color: var(--theme-color-alter_dark) } } .sc_tgenerator_text, .sc_tgenerator_text.filled, .sc_tgenerator_text:focus { background-color: var(--theme-color-alter_bg_color); } .sc_tgenerator_result { .sc_tgenerator_result_label { margin-bottom: 0.8em; text-align: center; font-weight: var(--theme-font-h6_font-weight); color: var(--theme-color-text_dark); } .sc_tgenerator_result_content { padding: 18px 22px; border: none; @include border-radius(0); color: var(--theme-color-alter_text); background-color: var(--theme-color-alter_bg_color); } .sc_tgenerator_result_copy { .sc_button { padding: 14px 28px; color: var(--theme-color-inverse_link); border-color: var(--theme-color-text_link); background-color: var(--theme-color-text_link); &:hover { color: var(--theme-color-inverse_link); border-color: var(--theme-color-text_hover); background-color: var(--theme-color-text_hover); } } } } .sc_tgenerator_text, .sc_tgenerator_result { h1, h2, h3, h4, h5, h6 { margin: 0 0 0.8em 0; font-weight: var(--theme-font-h1_font-weight); } h1 {font-size: 1.882em;} h2 {font-size: 1.706em;} h3 {font-size: 1.471em;} h4 {font-size: 1.294em;} h5 {font-size: 1.176em;} h6 {font-size: 1.118em;} p, ol, ul, dl { margin: 0 0 1.2em 0; } p, ol, ul, dl, h1, h2, h3, h4, h5, h6 { &:last-child { margin-bottom: 0; } } } /* AI Helper Chat */ .sc_chat_content { --trx-addons-ai-helper-chat-content-border-radius: 0; background-color: var(--theme-color-alter_bg_color); } .sc_chat_form_field_prompt_label { line-height: 1.2em; font-weight: var(--theme-font-h6_font-weight); color: var(--theme-color-inverse_hover); background-color: var(--theme-color-text_dark); text-transform: uppercase; .sc_chat_form_start_new { color: inherit; font-weight: inherit; &:hover { color: inherit; opacity: .8; } } } .sc_chat_form_field_prompt { input[type="text"] { --trx-addons-ai-helper-chat-fields-border-radius: 0; padding: 0 20px; height: 60px; border: none; color: var(--theme-color-text); background-color: var(--theme-color-bg_color); &:focus { color: var(--theme-color-text_dark); } &[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) } &[placeholder]:focus::-webkit-input-placeholder { color: var(--theme-color-text_dark) } &[placeholder]:focus::-moz-placeholder { color: var(--theme-color-text_dark) } &[placeholder]:focus:-ms-input-placeholder { color: var(--theme-color-text_dark) } &[placeholder]:focus::placeholder { color: var(--theme-color-text_dark) } &[placeholder]:active::-webkit-input-placeholder { color: var(--theme-color-text_dark) } &[placeholder]:active::-moz-placeholder { color: var(--theme-color-text_dark) } &[placeholder]:active:-ms-input-placeholder { color: var(--theme-color-text_dark) } &[placeholder]:active::placeholder { color: var(--theme-color-text_dark) } } .sc_chat_form_field_prompt_button { --trx-addons-ai-helper-chat-button-border-radius: 0; @include abs-rc(5px); @include font(var(--theme-font-button_font-size), '', var(--theme-font-button_font-weight)); text-transform: var(--theme-font-button_text-transform); letter-spacing: var(--theme-font-button_letter-spacing); display: inline-block; padding: 0 25px; height: 50px; line-height: 48px; color: var(--theme-color-inverse_link); background-color: var(--theme-color-text_link); &:not(.sc_chat_form_field_prompt_button_disabled):hover { color: var(--theme-color-inverse_link); background-color: var(--theme-color-text_hover); } } .sc_chat_form_field_prompt_button_disabled { opacity: .8; } } .sc_chat_result { border-left: none; border-right: none; .sc_chat_list { .sc_chat_list_item { .sc_chat_list_item_time { @include font(14px, 26px); color: var(--theme-color-text_light); } .sc_chat_list_item_content { background-color: var(--theme-color-bg_color); color: var(--theme-color-text_dark); h1, h2, h3, h4, h5, h6 { margin: 0 0 0.8em 0; color: var(--theme-color-text_dark); font-weight: var(--theme-font-h1_font-weight); } h1 {font-size: 1.882em;} h2 {font-size: 1.706em;} h3 {font-size: 1.471em;} h4 {font-size: 1.294em;} h5 {font-size: 1.176em;} h6 {font-size: 1.118em;} p, ol, ul, dl { margin: 0 0 1.2em 0; } p, ol, ul, dl, h1, h2, h3, h4, h5, h6 { margin: 0 0 0.8em 0; &:last-child { margin-bottom: 0; } } } &.sc_chat_list_item_user { .sc_chat_list_item_content { background-color: var(--theme-color-text_link); color: var(--theme-color-inverse_link); } } } .sc_chat_list_item_loading { .sc_chat_list_item_loading_dot { background-color: var(--theme-color-text_link); } } } } .sc_chat_form_field_tags_item { --trx-addons-ai-helper-chat-tags-border-radius: 0; padding: 11px 15px 12px 15px; margin: 0 5px 5px 0; @include font(13px, 1em, 400); color: var(--theme-color-text_dark); background-color: var(--theme-color-bg_color); &:hover { color: var(--theme-color-inverse_link); background-color: var(--theme-color-text_link); } } .sc_chat_form_field_tags_label { padding: 9px 15px 9px 0; @include font(13px, 17px, 600); text-transform: uppercase; } /* AI Helper Music Generator */ .sc_mgenerator { --trx-addons-ai-helper-mgenerator-fields-border-radius: 0; --trx-addons-ai-helper-mgenerator-loading-border-radius: var(--trx-addons-ai-helper-mgenerator-fields-border-radius); --trx-addons-ai-helper-mgenerator-settings-border-radius: 0; --trx-addons-ai-helper-mgenerator-message-border-radius: 0; --trx-addons-ai-helper-mgenerator-button-border-radius: 0; --trx-addons-ai-helper-mgenerator-tags-border-radius: 0; } .sc_mgenerator_form .trx_addons_loading { background-color: var(--theme-color-bg_color_07); } .sc_mgenerator_form_field_inner { > .select_container select, > .sc_mgenerator_form_field_model_wrap > .select_container select, > .sc_mgenerator_form_field_numeric_wrap input[type="number"], > input[type="text"], > .theme_form_field_text { padding: 0 20px; height: 60px; border: none; color: var(--theme-color-alter_text); background-color: var(--theme-color-alter_bg_color) !important; &:focus { color: var(--theme-color-alter_dark); } &[placeholder]::-webkit-input-placeholder { color: var(--theme-color-alter_text); } &[placeholder]::-moz-placeholder { color: var(--theme-color-alter_text); } &[placeholder]:-ms-input-placeholder { color: var(--theme-color-alter_text); } &[placeholder]::placeholder { color: var(--theme-color-alter_text); } &[placeholder]:focus::-webkit-input-placeholder { color: var(--theme-color-alter_dark); } &[placeholder]:focus::-moz-placeholder { color: var(--theme-color-alter_dark); } &[placeholder]:focus:-ms-input-placeholder { color: var(--theme-color-alter_dark); } &[placeholder]:focus::placeholder { color: var(--theme-color-alter_dark); } &[placeholder]:active::-webkit-input-placeholder { color: var(--theme-color-alter_dark); } &[placeholder]:active::-moz-placeholder { color: var(--theme-color-alter_dark); } &[placeholder]:active:-ms-input-placeholder { color: var(--theme-color-alter_dark); } &[placeholder]:active::placeholder { color: var(--theme-color-alter_dark); } } > .theme_form_field_text { @include flex; @include flex-align-items(center); } > label { color: var(--theme-color-text_dark); @include font(16px, 1.3em, var(--theme-font-h5_font-weight)); text-transform: uppercase; } } .sc_mgenerator_form_field_prompt { .sc_mgenerator_form_field_prompt_button { @include abs-rc(5px); @include font(var(--theme-font-button_font-size), '', var(--theme-font-button_font-weight)); text-transform: var(--theme-font-button_text-transform); letter-spacing: var(--theme-font-button_letter-spacing); display: inline-block; padding: 0 25px; height: 50px; line-height: 48px; color: var(--theme-color-inverse_link); background-color: var(--theme-color-alter_link); &:not(.sc_mgenerator_form_field_disabled):hover { color: var(--theme-color-inverse_link); background-color: var(--theme-color-alter_hover); } } .sc_mgenerator_form_field_disabled { opacity: .8; } } .sc_mgenerator_form_field_upload_audio_decorator { .sc_mgenerator_form_field_upload_audio_text { @include font(var(--theme-font-input_font-size), var(--theme-font-input_line-height), var(--theme-font-input_font-weight)); letter-spacing: var(--theme-font-input_letter-spacing); color: var(--theme-color-alter_text); } .sc_mgenerator_form_field_upload_audio_button { @include font(var(--theme-font-button_font-size), '', var(--theme-font-button_font-weight)); text-transform: var(--theme-font-button_text-transform); letter-spacing: var(--theme-font-button_letter-spacing); right: 20px; padding: 0; border: none; @include border-radius(0); color: var(--theme-color-alter_dark); } } .sc_mgenerator_form_field_tags { margin-top: 20px; } .sc_mgenerator_form_field_tags_label { padding: 9px 15px 9px 0; @include font(13px, 17px, 600); text-transform: uppercase; } .sc_mgenerator_form_field_tags_item { padding: 11px 15px 12px 15px; margin: 0 5px 5px 0; @include font(13px, 1em, 400); color: var(--theme-color-alter_dark); background-color: var(--theme-color-alter_bg_color); &:hover { color: var(--theme-color-inverse_link); background-color: var(--theme-color-text_link); } } .sc_mgenerator_form_settings { max-width: 230px; color: var(--theme-color-alter_dark); background-color: var(--theme-color-alter_bg_color); .sc_mgenerator_form_settings_field_numeric_wrap { .sc_mgenerator_form_settings_field_numeric_wrap_button { padding: 0.1em 0; color: var(--theme-color-input_text); &:hover { color: var(--theme-color-input_dark); } } .sc_mgenerator_form_settings_field_numeric_wrap_button_dec:before, .sc_mgenerator_form_settings_field_numeric_wrap_button_inc:before { @include box(1em, 0.5em, 0.5em); font-weight: 400; } } label { @include font(16px, 1.5em, var(--theme-font-h5_font-weight)); text-transform: uppercase; } } .sc_mgenerator_form_settings_button { flex-shrink: 0; width: 60px; color: var(--theme-color-alter_dark); background-color: var(--theme-color-alter_bg_color); &:hover, &:focus { color: var(--theme-color-inverse_link); background-color: var(--theme-color-alter_link); } } .sc_mgenerator_music_inner .sc_mgenerator_music_wrap { width: 480px; } .sc_mgenerator_music_fetch_msg { @include font(16px, 1.3em, 400); color: var(--theme-color-text_light); } .sc_mgenerator_music_fetch_progress { background-color: var(--theme-color-bd_color); } .sc_mgenerator_music_fetch_progressbar { background-color: var(--theme-color-text_link); } .sc_mgenerator_limits .sc_mgenerator_limits_used { color: var(--theme-color-text_dark); } /* AI Helper Audio Generator */ .sc_agenerator { --trx-addons-ai-helper-agenerator-fields-border-radius: 0; --trx-addons-ai-helper-agenerator-loading-border-radius: 0; --trx-addons-ai-helper-agenerator-settings-border-radius: 0; --trx-addons-ai-helper-agenerator-message-border-radius: 0; --trx-addons-ai-helper-agenerator-button-border-radius: 0; --trx-addons-ai-helper-agenerator-tags-border-radius: 0; } .sc_agenerator_form_field_inner { > .select_container select, > .sc_agenerator_form_field_model_wrap > .select_container select, > .sc_agenerator_form_field_numeric_wrap input[type="number"], > input[type="text"], > .theme_form_field_text { padding: 0 20px; height: 60px; border: none; color: var(--theme-color-alter_text); background-color: var(--theme-color-alter_bg_color) !important; &:focus { color: var(--theme-color-alter_dark); } &[placeholder]::-webkit-input-placeholder { color: var(--theme-color-alter_text); } &[placeholder]::-moz-placeholder { color: var(--theme-color-alter_text); } &[placeholder]:-ms-input-placeholder { color: var(--theme-color-alter_text); } &[placeholder]::placeholder { color: var(--theme-color-alter_text); } &[placeholder]:focus::-webkit-input-placeholder { color: var(--theme-color-alter_dark); } &[placeholder]:focus::-moz-placeholder { color: var(--theme-color-alter_dark); } &[placeholder]:focus:-ms-input-placeholder { color: var(--theme-color-alter_dark); } &[placeholder]:focus::placeholder { color: var(--theme-color-alter_dark); } &[placeholder]:active::-webkit-input-placeholder { color: var(--theme-color-alter_dark); } &[placeholder]:active::-moz-placeholder { color: var(--theme-color-alter_dark); } &[placeholder]:active:-ms-input-placeholder { color: var(--theme-color-alter_dark); } &[placeholder]:active::placeholder { color: var(--theme-color-alter_dark); } } > .theme_form_field_text { @include flex; @include flex-align-items(center); } .select_container { &:after { right: 1em; color: var(--theme-color-alter_text); font-weight: 400; } &:hover:after, &:focus:after { color: var(--theme-color-alter_dark); } } > label { color: var(--theme-color-text_dark); @include font(16px, 1.3em, var(--theme-font-h5_font-weight)); } } .sc_agenerator_form_field_upload_audio_decorator .sc_agenerator_form_field_upload_audio_text, .sc_agenerator_form_field_upload_voice_modelslab_decorator .sc_agenerator_form_field_upload_voice_modelslab_text { @include font(var(--theme-font-input_font-size), var(--theme-font-input_line-height), var(--theme-font-input_font-weight)); letter-spacing: var(--theme-font-input_letter-spacing); color: var(--theme-color-alter_text); } .sc_agenerator_form_field_upload_audio_decorator .sc_agenerator_form_field_upload_audio_button, .sc_agenerator_form_field_upload_voice_modelslab_decorator .sc_agenerator_form_field_upload_voice_modelslab_button { @include font(var(--theme-font-button_font-size), '', var(--theme-font-button_font-weight)); text-transform: var(--theme-font-button_text-transform); letter-spacing: var(--theme-font-button_letter-spacing); right: 20px; padding: 0; border: none; @include border-radius(0); color: var(--theme-color-alter_dark); } .sc_agenerator_form_field_description { top: 3px; @include font(0.75em, 1.3em); color: var(--theme-color-alter_light); } .sc_agenerator_form_settings_button { flex-shrink: 0; width: 60px; color: var(--theme-color-alter_dark); background-color: var(--theme-color-alter_bg_color); &:hover, &:focus { color: var(--theme-color-inverse_link); background-color: var(--theme-color-alter_link); } } .sc_agenerator_form_field_model_wrap_with_settings { .sc_agenerator_form_settings_button[disabled] { opacity: 0.7; } .sc_agenerator_form_settings_field_description { color: var(--theme-color-alter_light); } } .sc_agenerator_form_settings { max-width: 230px; max-height: 260px; overflow-y: auto; overflow-x: hidden; color: var(--theme-color-alter_dark); background-color: var(--theme-color-alter_bg_color); @include thin-scrollbar; &::-webkit-scrollbar-thumb { @include border-radius(0); } .sc_agenerator_form_settings_field_numeric_wrap { .sc_agenerator_form_settings_field_numeric_wrap_button { padding: 0.1em 0; color: var(--theme-color-input_text); &:hover { color: var(--theme-color-input_dark); } } .sc_agenerator_form_settings_field_numeric_wrap_button_dec:before, .sc_agenerator_form_settings_field_numeric_wrap_button_inc:before { @include box(1em, 0.5em, 0.5em); font-weight: 400; } } label { display: block; @include font(16px, 1.5em, var(--theme-font-h5_font-weight)); text-transform: uppercase; } } .sc_agenerator_form_actions_item { > a { @include font(16px, 21px, 600); color: var(--theme-color-text); } &.sc_agenerator_form_actions_item_active > a, > a:hover, > a:focus { color: var(--theme-color-text_dark); } } .sc_agenerator_form_actions_slider { background-color: var(--theme-color-text_dark); } .sc_agenerator_form_actions_list:after { background-color: var(--theme-color-bd_color); } .sc_agenerator_form_field_inner > label { color: var(--theme-color-text_dark); @include font(16px, 1.3em, var(--theme-font-h5_font-weight)); text-transform: uppercase; } .sc_agenerator_form_field_generate { .sc_agenerator_form_field_generate_button { .sc_button_icon { display: none; } &.sc_agenerator_form_field_disabled { opacity: .8; } } } .sc_agenerator_audio_inner .sc_agenerator_audio_wrap { width: 480px; } .sc_agenerator_audio_fetch_msg { @include font(16px, 1.3em, 400); color: var(--theme-color-text_light); } .sc_agenerator_audio_fetch_progress { background-color: var(--theme-color-bd_color); } .sc_agenerator_audio_fetch_progressbar { background-color: var(--theme-color-text_link); } .sc_agenerator_limits { border-color: var(--theme-color-bd_color); .sc_agenerator_limits_used { color: var(--theme-color-text_dark); } } /* Squeeze images */ .sc_squeeze_titles .sc_squeeze_title { .sc_squeeze_title_text { @include font(var(--theme-font-h1_font-size), var(--theme-font-h1_line-height), var(--theme-font-h1_font-weight)); } .sc_squeeze_subtitle_text { font-family: var(--theme-font-p_font-family); @include font(14px, 18px, 700); text-transform: uppercase; letter-spacing: 1.4px; margin-bottom: 12px; } }