/* ============================================================================= */
/* ========================== CUSTOMER douglas ================================= */
/* ============================================================================= */
/* ======= LAST UPDATE: 20/04/26 / VERSION: v01  / AUTHOR: Klemen ============= */
/* ============================================================================= */

/* ============================================================
   0. ROOT VARIABLES
============================================================ */
:root {
    /* BORDER */
    --border-radius: 6px;
    --border-color: #e2e2e4;
    --button-bg-hover: #e3d0b4;
    /* HEADER */
    --sb-background-mobile-header-appintranet: #fff;
    --content-font-family: 'Avenir Next', 'sans-serif';
    --heading-font-family: var(--content-font-family);
}

/* =============================================================================
= GLOBAL SETTINGS ==============================================================
================================================================================ */

html,
html.simulated {
    font-family:
        'AvenirNext LT Pro', Inter, 'Helvetica Neue', 'Lucida Grande',
        Helvetica, Arial, sans-serif;
}

h1 {
    font-family:
        'AvenirNext LT Pro Demi', Inter, 'Helvetica Neue', 'Lucida Grande',
        Helvetica, Arial, sans-serif;
}

h2 {
    font-family:
        'AvenirNext LT Pro Demi', Inter, 'Helvetica Neue', 'Lucida Grande',
        Helvetica, Arial, sans-serif;
    font-size: 19px !important;
}

h3 {
    font-family:
        'AvenirNext LT Pro Demi', Inter, 'Helvetica Neue', 'Lucida Grande',
        Helvetica, Arial, sans-serif;
    font-size: 18px !important;
}

.news-feed .news-feed-post-teaser > a {
    /*  border-top: 1px solid rgb(229, 229, 229); 
      margin-top: 15px; */
    padding-top: 5px;
}

div[data-testid='social-button-bar-top'] {
    display: none !important;
}

.desktop .news-feed-post-social-footer:has(.reactions) {
    display: flex;
    flex-direction: row;
    gap: 20px;
    border-top: 1px solid rgb(229, 229, 229);
}

.desktop news-slider-block .news-feed-post-social-footer {
    display: flex;
    flex-direction: row;
    gap: 20px;
    margin-top: 20px !important;
    border-top: none !important;
}

.desktop .news-feed-post-social-counts {
    padding-top: 20px;
}

.mobile .news-feed-post-social-footer:has(.reactions) {
    border-top: 1px solid rgb(229, 229, 229);
    padding-top: 5px;
}

/* =============================================================================
= BREADCRUMBS ==================================================================
================================================================================ */

#wrapper:has(#content.page.feed-post-page) #breadcrumbs,
#wrapper:has(#content.page.new-feed) #breadcrumbs {
    margin-inline: auto;
    width: 70%;
}

/* =============================================================================
= WELCOME ======================================================================
================================================================================ */

.mobile .welcome.welcome {
    margin-top: 44px !important;
}

.tutorial-page.tutorial-page .body {
    padding: 20px 20px 0;
    margin-bottom: 0;
}

.single div:has(button),
.single button {
    width: 100%;
}

/* =============================================================================
= TRANSLATION BUTTON ===========================================================
================================================================================ */
/* Translation Button */
.page .translation-toggle-top-position {
    border: 1px solid var(--border-color);
    padding: 4px 8px 4px 8px;
    border-radius: var(--border-radius);
}

.page
    .translation-toggle-top-position.translation-toggle-top-position.translation-toggle-top-position:hover,
.page
    .translation-toggle-top-position.translation-toggle-top-position.translation-toggle-top-position:focus {
    background-color: var(--button-bg-hover);
    color: #000;
}

/* =============================================================================
= SIGNIN MASK ==================================================================
================================================================================ */
.signin-container div.signin-view a {
    text-decoration: none;
    font-size: 10px;
}

.signin .logo {
    margin: 0px auto;
    display: block;
    background: url('https://spark.douglas.group/api/media/secure/external/v2/image/upload/t_preview/69a96390a34bbe5961d81083.png?accessorId=branch_68dbe4a6b8e2bd72a0351213&media_token=EWTfjp2J7NSex4gUx4pnUW%2F%2Bo5nWbqnwCv2QBdmr26M%3D')
        no-repeat center center;
    background-color: #ffffff;
    background-size: cover;
}
.dialog.signin .logo {
    width: 100% !important;
}
.dialog.signin .dialog-inner,
.signin .page-content {
    background-color: #ffffff;
}
.page.signin .logo {
    width: 100%;
    margin: 0 auto;
}
@media screen and (min-width: 515px) {
    .page.signin .logo {
        margin: 70px auto 0 auto;
        width: 400px;
    }
}

/* =============================================================================
= HIDDEN ITEMS =================================================================
================================================================================ */
/* PLEASE COMMENT WHAT YOU HIDE ================================================ */
/* hide the "oder / or" between login methods */
.signin-view[data-view-id='sso'] + hr {
    display: none !important;
}

/* Hide App Download Link in User Settings ===================== */
a.item.with-arrow.clickable.platform-ios.open-default.default-link-handling {
    display: none;
}

a.item.with-arrow.clickable.platform-android.open-default.default-link-handling {
    display: none;
}

a.item.with-arrow.clickable.platform-android.open-internal {
    display: none;
}

/* WIDGET HEADLINES ====================================================================== */
.wide .page .page-content .content-widget-wrapper > h2.content-widget-title {
    font-size: 21px !important;
    font-family:
        'AvenirNext LT Pro Demi', Inter, 'Helvetica Neue', 'Lucida Grande',
        Helvetica, Arial, sans-serif;
}
.mobile .page .page-content h2.content-widget-title span {
    font-size: 21px !important;
    font-family:
        'AvenirNext LT Pro Demi', Inter, 'Helvetica Neue', 'Lucida Grande',
        Helvetica, Arial, sans-serif;
}

/* NEWSFEED HEADLINES ====================================================================== */
h2.news-feed-post-headline {
    font-size: 21px !important;
    font-family:
        'AvenirNext LT Pro Demi', Inter, 'Helvetica Neue', 'Lucida Grande',
        Helvetica, Arial, sans-serif;
}

.mobile h2.news-feed-post-headline {
    font-size: 21px !important;
    font-family:
        'AvenirNext LT Pro Demi', Inter, 'Helvetica Neue', 'Lucida Grande',
        Helvetica, Arial, sans-serif;
}

/* NEWS STAGE HEADLINES ====================================================================== */
.swiper-container h2.news-feed-post-headline {
    font-size: 21px !important;
    font-family:
        'AvenirNext LT Pro Demi', Inter, 'Helvetica Neue', 'Lucida Grande',
        Helvetica, Arial, sans-serif;
}

.desktop .page-content h1.news-feed-channel-headline {
    font-family:
        'AvenirNext LT Pro Demi', Inter, 'Helvetica Neue', 'Lucida Grande',
        Helvetica, Arial, sans-serif;
}

.news-feed-list .news-feed-channel-headline a {
    font-size: 21px !important;
    font-family:
        'AvenirNext LT Pro Demi', Inter, 'Helvetica Neue', 'Lucida Grande',
        Helvetica, Arial, sans-serif;
}

css-1ir4nh6-BigStyledMedia.css-1ir4nh6-BigStyledMedia {
    background: #000;
}

.news-feed .news-feed-post-teaser > a > .read-more.read-more,
.news-slider-slide .news-feed-post-teaser > a > .read-more.read-more {
    border: 1px solid var(--border-color);
    padding: 4px 8px 4px 8px;
    display: inline-block;
    margin-top: 8px;
    border-radius: var(--border-radius);
    color: #000;
}

.news-feed-widget .news-feed .news-feed-post-teaser > a > .read-more.read-more {
    margin-inline-start: 0;
}

.desktop
    .column-33
    > .news-feed-wrapper
    .news-feed-post-teaser.news-feed-post-teaser
    > span {
    -webkit-line-clamp: 3;
}

.mouse .news-feed .news-feed-post-teaser > a > .read-more.read-more:hover,
.mouse
    .news-slider-slide
    .news-feed-post-teaser
    > a
    > .read-more.read-more:hover {
    background: var(--button-bg-hover);
    transition-duration: 0.3s;
}

.news-feed .news-feed-post-teaser > a,
.news-slider-slide .news-feed-post-teaser > a {
    display: block;
}

news-slider-block[layout='gradient']
    .news-slider-inner-content-wrapper
    .news-feed-post-teaser
    > a
    .read-more:hover {
    color: #000;
}

.portfolio-wrapper
    .ui-commons__portfolio-widget__panel-wrapper.ui-commons__portfolio-widget__panel-wrapper
    > a:hover,
.mouse
    .quick-links-widget.type-list.direction-vertical.direction-vertical
    li
    a:hover {
    background: #f4eee6;
    transition-duration: 0.3s;
}

/* ============================================================
    2. LAYOUT (Page skeleton: containers, grid/flex systems)
============================================================ */
.regular-width-container {
    max-width: 1300px;
    margin: 0 auto;
}

.mobile.wide .page-content > .scroller,
.desktop .page-content > .scroller {
    padding: 0 !important;
    margin: 0 !important;
}

/* COLUMNS */
html.desktop
    .ui-commons__section__wrapper:has(> .column-66):has(> .column-33)
    > .column-66 {
    width: 66%;
}

html.desktop
    .ui-commons__section__wrapper:has(> .column-66):has(> .column-33)
    > .column-33 {
    width: 30.5%;
}

html.desktop
    .ui-commons__section__wrapper:has(> .column-66):has(> .column-33)
    > .ui-commons__section__column:not(:first-child) {
    margin-inline-start: 3.5% !important;
}

html.desktop
    .ui-commons__section__wrapper:not(:has(> .column-66)):has(> .column-33)
    > .column-33 {
    width: 31.5%;
}

html.desktop
    .ui-commons__section__wrapper:not(:has(> .column-66)):has(> .column-33)
    > .ui-commons__section__column:not(:first-child) {
    margin-inline-start: 2.5% !important;
}

html.desktop .ui-commons__section__wrapper:has(> .column-50) > .column-50 {
    width: 48.5%;
}

html.desktop
    .ui-commons__section__wrapper:has(> .column-50)
    > .ui-commons__section__column:not(:first-child) {
    margin-inline-start: 3% !important;
}

/* ============================================================
    3. COMPONENTS (UI pieces)
============================================================ */
/* HEADER */
.mobile header.header-container {
    background-color: var(--sb-background-mobile-header-appintranet) !important;
}

.mobile header.header-container * {
    color: black !important;
}

html:is(.desktop, .mobile:has(.full-width-home-page)) .header-title {
    display: none !important;
}

.mobile .header-title,
.mobile header.header-container button span.we-icon {
    color: var(--sb-brand);
}

#header #search-input {
    position: absolute;
    height: 100%;
    width: 100%;
    left: 0;
}

#header #search-input .ds-search-input__wrapper {
    border-radius: 100px;
}

.mobile .header-container .header-button-back {
    color: var(--sb-brand);
}

/* FLOATING NAV */
.desktop nav ul {
    --sb-text-menubar-intranet: var(--sb-text-header-appintranet);
}

.desktop nav a.\!text-menubar-intranet-pressed:not(:hover) {
    --sb-text-menubar-intranet: var(--sb-background-menubar-intranet);
}

/* BUTTONS */
.button-block-link {
    border-radius: var(--border-radius) !important;
}

.button-block-link.ui-commons__button-widget.ui-commons__button-widget.ui-commons__button-widget {
    width: 100%;
}

/* TILES WIDGET */
.quick-links-widget.type-tiles li {
    border: 1px solid var(--border-color);
    border-radius: var(--border-radius) !important;
}

.quick-links-widget.type-tiles.type-tiles li a {
    font-size: 14px !important;
    line-height: 26px !important;
    padding: 54px 16px 0;
    top: 0;
    position: absolute;
}

.quick-links-wrapper.left-align .quick-links-widget.type-tiles li {
    text-align: left;
}

.quick-links-wrapper.left-align .quick-links-widget.type-tiles li img {
    margin: 8px auto 0 12px;
}

.quick-links-widget--tiles .quick-links-widget__item {
    height: 88px;
}

/* FULL WIDTH ARTICLE - NEWS BANNER */
.full-width-news-banner {
    min-height: fit-content;
    position: relative;
    background: transparent !important;
}

.full-width-news-banner .swiper,
.full-width-news-banner .swiper-container,
.full-width-news-banner
    .news-slider-slide.swiper-slide
    .news-feed-post-media-dummy,
.full-width-news-banner .news-slider-slide.swiper-slide article,
.full-width-news-banner
    .news-slider-content-wrapper.news-slider-content-wrapper,
.full-width-news-banner
    news-slider-block
    .swiper
    .news-slider-media-wrapper
    .news-feed-post-image,
.full-width-news-banner
    news-slider-block
    .swiper
    .news-slider-media-wrapper
    .news-feed-post-video {
    border-radius: 0;
}

.desktop
    .full-width-news-banner
    .content-widget-wrapper.news-stage-wrapper.dynamic-widget-with-ptr,
.desktop
    .full-width-news-banner
    .content-widget-wrapper.news-stage-wrapper.dynamic-widget-with-ptr
    news-slider-block,
.desktop
    .full-width-news-banner
    .content-widget-wrapper.news-stage-wrapper.dynamic-widget-with-ptr
    news-slider-block
    .news-slider-container,
.desktop
    .full-width-news-banner
    .content-widget-wrapper.news-stage-wrapper.dynamic-widget-with-ptr
    news-slider-block
    .news-slider-container
    .swiper,
.desktop
    .full-width-news-banner
    .content-widget-wrapper.news-stage-wrapper.dynamic-widget-with-ptr
    news-slider-block
    .news-slider-container
    .swiper
    .swiper-wrapper,
.desktop
    .full-width-news-banner
    .content-widget-wrapper.news-stage-wrapper.dynamic-widget-with-ptr
    news-slider-block
    .news-slider-container
    .swiper
    .swiper-wrapper
    .swiper-slide,
.desktop
    .full-width-news-banner
    .content-widget-wrapper.news-stage-wrapper.dynamic-widget-with-ptr
    news-slider-block
    .news-slider-container
    .swiper
    .swiper-wrapper
    .swiper-slide
    article.slide-post,
.desktop
    .full-width-news-banner
    .content-widget-wrapper.news-stage-wrapper.dynamic-widget-with-ptr
    news-slider-block
    .news-slider-container
    .swiper
    .swiper-wrapper
    .swiper-slide
    article.slide-post
    .news-slider-media-wrapper,
.desktop
    .full-width-news-banner
    .content-widget-wrapper.news-stage-wrapper.dynamic-widget-with-ptr
    news-slider-block
    .news-slider-container
    .swiper
    .swiper-wrapper
    .swiper-slide
    article.slide-post
    .news-slider-media-wrapper
    * {
    height: 100% !important;
    min-height: 750px !important;
    max-height: 750px !important;
    margin: 0 !important;
}

.full-width-news-banner .news-slider-media-wrapper,
.full-width-news-banner .news-slider-media-wrapper .news-feed-post-link,
.full-width-news-banner
    .news-slider-media-wrapper
    .news-feed-post-link
    .news-feed-post-image {
    height: 100%;
}

.full-width-news-banner
    .news-slider-media-wrapper
    .news-feed-post-link
    .news-feed-post-image
    img {
    object-fit: cover;
    height: 100%;
    width: 100%;
}

.full-width-news-banner
    .news-slider-media-wrapper
    .news-feed-post-image::after {
    background: rgba(0, 0, 0, 0.3) !important;
}

.full-width-news-banner news-slider-block .swiper .news-slider-media-wrapper {
    margin-bottom: 0 !important;
}

.full-width-news-banner
    .news-slider-content-wrapper
    .news-slider-inner-content-wrapper
    .news-feed-post-headline {
    overflow: visible;
    -webkit-line-clamp: 4;
    letter-spacing: -0.04em;
}

.full-width-news-banner
    .content-widget-wrapper.news-stage-wrapper.dynamic-widget-with-ptr {
    margin: 0;
}

.desktop .full-width-news-banner .news-slider-content-wrapper {
    position: absolute;
    width: 100%;
    max-width: 1300px;
    top: 40%;
    left: 50%;
    transform: translateX(-50%);
    align-items: start;
}

.full-width-news-banner
    .news-slider-content-wrapper
    .swiper-slide.news-slider-slide
    article.slide-post {
    border-radius: 0;
}

.mobile .full-width-news-banner .news-slider-content-wrapper {
    position: absolute;
    width: 100%;
    bottom: 5%;
    left: 16px;
    align-items: start;
}

.desktop
    .full-width-news-banner
    .news-slider-content-wrapper
    .news-slider-inner-content-wrapper {
    max-width: 60%;
    padding: 0;
}

.desktop
    .full-width-news-banner
    .news-slider-content-wrapper
    .news-slider-inner-content-wrapper
    .news-feed-post-headline {
    font-size: 60px !important;
    font-weight: 600;
    line-height: normal;
}

.desktop .full-width-news-banner .column-33 {
    position: relative;
    top: 85px;
}

.desktop .full-width-news-banner .heading-large-hero {
    font-size: 65px;
    line-height: 75px;
    padding-right: 170px;
    padding-top: 60px;
}

.desktop .full-width-news-banner .content-widget-wrapper.section-wrapper {
    padding-top: calc(136px + 44px);
}

.desktop .full-width-news-banner div:has(> button.news-slider-navbutton-prev) {
    position: absolute;
    top: 0px;
    left: 0px;
    right: 0px;
    width: 100%;
    height: 100%;
    padding-bottom: 0;
}

.mobile .full-width-news-banner {
    padding: 0;
}

.mobile
    .full-width-news-banner
    .content-widget-wrapper.news-stage-wrapper.dynamic-widget-with-ptr,
.mobile
    .full-width-news-banner
    .content-widget-wrapper.news-stage-wrapper.dynamic-widget-with-ptr
    news-slider-block,
.mobile
    .full-width-news-banner
    .content-widget-wrapper.news-stage-wrapper.dynamic-widget-with-ptr
    news-slider-block
    .news-slider-container,
.mobile
    .full-width-news-banner
    .content-widget-wrapper.news-stage-wrapper.dynamic-widget-with-ptr
    news-slider-block
    .news-slider-container
    .swiper,
.mobile
    .full-width-news-banner
    .content-widget-wrapper.news-stage-wrapper.dynamic-widget-with-ptr
    news-slider-block
    .news-slider-container
    .swiper
    .swiper-wrapper {
    height: 100%;
}

.mobile .full-width-news-banner .column-66 {
    position: absolute;
    bottom: 32px;
}

.mobile
    .full-width-news-banner
    news-slider-block
    .swiper
    .news-slider-media-wrapper
    .news-feed-post-image {
    padding-bottom: 0 !important;
    margin: auto auto 0;
    width: 100%;
    height: 100%;
    overflow: hidden;
    background-repeat: no-repeat;
    background-size: cover;
    background-position: center center;
    aspect-ratio: 1 / 1;
}

.mobile
    .full-width-news-banner
    news-slider-block
    .swiper
    .news-slider-media-wrapper
    .news-feed-post-image
    img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    object-position: center;
    display: block;
}

.mobile
    .full-width-news-banner
    .news-slider-content-wrapper
    .news-slider-inner-content-wrapper {
    max-width: 85%;
    padding: 0;
}

.mobile
    .full-width-news-banner
    .news-slider-content-wrapper
    .news-slider-inner-content-wrapper
    .news-feed-post-headline {
    font-size: 40px;
    font-weight: 600;
    line-height: normal;
}

.mobile .full-width-news-banner div:has(> button.news-slider-navbutton-prev) {
    position: absolute;
    bottom: 0px;
    left: 0px;
    right: 0px;
    width: 100%;
    height: 100%;
    padding-bottom: 0;
}

/* FULL WIDTH NEWS BANNER WIDGET */
.full-width-news-banner .banner-widget-container {
    z-index: 3;
    position: absolute;
    top: 40%;
    right: calc(50% - min(650px, 50%));
    max-width: 395px;
}

.full-width-news-banner
    .banner-widget-container
    > div.content-widget-wrapper.static-content-wrapper {
    padding: 16px;
    border-radius: var(--border-radius) !important;
}

.banner-widget-container > .content-widget-wrapper {
    border-radius: var(--border-radius) !important;
}

.full-width-news-banner
    .banner-widget-container
    > div.content-widget-wrapper.static-content-wrapper {
    padding: 16px;
    border-radius: var(--border-radius) !important;
}



.banner-widget-container
    .portfolio-wrapper
    > .portfolio-widget
    .ui-commons__portfolio-widget__panel-wrapper {
    border: none !important;
    border-radius: var(--border-radius) !important;
    margin: 0 !important;
    width: 100% !important;
    max-width: 100% !important;
}


.banner-widget-container
    .portfolio-wrapper
    > .portfolio-widget
    .ui-commons__portfolio-widget__panel-wrapper img{
    max-height: 125px;
    object-fit: cover;
}

/*

.banner-widget-container
    .portfolio-wrapper
    > .portfolio-widget
    .ui-commons__portfolio-widget__panel-link:after {
    content: '';
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background-color: rgba(0, 0, 0, 0.3);
}


.banner-widget-container
    .portfolio-wrapper
    > .portfolio-widget
    .ui-commons__portfolio-widget__panel-text-wrapper {
    text-align: center;
    z-index: 100;
}

.banner-widget-container
    .portfolio-wrapper
    > .portfolio-widget
    .ui-commons__portfolio-widget__panel-link:hover
    .ui-commons__portfolio-widget__panel-text-wrapper
    * {
    text-decoration: underline;
}

.banner-widget-container
    .portfolio-wrapper
    > .portfolio-widget
    .ui-commons__portfolio-widget__panel-text-wrapper {
    position: absolute;
    top: 50%;
    left: 0;
    transform: translateY(-50%);
    width: 100%;
    padding: 16px;
}

*/

.mobile .ui-commons__portfolio-widget__panel-text-wrapper h2 {
    font-size: 24px !important;
}

.mobile
    .banner-widget-container
    .portfolio-wrapper
    > .portfolio-widget
    > .ui-commons__portfolio-widget__wrapper {
    flex-wrap: nowrap;
}

.mobile
    .banner-widget-container
    .portfolio-wrapper
    > .portfolio-widget
    > .ui-commons__portfolio-widget__wrapper
    > .ui-commons__portfolio-widget__panel-wrapper:not(:first-child) {
    margin-left: 10px;
}
.mobile
    .banner-widget-container
    .portfolio-wrapper
    > .portfolio-widget
    > .ui-commons__portfolio-widget__wrapper
    > .ui-commons__portfolio-widget__panel-wrapper {
    border-radius: var(--border-radius);
    overflow: hidden;
}

.mobile
    .banner-widget-container
    .portfolio-wrapper
    > .portfolio-widget
    > .ui-commons__portfolio-widget__wrapper
    > .ui-commons__portfolio-widget__panel-wrapper
    .ui-commons__portfolio-widget__panel-title {
    font-size: 12px;
    text-align: center;
}

.mobile
    .banner-widget-container
    .portfolio-wrapper:not(.widget-on-card)
    .ui-commons__portfolio-widget__wrapper {
    padding: 0;
}

/* POPULAR TOOLS */
.mobile.wide .popular-tools-container {
    padding-left: 32px;
    padding-right: 32px;
}

/* COUNTDOWN */
.mobile.wide .content-widget-wrapper:has(countdown-widget) {
    padding-left: 32px;
    padding-right: 32px;
}

.content-widget-wrapper.widget-on-card.counter {
    padding: 24px 16px 36px !important;
    border-radius: var(--border-radius) !important;
}

.movile .content-widget-wrapper.widget-on-card.counter {
    padding: 5px 16px 15px !important;
}

.mobile.compact .content-widget-wrapper.widget-on-card.counter {
    margin-bottom: 16px !important;
}

.mobile.wide .content-widget-wrapper.widget-on-card.counter {
    margin-bottom: 24px !important;
}

.mobile .content-widget-wrapper.widget-on-card.counter static-content-block {
    background: transparent !important;
}

.counter .column-33 .static-content-wrapper {
    padding: 10px !important;
    text-align: center;
}

.counter div:has(> countdown-widget) h1,
.counter div:has(> countdown-widget) h2 {
    margin-bottom: 0;
}

.counter countdown-widget {
    margin-bottom: 0 !important;
    margin-top: 5px !important;
}

.counter .cw-countdown-number,
.counter .cw-countdown-text {
    display: flex;
    gap: 10px;
}

.counter .cw-countdown-number {
    font-size: 32px;
}

.counter .cw-countdown-text {
    position: relative;
    text-transform: uppercase;
    font-size: 12px;
    line-height: 12px;
}

.counter .cw-countdown-number br,
.counter .cw-countdown-text br {
    display: none !important;
}

.counter .cw-countdown-master {
    padding: 8px !important;
}

.counter .cw-countdown-main {
    background: transparent !important;
    max-width: 260px;
    margin: auto;
}

.counter .cw-countdown-main:has(.cw-countdown-expired) {
    margin-bottom: 16px;
}

.counter .cw-countdown-expired {
    color: #ffffff;
    font-size: 24px;
    font-weight: 600;
}

.counter .cw-countdown-text-d,
.counter .cw-countdown-text-h,
.counter .cw-countdown-text-m,
.counter .cw-countdown-text-s {
    font-size: 10px !important;
    border-radius: 0 0 var(--border-radius) var(--border-radius);
    padding-bottom: 10px;
}

.counter .cw-countdown-number-d,
.counter .cw-countdown-number-h,
.counter .cw-countdown-number-m,
.counter .cw-countdown-number-s {
    padding: 12px 0 8px;
    border-radius: var(--border-radius) var(--border-radius) 0 0;
}

.counter .cw-countdown-number-d,
.counter .cw-countdown-number-h,
.counter .cw-countdown-number-m,
.counter .cw-countdown-number-s,
.counter .cw-countdown-text-d,
.counter .cw-countdown-text-h,
.counter .cw-countdown-text-m,
.counter .cw-countdown-text-s {
    width: 33% !important;
    background: #ffffff66;
    color: white !important;
}

.counter .cw-countdown-number-s,
.counter .cw-countdown-text-s {
    display: none !important;
}

.counter .ui-commons__static-content__content-wrapper > h2 {
    margin: 0 !important;
}

.counter .ui-commons__static-content__content-wrapper > p {
    margin-bottom: 16px;
    font-size: 14px;
    line-height: 20px;
    padding: 0 32px;
}

/* NEWS ARTICLES */
.news-feed-wrapper
    .news-feed.scroller
    .news-feed-list
    article.news-feed-post
    header
    > div:has(.news-feed-post-badges) {
    margin-bottom: 16px !important;
}

.news-feed-wrapper .news-feed.scroller .news-feed-list article.news-feed-post {
    padding: 24px 24px 16px 24px;
    border-radius: var(--border-radius);
    border: 1px solid var(--border-color);
}

.news-feed-wrapper
    .news-feed.scroller
    .news-feed-list
    article.news-feed-post:has(
        .news-feed-post-social-counts .news-feed-post-link.reactions
    ) {
    padding: 24px;
}

/*
.desktop
.with-interaction 
  .news-feed-wrapper
    .news-feed.scroller
    .news-feed-list
    article.news-feed-post {
      min-height: 520px; 
}
*/

.news-feed-wrapper
    .news-feed.scroller
    .news-feed-list
    article.news-feed-post
    .news-feed-post-social-counts:not(:has(.news-feed-post-link.reactions)) {
    display: none;
}

.news-feed-wrapper .news-feed.scroller .news-feed-list article header h2 span {
    display: -webkit-box;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 2;
    overflow: hidden;
}

.news-feed-wrapper
    .news-feed.scroller
    .news-feed-list
    article
    .news-feed-post-teaser {
    margin: 0;
    margin-top: 10px;
    margin-bottom: 10px;
}

/*
.news-feed-wrapper .news-feed.scroller .news-feed-list article footer {
    display: none;
}
*/

.news-feed-wrapper
    .news-feed.scroller
    .news-feed-list
    article.news-feed-post.news-feed-post-type-updates
    section.news-feed-post-teaser {
    margin-bottom: 16px;
}

/* NEWS SLIDER */
.news-stage-wrapper
    news-slider-block
    .news-slider-container
    .swiper
    .news-slider-pagination {
    display: none;
}

/* CREATE POST WIDGET */
.content-widget-wrapper.create-post-wrapper {
    border-radius: var(--border-radius) !important;
    border: 1px solid var(--border-color) !important;
}

.content-widget-wrapper.create-post-wrapper .create-post-widget {
    border-radius: var(--border-radius) !important;
}

/* MY TASKS WIDGET */
static-tasks .widget-card {
    border: 1px solid var(--border-color) !important;
    border-radius: var(--border-radius) !important;
    background-color: #fff !important;
}

/* MY ABSENCES WIDGET */
.content-widget-wrapper.user-absence-wrapper {
    border: 1px solid var(--border-color) !important;
    border-radius: var(--border-radius) !important;
    overflow: hidden !important;
}

.mobile .content-widget-wrapper.user-absence-wrapper {
    margin-top: 24px !important;
}

/* MY PAYSLIPS WIDGET */
.content-widget-wrapper.user-payslips-wrapper {
    border: 1px solid var(--border-color) !important;
    border-radius: var(--border-radius) !important;
    overflow: hidden !important;
}



/*

.content-widget-wrapper.accordion-wrapper {
    border: 1px solid var(--border-color) !important;    
    border-radius: var(--border-radius) !important;
}

.content-widget-wrapper.accordion-wrapper
    accordion-block
    div.widget-card
    > div {
    padding: 10px;
}

*/

.content-widget-wrapper.accordion-wrapper
    accordion-block
    div.widget-card
    > div
    div[role='heading']
    > div:nth-of-type(2) {
    bottom: 50%;
    transform: translateY(50%);
}

.content-widget-wrapper.accordion-wrapper
    accordion-block
    div.widget-card
    > div:has(div[aria-hidden='false'])
    div[role='heading']
    > div:nth-of-type(2) {
    bottom: 50%;
    transform: translateY(50%) rotate(180deg);
}

/* FOOTER */
.page-footer > .content-widget-wrapper.static-content-wrapper {
    border-radius: 0;
}

.page-footer p {
    font-size: 14px;
    line-height: 26px;
}

.page-footer p > strong {
    font-family: var(--heading-font-family);
}

.mobile .full-width-bg.page-footer > .content-widget-wrapper {
    margin-bottom: 0 !important;
}

.mobile .page-content:has(div.page-footer) {
    padding-bottom: var(--custom-safe-area-inset-bottom) !important;
}

.mobile .page-content > .scroller:has(div.page-footer) {
    padding-bottom: 0 !important;
}

/* ============================================================
    4. PAGES
============================================================ */
/* ---------------------- HOME PAGE ---------------------- */
html.desktop.with-floating-menu #wrapper:has(.full-width-home-page) {
    padding: 0 !important;
    width: 100%;
    max-width: unset;
}

.full-width-home-page {
    padding: 0 !important;
}

.mobile.wide .page-content:has(.full-width-home-page) {
    padding: 0 !important;
}
/* PLAIN ARTICLES SECTION */
.content-widget-wrapper:has(.news-articles-plain) {
    border-radius: 0 !important;
}

/*
.news-articles-plain
    .column-25:has(
        .content-widget-wrapper.news-feed-wrapper.news-feed-wrapper
    ) {
    display: flex;
}
*/

.desktop .news-articles-plain {
    padding-top: 50px;
}

.desktop .news-articles-plain div:has(> article) {
    padding: 0;
}

.news-articles-plain article header {
    margin-top: 15px;
}

@media (min-width: 1486px) {
  .desktop .news-articles-plain article .news-feed-post-image,
  .desktop .news-articles-plain .news-feed-post-video {
    height: 145px !important;
    padding-bottom: 0 !important;
    margin: 0 !important;
  }
}

.desktop .news-articles-plain .news-feed-post-video > div {
    height: 100%;
}

.news-articles-plain article .news-feed-post-video > div:has(> button),
.news-articles-plain article .news-feed-post-video button.video-placeholder,
.news-articles-plain
    article
    .news-feed-post-video
    button.video-placeholder
    img {
    padding: 0 !important;
    border-radius: 0 !important;
}

.desktop .news-articles-plain article .news-feed-post-video img {
    height: 100%;
    margin: 0 !important;
}

.news-articles-plain
    .news-feed-post
    h2.news-feed-post-headline.news-feed-post-headline.news-feed-post-headline {
    font-size: 18px !important;
    line-height: 22px !important;
    color: var(--sb-color-grey-900);
}

.news-articles-plain .news-feed-post .news-feed-post-meta {
    font-size: 12px;
    line-height: 16px;
    color: var(--sb-color-grey-700);
    display: -webkit-box;
    -webkit-line-clamp: 1;
    -webkit-box-orient: vertical;
    overflow: hidden;
}

.news-articles-plain .news-feed-post .news-feed-post-teaser span {
    font-size: 14px;
    font-style: normal;
    font-weight: 400;
    line-height: 18px;
    color: var(--sb-color-grey-900);
}

.desktop
    .news-articles-plain
    .column-25
    article.news-feed-post.news-feed-post.news-feed-post,
.desktop
    .news-articles-plain
    .column-33
    article.news-feed-post.news-feed-post.news-feed-post {
    background: transparent;
    box-shadow: none;
    border: none !important;
    border-radius: unset !important;
}

/* This might only work on webkit (chromium based browsers) */
.desktop .news-articles-plain article.news-feed-post section span {
    display: -webkit-box;
    -webkit-line-clamp: 3;
    -webkit-box-orient: vertical;
    overflow: hidden;
}

.news-articles-plain .news-feed-post-channel-link {
    color: #030303;
    font-weight: bold;
    text-decoration: none;
}

.news-articles-plain .news-feed-post-channel-link:hover {
    text-decoration: underline !important;
}

.news-articles-plain .read-more {
    color: #030303 !important;
}

/* LOCAL NEWS SECTION */
.desktop .local-news-container {
    padding-bottom: 24px;
}

.local-news-container
    .column-66.ui-commons__section__column
    .content-widget-wrapper.news-feed-wrapper.news-feed-wrapper {
    height: 100%;
    margin-bottom: 0;
    display: flex;
}

.local-news-container
    .column-66.ui-commons__section__column
    .content-widget-wrapper.section-wrapper {
    margin-bottom: 16px !important;
}

.local-news-container
    .column-66.ui-commons__section__column
    .content-widget-wrapper.section-wrapper:nth-of-type(2) {
    margin-bottom: 10px !important;
}

.local-news-container
    .column-66.ui-commons__section__column
    .content-widget-wrapper.section-wrapper
    .section-widget.content-widget
    .ui-commons__section__wrapper
    .column-50.ui-commons__section__column
    .news-feed-widget {
    width: 100%;
}

.local-news-container
    .column-66.ui-commons__section__column
    .section-widget.content-widget
    .ui-commons__section__wrapper
    .column-50.ui-commons__section__column
    .news-feed-wrapper
    .news-feed.scroller,
.local-news-container
    .column-66.ui-commons__section__column
    .content-widget-wrapper.section-wrapper
    .section-widget.content-widget
    .ui-commons__section__wrapper
    .column-50.ui-commons__section__column
    .news-feed-wrapper
    .news-feed.scroller
    .news-feed-list,
.local-news-container
    .column-66.ui-commons__section__column
    .content-widget-wrapper.section-wrapper
    .section-widget.content-widget
    .ui-commons__section__wrapper
    .column-50.ui-commons__section__column
    .news-feed-wrapper
    .news-feed.scroller
    .news-feed-list
    > div,
.local-news-container
    .column-66.ui-commons__section__column
    .content-widget-wrapper.section-wrapper
    .section-widget.content-widget
    .ui-commons__section__wrapper
    .column-50.ui-commons__section__column
    .news-feed-wrapper
    .news-feed.scroller
    .news-feed-list
    article {
    height: 100%;
}

.local-news-container
    .column-66.ui-commons__section__column
    .content-widget-wrapper.section-wrapper
    .section-widget.content-widget
    .ui-commons__section__wrapper
    .column-50.ui-commons__section__column
    .news-feed-wrapper
    .news-feed.scroller
    .news-feed-list
    article {
    display: flex;
    flex-direction: column;
}

.local-news-container
    .column-66.ui-commons__section__column
    .content-widget-wrapper.section-wrapper
    .section-widget.content-widget
    .ui-commons__section__wrapper
    .column-50.ui-commons__section__column
    .news-feed-wrapper
    .news-feed.scroller
    .news-feed-list
    article
    section,
.local-news-container
    .column-66.ui-commons__section__column
    .content-widget-wrapper.section-wrapper
    .section-widget.content-widget
    .ui-commons__section__wrapper
    .column-50.ui-commons__section__column
    .news-feed-wrapper
    .news-feed.scroller
    .news-feed-list
    article
    section {
    display: flex;
    /* flex-grow: 1;*/
    flex-direction: column;
}

.local-news-container .news-feed-wrapper {
    margin-bottom: 0 !important;
}

.mobile .local-news-container .news-feed-post-image,
.mobile .local-news-container .news-feed-post-video {
    margin: -24px -24px 24px -24px;
}

.mobile .local-news-container {
    margin-bottom: 0 !important;
}

.mobile .local-news-container > div {
    padding: 0 !important;
}

.mobile .local-news-container .news-feed-list > div:not(:last-child) {
    padding-bottom: 16px;
}

.local-news-container .news-feed-post-channel-link {
    color: #030303;
    font-weight: bold;
    text-decoration: none;
}

.local-news-container .news-feed-post-channel-link:hover {
    text-decoration: underline !important;
}

.local-news-container .read-more {
    color: #030303 !important;
}

.news-feed-post-kicker {
    display: none;
}

/* CALL OUT BANNER SECTION */
.content-widget-wrapper.static-content-wrapper:has(.call-out-banner) {
    border-radius: 0;
    margin: 0 !important;
}

.call-out-banner {
    background: #f4eee6;
    border-radius: var(--border-radius);
    padding: 32px;
    position: relative;
    overflow: hidden;
    height: 475px;
}

.desktop .call-out-banner {
    margin-top: 48px !important;
    margin-bottom: 48px !important;
}

.call-out-banner h1 {
    font-size: 64px !important;
    line-height: 70px !important;
    font-weight: 700 !important;
    padding-right: 80px !important;
}

.mobile .call-out-banner h1 {
    font-size: 24px !important;
    line-height: 32px !important;
    padding-right: 105px !important;
}

.mobile .call-out-banner {
    margin-top: 16px !important;
    margin-bottom: 16px !important;
    padding: 24px;
}

.call-out-banner > .content-widget-wrapper.section-wrapper,
.call-out-banner
    > .content-widget-wrapper.section-wrapper
    > .section-widget.content-widget,
.call-out-banner
    > .content-widget-wrapper.section-wrapper
    > .section-widget.content-widget
    > .ui-commons__section__wrapper,
.call-out-banner
    > .content-widget-wrapper.section-wrapper
    > .section-widget.content-widget
    > .ui-commons__section__wrapper
    > .column-100,
.call-out-banner
    > .content-widget-wrapper.section-wrapper
    > .section-widget.content-widget
    > .ui-commons__section__wrapper
    > .column-100
    > .content-widget-wrapper.section-wrapper,
.call-out-banner
    > .content-widget-wrapper.section-wrapper
    > .section-widget.content-widget
    > .ui-commons__section__wrapper
    > .column-100
    > .content-widget-wrapper.section-wrapper
    > .section-widget.content-widget,
.call-out-banner
    > .content-widget-wrapper.section-wrapper
    > .section-widget.content-widget
    > .ui-commons__section__wrapper
    > .column-100
    > .content-widget-wrapper.section-wrapper
    > .section-widget.content-widget
    > .ui-commons__section__wrapper {
    height: 100%;
}

.mobile
    .call-out-banner
    > .content-widget-wrapper.section-wrapper
    > .section-widget.content-widget
    > .ui-commons__section__wrapper
    > .column-100
    > .content-widget-wrapper.section-wrapper
    > .section-widget.content-widget
    > .ui-commons__section__wrapper {
    height: 75%;
}

.call-out-banner .column-66 {
    height: 100%;
    display: flex;
    flex-direction: column;
    justify-content: space-between;
}

.call-out-banner .column-66.ui-commons__section__column {
    z-index: 1;
}

.desktop .call-out-banner .column-33 img {
    position: absolute;
    bottom: -450px;
    right: 80px;
    max-width: 500px !important;
}

.mobile .call-out-banner .column-33 img {
    position: absolute;
    right: -85px;
    bottom: -220px;
    max-width: 300px;
}

.desktop .call-out-banner p.feature {
    position: absolute;
    bottom: 200px;
    right: 40px;
}

.mobile .call-out-banner p.feature {
    position: absolute;
    left: 24px;
    bottom: 24px;
    text-align: left !important;
    max-width: 140px;
}

.call-out-banner
    .button-wrapper
    .button-widget.content-widget
    a.button-block-link {
    border-radius: var(--border-radius);
}

/* SOCIAL WALL SECTION */

.plugin-691d858bad92df46ef159d80
    .social-wall-container
    .news-feed-post-social-actions {
    display: flex;
}

.plugin-691d858bad92df46ef159d80 .news-feed-post-social-actions,
.column-50 .news-feed-post-social-actions,
.column-33 .news-feed-post-social-actions,
.column-25 .news-feed-post-social-actions {
    display: none;
}

.content-widget-wrapper.static-content-wrapper:has(.social-wall-container) {
    margin-bottom: 0 !important;
    border: none;
}

.social-wall-container .content-widget-wrapper.news-feed-wrapper {
    margin-bottom: 0px !important;
}

.mobile .social-wall-container .news-feed-list > div:not(:last-child) {
    padding-bottom: 16px;
}

.mobile.wide
    .social-wall-container
    > .section-wrapper
    > .section-widget
    > .ui-commons__section__wrapper
    > .ui-commons__section__column {
    max-width: 100%;
    width: 100%;
    margin: 0;
}

.mobile.wide
    .social-wall-container
    .ui-commons__section__column:has(.news-feed-wrapper) {
    margin-bottom: 16px !important;
}

/* ---------------------- HOME SOCIAL PAGE ---------------------- */
.scroller:has(.home-social-page) {
    overflow: visible !important;
}

.mobile .home-social-page > .content-widget-wrapper {
    margin-bottom: 0 !important;
}

.mobile.wide .page-content:has(.home-social-page) {
    padding: 0 !important;
}

/* ---- Causes public area to be hidden --- */
/*
div:has(nav#breadcrumbs) {
    display: none;
}
*/
/* BACKGROUND IMAGE */
html.desktop:has(.home-social-page)::before {
    background-image: url('https://douglas.staffbase.com/api/media/secure/external/v2/image/upload/68f8a17beb993c5b23da9ee4.png');
    background-repeat: no-repeat;
    background-size: cover;
    background-position: bottom center;
    background-color: #f3f3f4;
    background-attachment: scroll, local;
    display: block;
    content: '';
    width: 100%;
    height: 400px;
    position: absolute;
}

html.desktop:has(.home-social-page)::after {
    content: '';
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 400px;
    background: rgba(0, 0, 0, 0.3);
    z-index: 1;
}

html.desktop:has(.home-social-page) #wrapper {
    z-index: 2;
}

/* COLUMNS */
html.desktop
    .home-social-page
    .ui-commons__section__wrapper:first-of-type:has(> .column-33):not(
        :has(> .column-66)
    )
    > .column-33 {
    width: 24.5%;
}

html.desktop
    .home-social-page
    .ui-commons__section__wrapper:first-of-type:has(> .column-33):not(
        :has(> .column-66)
    )
    > .column-33:nth-of-type(2) {
    width: calc(48% - 3%);
    max-width: calc(48% - 3%);
}

html.desktop
    .home-social-page
    .ui-commons__section__wrapper:first-of-type:has(> .column-33):not(
        :has(> .column-66)
    )
    > .column-33:not(:first-child) {
    margin-inline-start: 3% !important;
}

/* WELCOME AREA */
.welcome-area {
    border: 1px solid var(--border-color) !important;
    border-radius: var(--border-radius) !important;
    padding: 24px !important;
}

.mobile .home-social-page {
    padding-left: 0 !important;
    padding-right: 0 !important;
}

.mobile.compact .home-social-page .welcome-area {
    padding-left: 16px !important;
    padding-right: 16px !important;
}

.mobile.compact .home-social-page .welcome-area .static-content-widget {
    padding: 0 !important;
}

.mobile.wide .home-social-page .welcome-area {
    padding-left: 32px !important;
    padding-right: 32px !important;
}

/* NEWS SWIPER */
.home-social-page .swiper,
.home-social-page .swiper-container,
.home-social-page .news-slider-slide.swiper-slide .news-feed-post-media-dummy,
.home-social-page .news-slider-slide.swiper-slide article,
.home-social-page .news-slider-content-wrapper.news-slider-content-wrapper,
.home-social-page news-slider-block,
.home-social-page
    news-slider-block
    .swiper
    .news-slider-media-wrapper
    .news-feed-post-image,
.home-social-page
    news-slider-block
    .swiper
    .news-slider-media-wrapper
    .news-feed-post-video {
    overflow: hidden;
    border-radius: var(--border-radius);
}

/* NEWS */
.home-social-page .post-wall .news-feed-wrapper {
    margin-bottom: 0 !important;
}

/* ---------------------- MY COMPANY PAGE ---------------------- */
.desktop #wrapper:has(.my-company) {
    max-width: 100% !important;
    padding-left: 0 !important;
    padding-right: 0 !important;
}

.desktop #wrapper .scroller:has(.my-company) {
    padding-left: 0 !important;
    padding-right: 0 !important;
    margin: 0 !important;
}

.mobile.wide .page-content:has(.my-company) {
    padding: 0;
}

.mobile.wide .my-company {
    padding-left: 32px !important;
    padding-right: 32px !important;
}

/* BACKGROUND */
html.desktop:has(.my-company) #wrapper:before {
    content: '';
    position: absolute;
    left: 50%;
    transform: translateX(-50%);
    top: calc(-1 * 50vw * 0.53 + 100px);
    width: 50vw;
    height: calc(50vw * 0.53);
    border-radius: 443px;
    background: linear-gradient(
        229deg,
        rgba(255, 150, 0, 0.2) 48.9%,
        rgba(205, 72, 253, 0.2) 72.06%,
        rgba(0, 164, 253, 0.2) 91.91%
    );
    filter: blur(100px);
}

html.desktop:has(.my-company) #wrapper .scroller {
    overflow: visible !important;
}

html.mobile:has(.my-company) #wrapper .scroller:before {
    content: '';
    position: absolute;
    left: 50%;
    transform: translateX(-50%);
    top: calc(-1 * 75vw * 0.53 + 100px);
    width: 75vw;
    height: calc(75vw * 0.53);
    border-radius: 443px;
    background: linear-gradient(
        229deg,
        rgba(255, 150, 0, 0.4) 48.9%,
        rgba(205, 72, 253, 0.4) 72.06%,
        rgba(0, 164, 253, 0.4) 91.91%
    );
    filter: blur(100px);
}

/* WELCOME AREA */
.desktop .welcome {
    margin-bottom: 34px !important;
}

.mobile .welcome {
    margin-top: 24px !important;
}

/* MY TASKS */
.desktop .my-company static-tasks {
    margin-bottom: 24px;
}

.my-company .tasks-widget.tasks-widget__container {
    padding: 0 !important;
    max-width: 100% !important;
}

/* USER PROFILE WIDGET */
.content-widget-wrapper.user-profile-wrapper {
    border: 1px solid var(--border-color) !important;
    border-radius: var(--border-radius) !important;
    overflow: hidden !important;
}

/* FAQ SECTION */
.desktop .my-company .faq {
    border-radius: 0 !important;
    padding-left: 0;
    padding-right: 0;
}

.desktop .my-company .faq > .static-content-widget {
    max-width: 1300px;
    margin: auto;
    padding: 0 32px;
}

.my-company div:has(> .faq__pay) {
    border-radius: var(--border-radius) !important;
    overflow: hidden;
    background: linear-gradient(180deg, #addcee 0%, #f1f5f6 100%);
}

.my-company .faq__pay,
.my-company .faq__time-off {
    background: none !important;
}

.my-company div:has(> .faq__time-off) {
    border-radius: var(--border-radius) !important;
    overflow: hidden;
    background: linear-gradient(180deg, #adbcee 0%, #f1f5f6 100%);
}

/* EMPLOYEES AND MANAGEMENT & EMPLOYEE OFFERS PORTFOLIO BUTTONS */
.my-company
    .employees-and-management
    .ui-commons__portfolio-widget__panel-wrapper,
.my-company .employee-offers .ui-commons__portfolio-widget__panel-wrapper {
    margin: 0 !important;
}

.my-company
    .employees-and-management
    .ui-commons__portfolio-widget__panel-wrapper,
.my-company .employee-offers .ui-commons__portfolio-widget__panel-wrapper {
    border-radius: var(--border-radius) !important;
}

.my-company .employee-offers {
    margin-top: 24px;
}

/* SELF SERVICE */
.my-company .self-service .content-widget-wrapper {
    border-radius: var(--border-radius) !important;
}

/* ---------------------- YOU PAGE ---------------------- */
.mobile
    .you-page
    .portfolio-wrapper
    .portfolio-widget
    .ui-commons__portfolio-widget__wrapper
    .ui-commons__portfolio-widget__panel-wrapper
    .ui-commons__portfolio-widget__panel-link
    > img {
    max-width: 32px;
    filter: drop-shadow(0px 100px 0 var(--sb-brand-inverse));
    transform: translateY(-100px);
    margin: 0;
}

.mobile .you-page .ui-commons__portfolio-widget__panel-text-wrapper {
    padding: 0;
}

.mobile .you-page .portfolio-widget {
    padding: 0 !important;
}

.mobile .you-page .ui-commons__portfolio-widget__panel-link {
    padding: 16px;
    display: flex;
    flex-direction: column;
    justify-content: space-between;
    gap: 24px;
}

.mobile
    .you-page
    .portfolio-wrapper
    .portfolio-widget
    .ui-commons__portfolio-widget__wrapper
    .ui-commons__portfolio-widget__panel-wrapper,
.you-page .content-widget-wrapper:has(.user-pic) {
    background: var(--sb-brand) !important;
    border: none;
    border-radius: var(--border-radius) !important;
    overflow: hidden;
}

.mobile .page-content:has(.you-page) {
    background: white !important;
}

.mobile .you-page {
    padding: 16px 16px 0 16px !important;
}

.you-page .content-widget-wrapper .user-pic {
    width: 100px !important;
    height: 100px !important;
}

.you-page .content-widget-wrapper:has(.user-pic) h3 {
    font-size: 24px;
}

.you-page .content-widget-wrapper:has(.user-pic) p {
    font-weight: 500;
}

.you-page .ui-commons__portfolio-widget__panel-title,
.you-page .ui-commons__portfolio-widget__panel-description,
.you-page .content-widget-wrapper:has(.user-pic) h3 a,
.you-page .content-widget-wrapper:has(.user-pic) p a {
    color: var(--sb-brand-inverse) !important;
}

/* ---------------------- MY HR ---------------------- */
.scroller:has(.my-hr) {
    overflow: visible !important;
}

.mobile .my-hr {
    padding: 0 !important;
}

.my-hr .ui-commons__portfolio-widget__panel-wrapper {
    margin: 0 !important;
    border-radius: var(--border-radius);
}

.desktop .my-hr .ui-commons__hero_image__wrapper {
    border-radius: var(--border-radius) !important;
}

.my-hr .content-widget-wrapper.quick-links-wrapper,
.my-hr .content-widget-wrapper.navigation-wrapper,
.my-hr .content-widget-wrapper.section-wrapper.widget-on-card,
.my-hr .content-widget-wrapper.plugin-wrapper,
.my-hr .content-widget-wrapper.static-content-wrapper.widget-on-card {
    border-radius: var(--border-radius) !important;
}

.desktop .my-hr accordion-block > div > div {
    padding: 24px !important;
}

.my-hr accordion-block div:has(> .we-icon) {
    height: 100%;
    display: flex;
    align-content: center;
    align-items: center;
}

.mobile .my-hr div:has(> accordion-block) > .content-widget-title {
    padding: 24px 24px 0px 24px !important;
}

.mobile .my-hr .user-profile-wrapper .content-widget-title {
    padding: 16px 16px 0px 16px !important;
}