/* New logo in courses */ body.course.lesson .company-logo__container{ background-image: url("https://d3i9g4671ronu3.cloudfront.net/thoughtindustries-eu/image/upload/a_exif,c_lfill,h_150/v1/course-uploads/f86bfb1e-f628-483b-9811-046e663bd680/1vlen5q2ov40-Asset2_withBG.png"); background-repeat: no-repeat; background-size: contain; } body.course.lesson .company-logo__container img{ height: unset!important; /*opacity: unset!important;borrar*/ } /* SNK - company logo container */ .company-logo__container img,​.header .company__beta-logo .company-logo__container img { height: auto; max-height: 77px!important; max-width: 198px; width: 100% } .company-logo__container { margin-left: -24px; margin-top: -10px!important; padding: 0 } /* =============== VARIABLES =============== */ :root{ /* Typography */ --typography-font-family: Poppins; --typography-font-weight: 400; /* Headings */ --typography-platform-heading-XL-size: 61px; --typography-platform-heading-XL-line-height: 72px; --typography-platform-heading-L-size: 44px; --typography-platform-heading-L-line-height: 48px; --typography-platform-heading-M-size: 32px; --typography-platform-heading-M-line-height: 40px; --typography-platform-heading-S-size: 24px; --typography-platform-heading-S-line-height: 32px; /* Paragraphs */ --typography-paragraph-line-height: 22px; --typography-paragraph-font-size-XL: 18px; --typography-paragraph-font-size-M: 17px; --typography-paragraph-font-size-S: 14px; /* Colors */ --color-brand-white: #FFFFFF; --color-brand-black: #000000; --color-brand-blue: #0029FF; --color-brand-green: #5CFE50; --color-paragraph-dark-grey: #666666; --color-background-default-grey: #F5F5F5; --color-background-hover-grey-lighter: #E5E5E5; --color-background-hover-grey-darker: #CBCBCB; --color-background-hover-black: #000000cc; /* Shapes */ --card-border-radius: 4px; --buttons-border-radius: 2px; --buttons-padding: 8px 32px; /* --- COURSES --- */ /* Colors */ --color-background-blue: #E5E9FF; --color-background-grey: #F5F5F5; --color-background-light-red: #FFDDDD; --color-text-red: #8e0000; /* Borders */ --border-blue: 1px solid var(--color-brand-blue); --border-grey: 1px solid var(--color-background-default-grey); --border-red: 1px solid var(--color-text-red); /* Padding */ --snippets-padding-vertical-S: 20px 0; --snippets-padding-vertical-M: 40px 0; --snippets-padding-vertical-L: 60px 0; } /* =============== END variables =============== */ /* =============== GENERAL =============== */ body:not(body.manager, em), body:not(.manager) a, .hero .hero__caption span.h4{ font-family: var(--typography-font-family) !important; } p{ margin-bottom: 25px!important; } ol, ul{ margin-bottom: 30px; } /* ----- Buttons styling ----- */ body:not(.manager) button:not(.autoplayBtn), body:not(.manager) .btn:not(.autoplayBtn) { border-radius: var(--buttons-border-radius) !important; font-family: var(--typography-font-family) !important; font-weight: var(--typography-font-weight) !important; } .widget.widget--hero-image.widget--hero-image_standard .hero .hero__caption a.btn.btn--primary{ color: var(--color-brand-black); background-color: var(--color-brand-white); border-color: var(--color-brand-white); } .widget.widget--hero-image.widget--hero-image_standard .hero .hero__caption a.btn.btn--primary:hover, .widget.widget--hero-image.widget--hero-image_standard .hero .hero__caption a.btn.btn--primary:focus-within{ background-color: var(--color-background-hover-grey-darker); } @media only screen and (max-width: 48.063em){ div#main-content a.btn{ width: 100%; } } /* --- MAIN TITLES --- */ /* custom widgets */ .wYourRole h2.hero__title, /* TI native widget */ .widget--hero-image.widget--hero-image_standard .hero .hero__caption .hero__title, /* Terms and Conditions */ h1.h1.terms, /* detail page */ .course__detail__content h1.h2, /* microlearning */ h1.article-content__header{ font-size: var(--typography-platform-heading-XL-size); line-height: var(--typography-platform-heading-XL-line-height); font-weight: var(--typography-font-weight); } /*video*/ h1.article-content__header{ margin-bottom: 40px; } /* --- SECTION TITLES --- */ /* custom widgets*/h2.h2.widget__title, h2.h2.widget__title.support, .wCertification.hero.bgwhite .hero__caption h2.hero__title, .widget.widget--two-column.widget--two-column_standard h3, /* TI native widgets */ .widget.widget--featured-content.widget--featured-content_multi-carousel .widget__alt-title__container h3, .widget.widget--one-column.widget--one-column_standard .widget__alt-title__container h3, .widget.widget--two-column.widget--two-column_standard .widget__alt-title__container h3, .widget.widget--three-column.widget--three-column_standard .widget__alt-title__container h3, .widget.widget--featured-content.widget--featured-content_standard .widget__alt-title__container h3, .widget.widget--catalog.widget--catalog_standard .widget__alt-title__container h3, .widget.widget--recent-content.widget--recent-content_multi-carousel .widget__alt-title__container h3, .widget.widget--featured-content.widget--featured-content_standard h3.h2.widget__title, h3.h2.widget__title, .widget.widget--title.widget--title_standard h1.h2.widget__title, .widget.widget--featured-content.widget--featured-content_multi-carousel.widget--featured-contentmulti-carousel-no-cards h3.h2.widget__title, .widget.widget--featured-content.widget--featured-content_multi-carousel h3.h2.widget__title, .widget.widget--two-column.widget--two-column_standard.blackbg.qualification h3.h2.widget__title, .widget.widget--catalog.widget--catalog_standard h3.h2.widget__title, .widget.widget--one-column.widget--one-column_standard h4, .widget.widget--two-column.widget--two-column_standard.cta-thin h4, .widget.widget--featured-content.widget--featured-content_carousel .featured-content-carousel-item h4.featured-content-carousel-item__title, /*detail pages*/ .course__detail__container .collection__courses .center-ruled-title span span, /*microlearning pages*/ .widget.widget--topic-article-related.widget--topic-article-related_standard .article-content__related-items h3, h3.article-header__type{ font-size: var(--typography-platform-heading-L-size); line-height: var(--typography-platform-heading-L-line-height); font-weight: var(--typography-font-weight) ; margin: 20px 0 40px; color: var(--color-brand-black); } .widget.widget--dashboard-access.widget--dashboard-access_standard .dashboard-access__header span, /*detail pages*/ .course__detail__container .collection__courses .learning-path-detail-milestone-list h3, /*microlearnings*/ .widget.widget--topic-article-content.widget--topic-article-content_standard .article-sidebar h4, /*terms and conditions*/ .h3.terms{ font-size: var(--typography-platform-heading-M-size); font-weight: var(--typography-font-weight); color: var(--color-brand-black); } /* --- CARD TITLE --- */ h4.h4, .widget.widget--featured-content.widget--featured-content_standard li .catalog-grid-item__body .catalog-grid-item__title, li .featured-content-multi-carousel-item__body h4.featured-content-multi-carousel-item__title, .widget.widget--catalog.widget--catalog_standard .catalog-grid-item__body .catalog-grid-item__title, /*microlearning pages*/ .widget.widget--topic-article-related.widget--topic-article-related_standard .article-content__related-items .featured-content-default-grid li .catalog-grid-item__body .catalog-grid-item__title, /*detail pages*/ .course__detail__container .tab-title a span, .course__detail__container .collection__courses .learning-path-detail-milestone-list .learning-path-detail-milestone-item h4, .course__detail__container .collection__courses .learning-path-detail-milestone-list .learning-path-detail-milestone-item .learning-path-detail-milestone-item__content-type{ font-size: var(--typography-platform-heading-S-size); line-height: var(--typography-platform-heading-S-line-height); font-weight: var(--typography-font-weight); color: var(--color-brand-black); } /* --- PARAGRAPHS FONT SIZE --- */ /*my activity widget*/ .widget.widget--dashboard-access.widget--dashboard-access_standard .dashboard-access-list-item-expander__title, /*detail pages*/ .course__detail__container .collection__courses .learning-path-detail-milestone-list .learning-path-detail-milestone-item .learning-path-detail-milestone-item__content-type{ font-size: var(--typography-paragraph-font-size-XL); line-height: var(--typography-paragraph-line-height); font-weight: var(--typography-font-weight); } /*my activity widget*/ .widget.widget--dashboard-access.widget--dashboard-access_standard .dashboard-access-tab__label, /*detail pages*/ .course__detail__container .collection__courses .learning-path-detail-milestone-list .learning-path-detail-milestone-item .learning-path-detail-milestone-item__description{ font-size: var(--typography-paragraph-font-size-M); line-height: var(--typography-paragraph-line-height); font-weight: var(--typography-font-weight); } @media only screen and (min-width: 48.063em) and (max-width: 64em){ /*.widget:not(.widget--course-purchase.widget--course-purchase_standard, .widget--course-social.widget--course-social_standard, .widget--course-benefits.widget--course-benefits_standard, .widget--hero-image.widget--hero-image_standard, .widget--learning-path-purchase.widget--learning-path-purchase_standard, .widget--navbar.widget--navbar_standard, .widget--learning-path-content-hero.widget--learning-path-content-hero_title-text){ padding: 30px 32px 10px!important; }*/ .widget.widget--featured-content.widget--featured-content_standard, .widget.widget--featured-content.widget--featured-content_multi-carousel, .widget.widget--featured-content.widget--featured-content_multi-carousel.widget--featured-contentmulti-carousel-no-cards, .widget.widget--testimonial.widget--testimonial_standard, .widget.widget--one-column.widget--one-column_standard, .widget.widget--two-column.widget--two-column_standard{ padding: 30px 32px 10px!important; } /* MAIN TITLE */ .widget--hero-image.widget--hero-image_standard .hero .hero__caption .hero__title, .wYourRole h2.hero__title, /* Terms and Conditions */ h1.h1.terms{ font-size: var(--typography-platform-heading-XL-size); line-height: var(--typography-platform-heading-XL-line-height); font-weight: var(--typography-font-weight)!important; } /*video*/ h1.article-content__header{ margin-bottom: 24px; } /* SECTION TITLE */ /* custom widgets*/ h2.h2.widget__title, h2.h2.widget__title.support, .wCertification.hero.bgwhite .hero__caption h2.hero__title, .widget.widget--two-column.widget--two-column_standard h3, /* TI native widgets */ .widget.widget--featured-content.widget--featured-content_multi-carousel .widget__alt-title__container h3, .widget.widget--one-column.widget--one-column_standard .widget__alt-title__container h3, .widget.widget--two-column.widget--two-column_standard .widget__alt-title__container h3, .widget.widget--three-column.widget--three-column_standard .widget__alt-title__container h3, .widget.widget--featured-content.widget--featured-content_standard .widget__alt-title__container h3, .widget.widget--catalog.widget--catalog_standard .widget__alt-title__container h3, .widget.widget--recent-content.widget--recent-content_multi-carousel .widget__alt-title__container h3, .widget.widget--featured-content.widget--featured-content_standard h3.h2.widget__title, h3.h2.widget__title, .widget.widget--title.widget--title_standard h1.h2.widget__title, .widget.widget--featured-content.widget--featured-content_multi-carousel.widget--featured-contentmulti-carousel-no-cards h3.h2.widget__title, .widget.widget--featured-content.widget--featured-content_multi-carousel h3.h2.widget__title, .widget.widget--two-column.widget--two-column_standard.blackbg.qualification h3.h2.widget__title, .widget.widget--catalog.widget--catalog_standard h3.h2.widget__title, .widget.widget--one-column.widget--one-column_standard h4, .widget.widget--two-column.widget--two-column_standard.cta-thin h4, .widget.widget--featured-content.widget--featured-content_carousel .featured-content-carousel-item h4.featured-content-carousel-item__title, /*detail pages*/ .course__detail__content h1.h2, .course__detail__container .collection__courses .center-ruled-title span span, /*video*/ h1.article-content__header, /*microlearning pages*/ .widget.widget--topic-article-related.widget--topic-article-related_standard .article-content__related-items h3, h3.article-header__type{ font-size: var(--typography-platform-heading-L-size); line-height: var(--typography-platform-heading-L-line-height); font-weight: var(--typography-font-weight)!important; margin: 20px 0 40px; } /*detail pages*/ .course__detail__container .collection__courses .learning-path-detail-milestone-list h3, /*microlearnings*/ .widget.widget--topic-article-content.widget--topic-article-content_standard .article-sidebar h4, /*terms and conditions*/ .h3.terms{ font-size: var(--typography-platform-heading-M-size); font-weight: var(--typography-font-weight); } .widget.widget--featured-content.widget--featured-content_standard li .catalog-grid-item__body .catalog-grid-item__title, .widget.widget--featured-content.widget--featured-content_multi-carousel li .featured-content-multi-carousel-item__body h4.featured-content-multi-carousel-item__title, /*detail pages*/ .course__detail__container .tab-title a span, .course__detail__container .collection__courses .learning-path-detail-milestone-list .learning-path-detail-milestone-item h4, .course__detail__container .collection__courses .learning-path-detail-milestone-list .learning-path-detail-milestone-item .learning-path-detail-milestone-item__content-type{ font-size: var(--typography-platform-heading-S-size); line-height: var(--typography-platform-heading-S-line-height); font-weight: var(--typography-font-weight)!important; } } @media only screen and (max-width: 48.063em){ /* --- MAIN TITLE + SECTION TITLE MOBILE --- */ /* custom widgets */ .wYourRole h2.hero__title, h2.h2.widget__title, h2.h2.widget__title.support, .wCertification.hero.bgwhite .hero__caption h2.hero__title, .widget.widget--two-column.widget--two-column_standard h3, /* TI native widgets */ .widget--hero-image.widget--hero-image_standard .hero .hero__caption .hero__title, .widget.widget--featured-content.widget--featured-content_multi-carousel .widget__alt-title__container h3, .widget.widget--one-column.widget--one-column_standard .widget__alt-title__container h3, .widget.widget--two-column.widget--two-column_standard .widget__alt-title__container h3, .widget.widget--three-column.widget--three-column_standard .widget__alt-title__container h3, .widget.widget--featured-content.widget--featured-content_standard .widget__alt-title__container h3, .widget.widget--catalog.widget--catalog_standard .widget__alt-title__container h3, .widget.widget--recent-content.widget--recent-content_multi-carousel .widget__alt-title__container h3, .widget.widget--featured-content.widget--featured-content_standard h3.h2.widget__title, h3.h2.widget__title, .widget.widget--title.widget--title_standard h1.h2.widget__title, .widget.widget--featured-content.widget--featured-content_multi-carousel.widget--featured-contentmulti-carousel-no-cards h3.h2.widget__title, .widget.widget--featured-content.widget--featured-content_multi-carousel h3.h2.widget__title, .widget.widget--two-column.widget--two-column_standard.blackbg.qualification h3.h2.widget__title, .widget.widget--catalog.widget--catalog_standard h3.h2.widget__title, .widget.widget--one-column.widget--one-column_standard h4, .widget.widget--two-column.widget--two-column_standard.cta-thin h4, .widget.widget--featured-content.widget--featured-content_carousel .featured-content-carousel-item h4.featured-content-carousel-item__title, /*detail pages*/ .course__detail__content h1.h2, .course__detail__container .collection__courses .center-ruled-title span span, .course__detail__container .collection__courses .learning-path-detail-milestone-list h3, /* Terms and Conditions */ h1.h1.terms, /*video*/ h1.article-content__header, /*microlearning pages*/ .widget.widget--topic-article-related.widget--topic-article-related_standard .article-content__related-items h3, h3.article-header__type, .widget.widget--topic-article-content.widget--topic-article-content_standard .article-sidebar h4{ font-size: var(--typography-platform-heading-M-size); line-height: var(--typography-platform-heading-M-line-height); font-weight: var(--typography-font-weight); margin: 20px 0 40px; } .widget.widget--featured-content.widget--featured-content_standard li .catalog-grid-item__body .catalog-grid-item__title, .widget.widget--featured-content.widget--featured-content_multi-carousel li .featured-content-multi-carousel-item__body h4.featured-content-multi-carousel-item__title, /*detail pages*/ .course__detail__container .tab-title a span, .course__detail__container .collection__courses .learning-path-detail-milestone-list .learning-path-detail-milestone-item h4, .course__detail__container .collection__courses .learning-path-detail-milestone-list .learning-path-detail-milestone-item .learning-path-detail-milestone-item__content-type, /*terms and conditions*/ .h3.terms{ font-size: var(--typography-platform-heading-S-size); line-height: var(--typography-platform-heading-S-line-height); font-weight: var(--typography-font-weight)!important; } } /* ----- (TI CATALOG) CARDS STYLING ----- */ /* DELETE (REPEATED in next line) widget content > li > a > div .featured-content-multi-carousel-item { border: 1px solid; }*/ .catalog-grid-item, .featured-content-multi-carousel-item, .learning-path-detail-milestone-item{ background: var(--color-background-default-grey); border: 1px solid var(--color-background-hover-grey-lighter); border-radius: var(--card-border-radius); /*filter: unset !important; box-shadow: unset !important; will-change: unset !important;*/ } /*here hover*/ .catalog-grid-item:hover, a.catalog-item:focus, .featured-content-multi-carousel-item:hover, .featured-content-multi-carousel-item:focus, .learning-path-detail-milestone-item:hover, .learning-path-detail-milestone-item:focus-within, .learning-path-milestone-item:hover:not(.learning-path-milestone-item--secondary), .learning-path-milestone-item:focus-within:not(.learning-path-milestone-item--secondary){ background: var(--color-background-hover-grey-darker); border-color: var(--color-background-hover-grey-darker); /* transform: unset!important; filter: drop-shadow(16px 16px 0 #000000); transform: translate(-8px,-8px)*/ } .featured-content-multi-carousel-item .catalog-grid-item__asset-container, .catalog-grid-item__asset-container { background-color: var(--color-brand-white); border-bottom: none !important; } .widget.widget--featured-content.widget--featured-content_standard .catalog-grid-item { padding: 0; display: flex; } .widget.widget--featured-content.widget--featured-content_standard .row { margin: 0; width: 100%; } .widget.widget--featured-content.widget--featured-content_standard .row .column { float: none; padding-left: 0; padding-right: 0; width: 100%; display: flex; align-items: center; } /* Image */ .widget.widget--featured-content.widget--featured-content_standard .row .column .catalog-grid-item__asset-container { border-bottom: none; display: flex; align-items: center; justify-content: center; width: 100%; } .widget.widget--featured-content.widget--featured-content_standard .row .column .catalog-grid-item__asset-container .catalog-grid-item__asset { max-height: 150px; width: auto; } /* Description */ .widget.widget--featured-content.widget--featured-content_standard .row .column .catalog-grid-item__body, .widget.widget--topic-article-related.widget--topic-article-related_standard .article-content__related-items .featured-content-default-grid li .catalog-grid-item .catalog-grid-item__body { padding: 24px; } /* Description - Variation for 2 items + Ribbon */ .widget.widget--featured-content.widget--featured-content_standard .featured-content-block-grid.small-block-grid-1.medium-block-grid-2 .row .column .catalog-grid-item__body { padding: 40px 24px; } /* Description font size */ .catalog-grid-item__body .featured-content-item__authors{ font-size: var(--typography-paragraph-font-size-S); } .catalog-grid-item__body .catalog-grid-item__description{ font-size: var(--typography-paragraph-font-size-M)!important; } /* Starts */ .catalog-grid-item__stars span.stars i{ color: var(--color-brand-black)!important; font-size: var(--typography-paragraph-font-size-M)!important; } /* - RELATED ITEMS ( Video/Article pages ) - */ .widget.widget--topic-article-related.widget--topic-article-related_standard .article-content__related-items .catalog-grid-item .row, /*content*/.widget.widget--topic-article-related.widget--topic-article-related_standard .article-content__related-items .catalog-grid-item .catalog-grid-item__body{ margin: 0; height: 100%; display: flex; flex-direction: column; } .widget.widget--topic-article-related.widget--topic-article-related_standard .article-content__related-items .catalog-grid-item .row .column.medium-12{ float: none; padding-left: 0; padding-right: 0; } /*image*/ .widget.widget--topic-article-related.widget--topic-article-related_standard .article-content__related-items .catalog-grid-item .row .column.medium-12 .catalog-grid-item__asset-container{ display: flex; justify-content: center; } .widget.widget--topic-article-related.widget--topic-article-related_standard .article-content__related-items .catalog-grid-item .row .column.medium-12 .catalog-grid-item__asset-container .catalog-grid-item__asset{ max-height: 130px; width: auto; } /*content*/ .widget.widget--topic-article-related.widget--topic-article-related_standard .article-content__related-items .catalog-grid-item .row .column.medium-12:last-child, .widget.widget--topic-article-related.widget--topic-article-related_standard .article-content__related-items .catalog-grid-item .catalog-grid-item__body .catalog-grid-item__cta-container{ height: 100%!important; } /*description*/ .widget.widget--topic-article-related.widget--topic-article-related_standard .article-content__related-items .catalog-grid-item .catalog-grid-item__body .catalog-grid-item__description{ overflow: unset; } /*line*/ .widget.widget--topic-article-related.widget--topic-article-related_standard .article-content__related-items hr.hr__accent{ display: none; } /*button*/ .widget.widget--topic-article-related.widget--topic-article-related_standard .article-content__related-items .catalog-grid-item .catalog-grid-item__body .catalog-grid-item__cta-container{ display: flex; align-items: flex-end; } /*view details button*/ .widget.widget--topic-article-related.widget--topic-article-related_standard .article-content__related-items .featured-content-default-grid li .catalog-grid-item .catalog-grid-item__body .catalog-grid-item__cta-container span.btn.btn--link.btn--right.btn--primary{ width: 100%; padding: 15px!important; color: var(--color-brand-white); background-color: var(--color-brand-black)!important; font-size: var(--typography-paragraph-font-size-M); text-align: center; } .catalog-grid-item:hover .catalog-grid-item__title, .widget--featured-content .catalog-grid-item:hover .catalog-grid-item__description, .learning-path-detail-milestone-item:hover .learning-path-detail-milestone-item__title, .learning-path-detail-milestone-item:hover .learning-path-detail-milestone-item__content-type{ color: var(--color-brand-black)!important; } /* Completed course */ .catalog-grid-item__completed-container { background: #f5f6f6; opacity: .9!important; /*mix-blend-mode: normal; opacity: .8*/ } /* Arrows when multiple items per row */ .widget.widget--featured-content.widget--featured-content_multi-carousel button.btn { width: 36px; height: 64px; background-color: var(--color-background-default-grey) !important; border: 1px solid var(--color-background-hover-grey-lighter); justify-content: center; } .widget.widget--featured-content.widget--featured-content_multi-carousel button.btn:hover, .widget.widget--featured-content.widget--featured-content_multi-carousel button.btn:focus-within{ background-color: var(--color-background-hover-grey-lighter)!important; } .widget.widget--featured-content.widget--featured-content_multi-carousel button.btn i:before { width: 20px; } @media only screen and (max-width: 64em){ .widget.widget--featured-content.widget--featured-content_multi-carousel button.btn{ display: flex; } .widget.widget--featured-content.widget--featured-content_multi-carousel button.btn.featured-content-multi-carousel__nav-left{ left: -20px; } .widget.widget--featured-content.widget--featured-content_multi-carousel button.btn.featured-content-multi-carousel__nav-right{ right: -20px; } } /* SNK - KEEP */ /* KEEP widget content */ .featured-content-multi-carousel .featured-content-block-grid { display: flex } /* KEEP widget content > li > a */ .featured-content-multi-carousel .featured-content-block-grid .catalog-item, .featured-content-multi-carousel .featured-content-block-grid .featured-content-multi-carousel-item{ height: 100% } /* KEEP widget content */ .featured-content-multi-carousel .featured-content-block-grid>li { flex: 1 0 auto } /* ----- END cards styling ----- */ /* ----- DETAIL PAGES STYLING ----- */ /* - MAIN CONTENT - */ /*tabs ---- KEEP course__detail */ .course__detail__container li.tab-title a span { color: var(--color-paragraph-dark-grey); } .course__detail__container li.tab-title.active a span, .course__detail__container li.tab-title:hover a span { color: var(--color-brand-black); } .course__detail__container .row ul.tabs { border-color: transparent; } .course__detail__container li.tab-title.active a span{ border-color: var(--color-brand-black)!important; } .course__detail__content li.tab-title:after{ border-bottom: none!important; } /*title*/ .course__detail__content .learning-path-detail-milestone-list .learning-path-detail-milestone-item .row:first-child{ padding: 24px 24px 0 24px; } .course__detail__content .learning-path-detail-milestone-list .learning-path-detail-milestone-item .row:first-child .small-10.columns{ width: 100%; } /*image*/ .course__detail__content .learning-path-detail-milestone-list .learning-path-detail-milestone-item .row:nth-child(2) .medium-4.columns{ background-color: var(--color-brand-white); } /*type + language + duration*/ .course__detail__content .learning-path-detail-milestone-list .learning-path-detail-milestone-item .row:nth-child(2) .medium-8.columns .learning-path-detail-milestone-item__content-type{ display: flex; flex-wrap: wrap; align-items: center; gap: 8px; padding: 0 24px; } .course__detail__content .learning-path-detail-milestone-list .learning-path-detail-milestone-item .row:nth-child(2) .medium-8.columns .learning-path-detail-milestone-item__content-type h5, .course__detail__content .learning-path-detail-milestone-list .learning-path-detail-milestone-item .row:nth-child(2) .medium-8.columns .learning-path-detail-milestone-item__content-type .catalog-list-item__source{ margin-bottom: 0!important; font-weight: var(--typography-font-weight)!important; font-size: var(--typography-paragraph-font-size-XL); } .course__detail__content .learning-path-detail-milestone-list .learning-path-detail-milestone-item .row:nth-child(2) .medium-8.columns .learning-path-detail-milestone-item__description{ padding: 24px; } /*button*/ .course__detail__content .learning-path-detail-milestone-list .learning-path-detail-milestone-item .row:nth-child(2) .medium-8.columns a.learning-path-detail-milestone-item__cta{ margin: 24px; padding: 15px!important; width: calc(100% - 48px); color: var(--color-brand-white); background-color: var(--color-brand-black)!important; text-align: center; } .course__detail__content .learning-path-detail-milestone-list .learning-path-detail-milestone-item .row:nth-child(2) .medium-8.columns a.learning-path-detail-milestone-item__cta i{ display: none; } /*Syllabus*/ .tabs-content.tabs-content--syllabus ul.section__list{ margin: 0; } .tabs-content.tabs-content--syllabus ul.section__list li{ display: flex; } .tabs-content.tabs-content--syllabus ul.section__list li .section__list__index{ width: 40px; } .tabs-content.tabs-content--syllabus ul.section__list li .section__list__outline{ width: calc(100% - 40px); } .tabs-content.tabs-content--syllabus ul.section__list li .section__list__index span, .tabs-content.tabs-content--syllabus ul.section__list li .section__list__outline span{ font-weight: var(--typography-font-weight); font-size: var(--typography-platform-heading-S-size); line-height: var(--typography-platform-heading-S-line-height); } /* - SIDE BAR CONTENT - */ /* purchase section - enroll section*/ .course__detail__sidebar .widget.widget--course-purchase.widget--course-purchase_standard .panel{ background: transparent; padding: 0; } /*TT*/.course__detail__sidebar .widget.widget--learning-path-purchase.widget--learning-path-purchase_standard .enroll--learning-path .enroll__title, /*Course*/.course__detail__sidebar .widget.widget--course-purchase.widget--course-purchase_standard .panel label .h6.heading.heading--primary{ margin-bottom: 10px; font-weight: var(--typography-font-weight); font-size: var(--typography-paragraph-font-size-XL); line-height: var(--typography-paragraph-line-height); } /* KEEP Sidebar */ .course__detail__sidebar .widget.widget--course-purchase.widget--course-purchase_standard .panel label .h6.heading.heading--primary span{ font-size: var(--typography-platform-heading-S-size); line-height: var(--typography-platform-heading-S-line-height); } /*time*/ .course__detail__sidebar .widget.widget--learning-path-purchase.widget--learning-path-purchase_standard .enroll--learning-path .course__detail__runs{ font-size: var(--typography-paragraph-font-size-S); display: none; } .course__detail__sidebar .widget.widget--learning-path-purchase.widget--learning-path-purchase_standard .enroll--learning-path p{ margin: 28px 0 14px; } /*price*/ .course__detail__sidebar .widget.widget--learning-path-purchase.widget--learning-path-purchase_standard .enroll--learning-path .enroll__buy .enroll__price{ font-size: var(--typography-platform-heading-M-size); line-height: var(--typography-platform-heading-M-line-height); font-weight: var(--typography-font-weight); margin: 4px 0 14px; } /*button*/ .course__detail__sidebar .widget.widget--course-purchase.widget--course-purchase_standard a.btn.btn--primary.btn--alt.btn--expand, .course__detail__sidebar .widget.widget--learning-path-purchase.widget--learning-path-purchase_standard .enroll--learning-path .btn.btn--primary{ font-size: var(--typography-paragraph-font-size-M); } /* what's included - related content --- KEEP */ .widget--course-related.widget--course-related_standard .panel.panel--alt{ padding: 0; border: none; } .widget--course-benefits.widget--course-benefits_standard .course__includes span.h5.course__includes__title, .widget--course-related.widget--course-related_standard .panel.panel--alt .course__related__title{ margin: 0; padding: 12px 0; font-weight: var(--typography-font-weight); font-size: var(--typography-paragraph-font-size-XL); line-height: var(--typography-paragraph-line-height); color: var(--color-brand-black); background-color: var(--color-brand-white); border-bottom: 1px solid var(--color-background-hover-grey-darker); } .widget--course-benefits.widget--course-benefits_standard .course__includes hr{ display: none; } .widget--course-benefits.widget--course-benefits_standard .course__includes .course__includes__list li, .widget--course-related.widget--course-related_standard .course__related__list li{ margin: 0; padding: 10px 0; border-top: none; } /*whats included*/ .widget--course-benefits.widget--course-benefits_standard .course__includes .course__includes__list li{ display: flex; } .widget--course-benefits.widget--course-benefits_standard .course__includes .course__includes__list li i.icon--round{ margin-top: 0; padding-top: 0; display: flex; justify-content: center; align-items: center; } .widget--course-benefits.widget--course-benefits_standard .course__includes .course__includes__list li i.icon--round:before{ margin-left: 0; transform: unset; } .widget--course-benefits.widget--course-benefits_standard .course__includes .course__includes__list li span{ padding-left: 0; } .widget--course-related.widget--course-related_standard .course__related__list li a{ display: flex; align-items: center; } .widget--course-related.widget--course-related_standard .course__related__list li img{ margin: 0 15px 0 0; border: none; /*width: 70px;*/ } .widget--course-related.widget--course-related_standard .course__related__list li a p{ margin: 0; } /*social*/ .widget--course-social.widget--course-social_standard .course__detail__social.share__container{ margin-top: 40px; padding: 0; display: flex; flex-wrap: wrap; align-items: center; border: none; } .widget--course-social.widget--course-social_standard .course__detail__social.share__container .h6.heading.heading--alt{ margin: 0 20px 0 0; font-weight: var(--typography-font-weight); font-size: var(--typography-paragraph-font-size-XL); line-height: var(--typography-paragraph-line-height); } .widget--course-social.widget--course-social_standard .course__detail__social.share__container ul li a.btn.btn--social{ margin: 0 10px 0 0; } /*not logged in*/ .course__detail__sidebar .widget.widget--course-purchase.widget--course-purchase_standard .panel .enroll .email-capture .editor-content.indent-list{ margin-bottom: unset; } .course__detail__sidebar .widget.widget--course-purchase.widget--course-purchase_standard .panel .enroll .email-capture .editor-content.indent-list p{ margin-bottom: 10px!important; font-size: var(--typography-platform-heading-S-size)!important; line-height: var(--typography-platform-heading-S-line-height)!important; } .course__detail__sidebar .widget.widget--course-purchase.widget--course-purchase_standard .panel .enroll .email-capture .editor-content.indent-list p span{ font-size: var(--typography-paragraph-font-size-S)!important; line-height: var(--typography-paragraph-line-height); } .course__detail__sidebar .widget.widget--course-purchase.widget--course-purchase_standard .panel .enroll .email-capture .editor-content.indent-list p span strong{ font-size: var(--typography-paragraph-font-size-M)!important; font-weight: var(--typography-font-weight); } /*enroll button*/ .course__detail__sidebar .widget.widget--course-purchase.widget--course-purchase_standard .course__detail__enrolled{ border-color: var(--color-brand-black); background-color: var(--color-brand-black); } .course__detail__sidebar .widget.widget--course-purchase.widget--course-purchase_standard .course__detail__enrolled a{ color: var(--color-brand-white); font-size: var(--typography-paragraph-font-size-M); } .course__detail__sidebar .widget.widget--course-purchase.widget--course-purchase_standard .course__detail__enrolled:hover, .course__detail__sidebar .widget.widget--course-purchase.widget--course-purchase_standard .course__detail__enrolled:focus-within{ background-color: var(--color-brand-white); } .course__detail__sidebar .widget.widget--course-purchase.widget--course-purchase_standard .course__detail__enrolled:hover a, .course__detail__sidebar .widget.widget--course-purchase.widget--course-purchase_standard .course__detail__enrolled:focus-within a{ color: var(--color-brand-black); } /*events detail page - Master Views & Migrate Legacy Analyses - Classroom Winter*/ .layout__content--placeholder-for-classroom-winter-2025 .panel p:not(label p){ display: none; } .layout__content--placeholder-for-classroom-winter-2025 .panel ul li{ font-weight: var(--typography-font-weight); font-size: var(--typography-paragraph-font-size-M); line-height: var(--typography-paragraph-line-height); } .layout__content--placeholder-for-classroom-winter-2025 .panel select{ height: auto; padding-top: 12px; padding-bottom: 12px!important; background-color: var(--color-background-blue); border-color: var(--color-brand-blue); border-radius: var(--buttons-border-radius); font-size: var(--typography-paragraph-font-size-XL); text-wrap: wrap; } .layout__content--placeholder-for-classroom-winter-2025 .panel button{ color: var(--color-brand-black); background-color: var(--color-brand-white); border-color: var(--color-brand-black); font-size: var(--typography-paragraph-font-size-M)!important; } .layout__content--placeholder-for-classroom-winter-2025 .panel button:hover{ color: var(--color-brand-white)!important; background-color: var(--color-brand-black)!important; border-color: var(--color-brand-black)!important; } @media only screen and (min-width: 48.063em){ /*title*/ .course__detail__content .learning-path-detail-milestone-list .learning-path-detail-milestone-item .row:first-child{ margin-left: 40%; width: 60%; } /*image*/ .course__detail__content .learning-path-detail-milestone-list .learning-path-detail-milestone-item .row:nth-child(2) .medium-4.columns{ width: 40%; } /*description*/ .course__detail__content .learning-path-detail-milestone-list .learning-path-detail-milestone-item .row:nth-child(2) .medium-8.columns{ left: 40%; width: 60%; } } @media only screen and (max-width: 48.063em){ /*title*/ .course__detail__content .learning-path-detail-milestone-list .learning-path-detail-milestone-item .row:first-child{ margin-top: 160px; } /*title*/ .course__detail__content .learning-path-detail-milestone-list .learning-path-detail-milestone-item .row:first-child{ margin-left: 0; width: 100%; } /*image*/ .course__detail__content .learning-path-detail-milestone-list .learning-path-detail-milestone-item .row:nth-child(2) .medium-4.columns{ width: 100%; max-height: 156px; } /*description*/ .course__detail__content .learning-path-detail-milestone-list .learning-path-detail-milestone-item .row:nth-child(2) .medium-8.columns{ left: 0; width: 100%; } /*button*/ .course__detail__content .learning-path-detail-milestone-list .learning-path-detail-milestone-item .row:nth-child(2) .medium-8.columns a.learning-path-detail-milestone-item__cta{ width: calc(100% - 48px)!important; } /*social*/ .widget--course-social.widget--course-social_standard .course__detail__social.share__container ul li a.btn.btn--social{ width: 36px!important; } } /* --- END detail pages styling --- */ /* --- MICROLEARNING PAGE STYLING --- */ .widget.widget--topic-article-content.widget--topic-article-content_standard .row{ margin: 0; } .widget.widget--topic-article-content.widget--topic-article-content_standard .article-header{ display: grid; grid-template-columns: repeat(2, 1fr); } .widget.widget--topic-article-content.widget--topic-article-content_standard .article-header:before{ display: none; } .widget.widget--topic-article-content.widget--topic-article-content_standard .article-header .text-left, .widget.widget--topic-article-content.widget--topic-article-content_standard .article-header .text-right{ display: flex; align-items: center; } .widget.widget--topic-article-content.widget--topic-article-content_standard .article-header .text-right{ width: 100%; padding: 0; justify-content: flex-end; } /*hide SHARE & PRINT*/ a.btn--link.btn.btn--email, button.btn--link.btn.btn--print.hide-for-print{ display: none; } /*bookmark*/ button.bookmark-dropdown__button{ margin: 0; padding: 0 10px; position: unset; font-size: var(--typography-platform-heading-M-size); color: var(--color-paragraph-dark-grey)!important; } button.bookmark-dropdown__button i{ color: var(--color-paragraph-dark-grey)!important } button.bookmark-dropdown__button:hover, button.bookmark-dropdown__button:focus-within{ color: var(--color-brand-black)!important; background-color: var(--color-background-hover-grey-lighter); border-color: transparent; } .bookmark-dropdown__button:hover i{ color: var(--color-brand-black)!important; } /* KEEP Article header */ .bookmark-dropdown{ position: absolute; right: 0; z-index: 1; border-radius: var(--card-border-radius); font-size: var(--typography-paragraph-font-size-XL); box-shadow: none; -webkit-box-shadow: none; } /* KEEP Article header */ .bookmark-dropdown .bookmark-header{ padding: 6px 6px 6px 16px; align-items: center; font-family: var(--typography-font-family); font-weight: var(--typography-font-weight); color: var(--color-brand-black); background-color: var(--color-background-hover-grey-lighter); } /* KEEP Article header */ .bookmark-dropdown .bookmark-header .bookmark-close{ margin-right: 0; padding: 4px 10px; font-size: 35px; line-height: 1; color: var(--color-brand-black); } .bookmark-dropdown .bookmark-header .bookmark-close:hover, .bookmark-dropdown .bookmark-header .bookmark-close:focus-within{ background-color: var(--color-background-hover-grey-darker)!important; } /* KEEP Article header */ .bookmark-dropdown .form{ border: 1px solid var(--color-background-hover-grey-lighter); } /* KEEP Article header */ .bookmark-dropdown .form .bookmark-body{ padding: 12px 16px; } /* KEEP Article header */ .bookmark-dropdown .form label, .bookmark-dropdown .form label span{ font-family: var(--typography-font-family); font-size: var(--typography-paragraph-font-size-M); font-weight: var(--typography-font-weight); } /* KEEP Article header */ .bookmark-dropdown .form input, .bookmark-dropdown .form select{ padding: 8px 8.5px; font-family: var(--typography-font-family); border-radius: var(--buttons-border-radius); border-color: var(--color-background-hover-grey-darker); } /* KEEP Article header */ .bookmark-dropdown .form input:active, .bookmark-dropdown .form input:focus, .bookmark-dropdown .form select:active{ background-color: var(--color-background-grey); border-color: var(--color-brand-black); } /* KEEP Article header */ .bookmark-dropdown .form input{ height: auto; margin-bottom: 12px; color: var(--color-brand-black); font-weight: var(--typography-font-weight); font-size: var(--typography-paragraph-font-size-M); border: 1px solid; background-color: var(--color-brand-white); } /* KEEP Article header */ .bookmark-dropdown .form select{ margin-bottom: 16px; } /* KEEP Article header */ .bookmark-dropdown .form button{ margin:0; color: var(--color-brand-white); background-color: var(--color-brand-black); border: 1px solid var(--color-brand-black); } /* KEEP Article header */ .bookmark-dropdown .form button:hover, .bookmark-dropdown .form button:focus-within{ background-color: var(--color-background-hover-black); } /* KEEP Article header */ .bookmark-dropdown .form .text-right button{ margin-top: 10px; padding: 0 4px; color: var(--color-brand-black); border: none; border-bottom: 1px solid var(--color-brand-black); } /* KEEP Article header */ .bookmark-dropdown .form .text-right button:hover, .bookmark-dropdown .form .text-right button:focus-within{ background-color: var(--color-background-hover-grey-darker); } /* KEEP Article header */ /*line*/ .widget.widget--topic-article-content.widget--topic-article-content_standard .article-header hr.hr__accent{ grid-column: 1/3; } /* KEEP Microlearnings - Side menu (Rating) */ .widget.widget--topic-article-content.widget--topic-article-content_standard .article-sidebar{ padding: 0; } .widget.widget--topic-article-content.widget--topic-article-content_standard .article-sidebar .article-sidebar__rating{ font-size: var(--typography-paragraph-font-size-M); font-family: var(--typography-font-family); background-color: var(--color-background-default-grey); border: 1px solid var(--color-background-hover-grey-lighter); padding: 20px 0; } .widget.widget--topic-article-content.widget--topic-article-content_standard .article-sidebar .article-sidebar__rating span{ margin-bottom: 10px; } .widget.widget--topic-article-content.widget--topic-article-content_standard .article-sidebar .article-sidebar__rating span.stars{ margin-bottom: 0; } .widget.widget--topic-article-content.widget--topic-article-content_standard .article-sidebar .article-sidebar__rating .stars i, .widget.widget--topic-article-content.widget--topic-article-content_standard .article-sidebar .article-sidebar__rating .star-chooser label i{ color: var(--color-background-hover-black); } .widget.widget--topic-article-content.widget--topic-article-content_standard .article-sidebar .article-sidebar__rating button{ margin-top: 18px; color: var(--color-brand-white); background-color: var(--color-brand-black); border-color: var(--color-brand-black); font-size: var(--typography-paragraph-font-size-M); } .widget.widget--topic-article-content.widget--topic-article-content_standard .article-sidebar .article-sidebar__rating button:hover, .widget.widget--topic-article-content.widget--topic-article-content_standard .article-sidebar .article-sidebar__rating button:focus-within{ background-color: var(--color-background-hover-black); } .widget.widget--topic-article-content.widget--topic-article-content_standard .article-sidebar .article-sidebar__rating hr{ display: none; } /*downloads*/ .widget.widget--topic-article-content.widget--topic-article-content_standard .article-sidebar h4{ margin: 30px 0 14px; } .widget.widget--topic-article-content.widget--topic-article-content_standard .article-sidebar .panel.panel--alt.panel--article-sidebar{ padding: 0; border-color: var(--color-background-hover-grey-lighter); border-radius: var(--card-border-radius); background-color: var(--color-background-default-grey); } .widget.widget--topic-article-content.widget--topic-article-content_standard .article-sidebar .panel.panel--alt.panel--article-sidebar div.row.collapse{ display: flex; align-items: center; } .widget.widget--topic-article-content.widget--topic-article-content_standard .article-sidebar .panel.panel--alt.panel--article-sidebar div.row.collapse div{ padding: 10px; } .widget.widget--topic-article-content.widget--topic-article-content_standard .article-sidebar .panel.panel--alt.panel--article-sidebar div.row.collapse div.small-2{ width: unset; } .widget.widget--topic-article-content.widget--topic-article-content_standard .article-sidebar .panel.panel--alt.panel--article-sidebar div.row.collapse div.small-10{ width: 100%; background-color: var(--color-brand-white); } .widget.widget--topic-article-content.widget--topic-article-content_standard .article-sidebar .panel.panel--alt.panel--article-sidebar:hover, .widget.widget--topic-article-content.widget--topic-article-content_standard .article-sidebar .panel.panel--alt.panel--article-sidebar:focus-within{ border-color: var(--color-background-hover-grey-darker); background-color: var(--color-background-hover-grey-darker); } .widget.widget--topic-article-content.widget--topic-article-content_standard .article-sidebar .panel.panel--alt.panel--article-sidebar:hover i.article-sidebar__icon, .widget.widget--topic-article-content.widget--topic-article-content_standard .article-sidebar .panel.panel--alt.panel--article-sidebar:focus-within i.article-sidebar__icon{ color: var(--color-brand-black); } .widget.widget--topic-article-content.widget--topic-article-content_standard .article-sidebar .panel.panel--alt.panel--article-sidebar a.btn.btn--link{ font-size: var(--typography-paragraph-font-size-S); } @media only screen and (min-width: 64em){ .widget.widget--topic-article-content.widget--topic-article-content_standard .article-header{ grid-template-rows: 1fr 1.5fr; } .widget.widget--topic-article-content.widget--topic-article-content_standard .row .article-content{ padding-left: 80px; } } @media only screen and (max-width: 64em){ button.bookmark-dropdown__button.bookmark-plus.bookmark-article{ font-size: var(--typography-platform-heading-S-size); } .widget.widget--topic-article-content.widget--topic-article-content_standard .article-header{ grid-template-rows: 1fr .7fr; } } @media only screen and (max-width: 64em) and (min-width: 48.063em){ .widget.widget--topic-article-content.widget--topic-article-content_standard .row .article-content{ padding-left: 40px; } } @media only screen and (min-width: 48.063em){ .widget.widget--topic-article-content.widget--topic-article-content_standard .article-sidebar{ width: 270px; } .widget.widget--topic-article-content.widget--topic-article-content_standard .article-content{ width: calc(100% - 270px); } } @media only screen and (max-width: 48.063em){ .widget.widget--topic-article-content.widget--topic-article-content_standard .row .article-content{ padding-left: 0; } } .widget.widget--topic-article-content.widget--topic-article-content_standard .row .article-content{ padding-right: 0; } /* ----- END microlearning page styling ----- */ /* ----- COURSE PAGE STYLING ----- */ .course__container .learner__container{ max-width: 100%; margin: 0; } /* - Sidebar - */ /* SEARCHBAR */ .learner__container .learner__sidebar .learner__sidebar__search input{ padding: 10px 20px; background-color: var(--color-background-default-grey); border-radius: var(--buttons-border-radius); border: none; font-family: var(--typography-font-family); font-weight: var(--typography-font-weight); font-size: var(--typography-paragraph-font-size-M); line-height: var(--typography-paragraph-line-height); } .learner__container .learner__sidebar .learner__sidebar__search .learner__container__toggle.learner__container__toggle--small button{ font-size: var(--typography-paragraph-font-size-M); } .learner__container .learner__sidebar .layout-panel{ margin-top: 16px; } /* SECTIONS */ .learner__container .learner__sidebar .learner__sidebar__expandables li:not(.learner__sidebar-list li){ border-bottom: 1px solid var(--color-background-hover-grey-darker); } /*sidebar closed*/ .learner__container .learner__sidebar .learner__sidebar__expandables li .expandable-sidebar{ margin: 10px 0!important; padding: 20px!important; color: var(--color-paragraph-dark-grey)!important; background-color: transparent!important; } .learner__container .learner__sidebar .learner__sidebar__expandables li .expandable-sidebar:hover, .learner__container .learner__sidebar .learner__sidebar__expandables li .expandable-sidebar:focus-within{ color: var(--color-brand-black); background-color: var(--color-background-hover-grey-lighter)!important; } /*sidebar open*/ .learner__container .learner__sidebar .learner__sidebar__expandables li .expandable-sidebar.expandable-sidebar--toggled{ background-color: var(--color-background-default-grey)!important; } .learner__container .learner__sidebar .learner__sidebar__expandables li .expandable-sidebar .expandable-sidebar__toggle, .learner__container .learner__sidebar .learner__sidebar__expandables li .expandable-sidebar.expandable-sidebar--toggled{ border-bottom: none; } /*lessons list*/ .learner__container .learner__sidebar .learner__sidebar__expandables li:first-of-type .expandable-sidebar, .learner__container .learner__sidebar .learner__sidebar__expandables li:first-of-type .expandable-sidebar.expandable-sidebar--toggled{ margin-top: 0; } /*sidebar text*/ .learner__container .learner__sidebar .learner__sidebar__expandables .expandable-sidebar__content .learner__sidebar-list .syllabus__section-title, .learner__container .learner__sidebar .learner__sidebar__expandables .expandable-sidebar__content .learner__sidebar-list .syllabus__lesson--title .syllabus__lesson--title-text, .learner__container .learner__sidebar .learner__sidebar__expandables .expandable-sidebar__content .learner__sidebar-list .syllabus__topics .syllabus__topic--non-expandable-title-text{ font-family: var(--typography-font-family); font-weight: var(--typography-font-weight); line-height: var(--typography-paragraph-line-height); } /*sidebar section titles*/ .learner__container .learner__sidebar .learner__sidebar__expandables .expandable-sidebar__toggle, .learner__container .learner__sidebar .expandable-sidebar__buttons a{ font-weight: var(--typography-font-weight); font-size: var(--typography-platform-heading-S-size); line-height: var(--typography-platform-heading-S-line-height); } .learner__container .learner__sidebar .learner__sidebar__expandables button .expandable-sidebar__toggle, .learner__container .learner__sidebar .learner__sidebar__expandables .expandable-sidebar__content{ background-color: transparent; padding: 0; } /* LESSONS section */ .learner__container .learner__sidebar .learner__sidebar__expandables .expandable-sidebar__content{ margin: 20px 0 0 0; } /*lessons > section list*/ .learner__container .learner__sidebar .learner__sidebar__expandables .expandable-sidebar__content .learner__sidebar-list .learner__sidebar-inner-list{ margin-bottom: 24px; } /*lessons > section title*/ .learner__container .learner__sidebar .learner__sidebar__expandables .expandable-sidebar__content .learner__sidebar-list .syllabus__section-title{ font-size: var(--typography-paragraph-font-size-XL); margin: 0; } /*lessons > section > lesson*/ .learner__container .learner__sidebar .learner__sidebar__expandables .expandable-sidebar__content .learner__sidebar-list .syllabus__lesson-container.syllabus__lesson-container--titles{ margin: 10px 0; } .learner__container .learner__sidebar .learner__sidebar__expandables .expandable-sidebar__content .learner__sidebar-list .syllabus__lesson{ display: grid; grid-template-columns: .08fr 1fr; } /*lessons > section > lesson arrow*/ .learner__container .learner__sidebar .learner__sidebar__expandables .expandable-sidebar__content .learner__sidebar-list .syllabus__lesson .syllabus__lesson--expander{ grid-column: 1/2; } .learner__container .learner__sidebar .learner__sidebar__expandables .expandable-sidebar__content .learner__sidebar-list .syllabus__lesson .expander-triangle__container{ padding: 0; height: 24px; width: 24px; display: flex; align-items: center; } .learner__container .learner__sidebar .learner__sidebar__expandables .expandable-sidebar__content .learner__sidebar-list .syllabus__lesson .expander-triangle__container .expander-triangle__closed-down, .learner__container .learner__sidebar .learner__sidebar__expandables .expandable-sidebar__content .learner__sidebar-list .syllabus__lesson .expander-triangle__container .expander-triangle__closed-right{ margin: 0; border-top-width: 7px; border-bottom-width: 7px; border-left-width: 7px; border-right-width: 7px; } /*lessons > section > lesson content*/ .learner__container .learner__sidebar .learner__sidebar__expandables .expandable-sidebar__content .learner__sidebar-list .syllabus__lesson ul.syllabus__topics{ grid-column: 1/3; } /*lessons > section > lesson title*/ .learner__container .learner__sidebar .learner__sidebar__expandables .expandable-sidebar__content .learner__sidebar-list .syllabus__lesson .syllabus__lesson--title{ display: flex; flex-direction: row-reverse; justify-content: space-between; align-items: center; } .learner__container .learner__sidebar .learner__sidebar__expandables .expandable-sidebar__content .learner__sidebar-list .syllabus__lesson .syllabus__lesson--title.active, .learner__container .learner__sidebar .learner__sidebar__expandables .expandable-sidebar__content .learner__sidebar-list .syllabus__lesson .syllabus__lesson--title:hover{ background-color: transparent; } .learner__container .learner__sidebar .learner__sidebar__expandables .expandable-sidebar__content .learner__sidebar-list .syllabus__lesson .syllabus__lesson--title:after{ display: none; } /*lessons > section > lesson icon*/ .learner__container .learner__sidebar .learner__sidebar__expandables .expandable-sidebar__content .learner__sidebar-list .syllabus__lesson .syllabus__lesson--title .completed__indicator{ float: none; margin-left: 12px; } .learner__container .learner__sidebar .learner__sidebar__expandables .expandable-sidebar__content .learner__sidebar-list .syllabus__lesson .syllabus__lesson--title .completed__indicator i{ margin-right: 4px; padding: 1px; color: var(--color-brand-white); background-color: var(--color-brand-black); font-size: var(--typography-paragraph-font-size-M); } /*lessons > section > lesson > list page titles*/ .learner__container .learner__sidebar .learner__sidebar__expandables .expandable-sidebar__content .learner__sidebar-list .syllabus__topics{ margin: 0; } /*lessons > section > lesson > page title*/ .learner__container .learner__sidebar .learner__sidebar__expandables .expandable-sidebar__content .learner__sidebar-list .syllabus__topics .syllabus__topic{ padding: 6px 8px 6px 0!important; margin-left: 16px; } /*lessons > section > lesson > page title > align*/ .learner__container .learner__sidebar .learner__sidebar__expandables .expandable-sidebar__content .learner__sidebar-list .syllabus__topics .syllabus__topic.syllabus__topic--non-expandable .syllabus__topic--non-expandable-title.flex{ align-items: center; } /*lessons > section > lesson > page title > title*/ .learner__container .learner__sidebar .learner__sidebar__expandables .expandable-sidebar__content .learner__sidebar-list .syllabus__topics .syllabus__topic.syllabus__topic--non-expandable .syllabus__topic--non-expandable-title a{ width: 100%; padding-right: 16px; } /*lessons > section > lesson > page title > circle*/ .learner__container .learner__sidebar .learner__sidebar__expandables .expandable-sidebar__content .learner__sidebar-list .syllabus__topics .syllabus__topic i.icon-circle{ margin-left: 0; vertical-align: 0; height: 10px; width: 10px; border-radius: 100%; } /*lessons > section > lesson > page title (hover / selected)*/ .learner__container .learner__sidebar .learner__sidebar__expandables .expandable-sidebar__content .learner__sidebar-list .syllabus__topics .syllabus__topic:hover, .learner__container .learner__sidebar .learner__sidebar__expandables .expandable-sidebar__content .learner__sidebar-list .syllabus__topics .syllabus__topic:focus-within{ background-color: var(--color-background-hover-grey-darker); } /*lessons > section > lesson title + lessons > section > lesson > page title*/ .learner__container .learner__sidebar .learner__sidebar__expandables .expandable-sidebar__content .learner__sidebar-list .syllabus__lesson--title .syllabus__lesson--title-text, .learner__container .learner__sidebar .learner__sidebar__expandables .expandable-sidebar__content .learner__sidebar-list .syllabus__topics .syllabus__topic--non-expandable-title-text{ font-size: var(--typography-paragraph-font-size-M); } /*lessons > section > lesson > page title text(unselected)*/ .learner__container .learner__sidebar .learner__sidebar__expandables .expandable-sidebar__content .learner__sidebar-list .syllabus__topics .syllabus__topic .syllabus__topic--non-expandable-title-text{ color: var(--color-paragraph-dark-grey); } /*lessons > section > lesson > page title text (selected / hover)*/ .learner__container .learner__sidebar .learner__sidebar__expandables .expandable-sidebar__content .learner__sidebar-list .syllabus__topics .syllabus__topic:hover .syllabus__topic--non-expandable-title-text, .learner__container .learner__sidebar .learner__sidebar__expandables .expandable-sidebar__content .learner__sidebar-list .syllabus__topics .syllabus__topic:focus-within .syllabus__topic--non-expandable-title-text, .learner__container .learner__sidebar .learner__sidebar__expandables .expandable-sidebar__content .learner__sidebar-list .syllabus__topics .syllabus__topic.syllabus__topic--active .syllabus__topic--non-expandable-title-text{ color: var(--color-brand-black); } .learner__container .learner__sidebar .learner__sidebar__expandables .expandable-sidebar__content .learner__sidebar-list .syllabus__topics .syllabus__topic.syllabus__topic--active .syllabus__topic--non-expandable-title-text{ border-left: 2px solid var(--color-brand-black); } /* PROGRESS section */ /*completation bar*/ .learner__container .learner__sidebar .course-progress .table-row.collapse{ display: grid; align-items: center; justify-items: center; grid-template-columns: auto 1fr auto .1fr 1fr; } .learner__container .learner__sidebar .course-progress .table-row.collapse .stat.small-2.highlight{ grid-column: 3/4; margin-left: 0; } .learner__container .learner__sidebar .course-progress .table-row.collapse .description.small-6{ grid-column: 4/5; } .learner__container .learner__sidebar .course-progress .table-row.collapse .stat.small-2.highlight, .learner__container .learner__sidebar .course-progress .table-row.collapse .stat.small-2.highlight sup, .learner__container .learner__sidebar .course-progress .table-row.collapse .description.small-6{ font-size: var(--typography-paragraph-font-size-XL); font-weight: var(--typography-font-weight); } /*details*/ .learner__container .learner__sidebar .course-progress button.btn--link, .learner__container .learner__sidebar .course-progress .stat, .learner__container .learner__sidebar .course-progress .stat sup, .learner__container .learner__sidebar .course-progress .description{ font-size: var(--typography-paragraph-font-size-M); } /*notes*/ .learner__container .learner__sidebar .learner__sidebar__expandables li .expandable-sidebar .expandable-sidebar__toggle{ padding: 0; background-color: transparent; } /*support + log out buttons*/ .learner__container .learner__sidebar .expandable-sidebar__buttons{ padding: 20px; background-color: transparent; } .learner__container .learner__sidebar .expandable-sidebar__buttons a, .learner__container .learner__sidebar .expandable-sidebar__buttons div{ color: var(--color-paragraph-dark-grey); } .learner__container .learner__sidebar .expandable-sidebar__buttons a:hover, .learner__container .learner__sidebar .expandable-sidebar__buttons a:focus-within, .learner__container .learner__sidebar .expandable-sidebar__buttons div:hover, .learner__container .learner__sidebar .expandable-sidebar__buttons div:focus-within{ color: var(--color-brand-black); background-color: var(--color-background-hover-grey-lighter); } /* - end side bar - */ /* - Main content - */ /*navigation bar*/ .learner__container.learner__container--toggled .learner__content{ padding-left: 50px!important; } .learner__container .learner__content .layout-panel{ margin: 0!important; } .learner__container .learner__content .layout-panel .row .columns, .learner__container .learner__content .layout-panel .row .section-progress-bar{ padding: 0; } /* course page - lesson title*/ .learner__container .learner__content .layout-panel .learner-section__title__container h3 .learner-section__title{ font-weight: var(--typography-font-weight); font-size: var(--typography-platform-heading-S-size)!important; line-height: var(--typography-platform-heading-S-line-height); } /* course page - section title*/ .learner__container .learner__content .layout-panel .learner-section__title__container h3 .learner-lesson__title{ font-weight: var(--typography-font-weight); font-size: var(--typography-platform-heading-L-size)!important; line-height: var(--typography-platform-heading-L-line-height); } /*buttons*/ .learner__container .learner__content .layout-panel .row .directional__nav{ display: grid; grid-template-columns: repeat(2, 1fr); } .learner__container .learner__content .layout-panel .row .directional__nav .directional__nav__button__container{ display: flex; } .learner__container .learner__content .layout-panel .row .directional__nav .directional__nav__button__container.directional__nav__button__container--next{ justify-content: flex-end; } .learner__container .learner__content .layout-panel .row .directional__nav a{ padding: 24px 0 0; } .learner__container .learner__content .layout-panel .row .directional__nav a div{ display: flex; align-items: center; } .learner__container .learner__content .layout-panel .row .directional__nav .directional__nav__button__container--next a div{ flex-direction: row-reverse; } .learner__container .learner__content .layout-panel .row .directional__nav a div .directional__nav__button{ background-color: var(--color-background-default-grey); border: none; } .learner__container .learner__content .layout-panel .row .directional__nav a:hover .directional__nav__button i:before{ background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg width='13' height='24' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M12.645 11.96 1.557 23.048l-.998-.998 10.088-10.088L.56 1.87l.998-.999L12.645 11.96Z' fill='%23000'/%3E%3C/svg%3E"); } .learner__container .learner__content .layout-panel .row .directional__nav a:hover .directional__nav__button, .learner__container .learner__content .layout-panel .row .directional__nav a:focus-within .directional__nav__button{ background-color: var(--color-background-hover-grey-lighter); } /*course container*/ .learner__container .learner__content .layout-panel .row .topic__container{ margin-bottom: 0; padding-bottom: 0; border-bottom: none; } .learner__container .learner__content .layout-panel .row .topic__container .topic__content{ padding: 0; } .learner__container .learner__content .layout-panel .row .topic__edit .button-group{ padding-bottom: 0; } /* - end main content -*/ /* ----- END course page styling ----- */ /* ----- OTHER ADJUSTMENTS ----- */ /* IMAGE LIMIT IN TWO COLUMNS - news page*/ .widget.widget--two-column.widget--two-column_standard p img{ max-height: 250px; width: auto; } /* END image limit in two columns */ /* ----- END other adjustments ----- */ /* ----- LINKS ----- */ .topic__container.topic__container--no-bottom-margin a:not(.extSource a, .btn), .topic__container .topic__content.topic__content--full-width table a, /* platform */ .home a:not( /*platform*/ header a, .global-nav__container a, .header.header--dashboard a, footer a, .btn, .featured-content-multi-carousel a, a.catalog-item, .roles a, .role-item a, /*persona pages -> */.process-nav a, .process-nav-short a, /*landing pages*/ .landing-container a, .landing-container a p, /*courses*/ .directional__nav a, ul.learner__sidebar__expandables a, .expandable-sidebar__buttons a, /*SU*/ .su__viewed-results.su__text-truncate.su__text_align.su__mt-025 a, a.su__text-decoration.su__text-black.su__font-14.su__font-bold.su_continue-btn, .su__suggested-results-container a), /* courses */ .learn.dashboard a:not( /*platform*/ header a, .global-nav__container a, .header.header--dashboard a, footer a, .btn, .featured-content-multi-carousel a, a.catalog-item, .roles a, /*courses*/ .directional__nav a, ul.learner__sidebar__expandables a, .expandable-sidebar__buttons a, /*backend*/ .manager a){ text-decoration: underline; color: var(--color-brand-blue); border: 2px solid transparent; padding:1px; } .topic__container.topic__container--no-bottom-margin/*.topic__container__text*/ a:not(.extSource a, .btn):hover, .topic__container .topic__content.topic__content--full-width table a:hover, .home a:hover:not( /*platform*/ header a, .global-nav__container a, .header.header--dashboard a, footer a, .btn, .featured-content-multi-carousel a, a.catalog-item, .roles a, /*courses*/ .directional__nav a, ul.learner__sidebar__expandables a, .expandable-sidebar__buttons a, /*SU*/.su__viewed-results.su__text-truncate.su__text_align.su__mt-025 a, .su__mr-2.su__rtlmr-0.su__rtlml-2.su__thumbnail_align a, a.su__text-decoration.su__text-black.su__font-14.su__font-bold.su_continue-btn, .su__suggested-results-container a), .learn.dashboard a:hover:not( /*platform*/ header a, .global-nav__container a, .header.header--dashboard a, footer a, .btn, .featured-content-multi-carousel a, a.catalog-item, .roles a, /*courses*/ .directional__nav a, ul.learner__sidebar__expandables a, .expandable-sidebar__buttons a, /*backend*/ .manager a){ border-radius: 4px; border-color: var(--color-brand-blue); } /* Header in courses */ body.course .relative.header.header--student.header--learner{ height: 42px; padding: 10px 24px; } .header .company__beta-logo { max-height: unset; max-width: unset; height: 100%; } body.course .header .company__beta-logo .company-logo__container { margin-top: 0; margin-left: 0!important; height: 100%; } .course__container .header .company__beta-logo .company-logo__container img { max-height: unset; height: 100%; width: auto; } @media only screen and (min-width: 64.063em){ body.course .relative.header.header--student.header--learner{ height: 60px; padding: 14px 100px!important; } } @media only screen and (min-width: 48em) and (max-width: 64.063em){ body.course .relative.header.header--student.header--learner{ height: 60px; padding: 14px 32px; } } /* Header Student (video page) */ body.learn.video.index .header--student { height: 42px !important; padding: 10px 24px; position: sticky; top: 0; z-index: 1000; display: flex; align-items: center; justify-content: space-between; } body.learn.video.index .header--student .header__inner a.logo { max-height: unset; max-width: unset; height: 100%; } body.learn.video.index .header--student .language-wrap { position: relative; z-index: 10000; } /* Breakpoints */ @media only screen and (min-width: 64.063em){ body.learn.video.index .header--student { height: 60px !important; padding: 14px 100px !important; } } @media only screen and (min-width: 48em) and (max-width: 64.063em){ body.learn.video.index .header--student { height: 60px !important; padding: 14px 32px !important; } } /* --- Headings --- */ /* Title margin */ .learner-section__title__container h3:not(summary h3) /*:not(.accordion-label2 h3, body.learn .editor-content .topic__container.topic__container--no-bottom-margin.topic__container__text h3, body.learn .editor-content h3), .h2.widget__title*/{ margin: 0 0 18px; } /* Courses' titles (headings) sizes */ .learner-section__title{ font-size: 22px; margin-bottom: 8px; } .learner-lesson__title{ font-size: 36px; } .learner__content .topic__container { padding-top: 24px; } /* Titles inside COURSES - TO BE DELETED, no class needed */ h1.courseTitle{ font-size: 34px!important; line-height: 44px; } h2.courseTitle{ font-size: 30px!important; line-height: 38px; } h3.courseTitle{ font-size: 26px!important; line-height: 38px; } h4.courseTitle{ font-size: 22px!important; } /* NEW - Headings inside COURSES (TI native button )*/ body.learn .editor-content h1, .redactor-styles h1{ font-size: 34px; line-height: 51px; margin-bottom: 30px; } body.learn .editor-content h2, .redactor-styles h2{ font-size: 30px; line-height: 45px; margin: 28px 0 18px 0; } body.learn .editor-content h3:not(label h3), .redactor-styles h3:not(label h3){ font-size: 26px; line-height: 39px; margin: 28px 0 16px 0; } body.learn .editor-content h4, .redactor-styles h4{ font-size: 22px; line-height: 33px; margin: 28px 0 16px 0; } body.learn .editor-content h5:not(.infobox-title h5), .redactor-styles h5:not(.infobox-title h5){ font-size: 20px; line-height: 30px; margin: 28px 0 16px 0; } body.learn .editor-content h6, .redactor-styles h6{ margin: 28px 0 16px 0; } .redactor-styles h6{ font-size: 18px; letter-spacing: unset; text-transform: unset; } /* Video titles --- REMOVE h1.article-content__header { font-size: 1.6em; line-height: 1.4em; padding-bottom: 16px; } @media only screen and (min-width: 48.063em) and (max-width: 64em){ h1.article-content__header { font-size: 2em; } } @media only screen and (min-width: 64em) and (max-width: 77.063em){ h1.article-content__header { font-size: 2.2em; } } @media only screen and (min-width: 77.063em){ h1.article-content__header { font-size: 2.6em; } }*/ /* --- END headings --- */ /* NAV bar */ .widget--navbar.widget--navbar_standard{ background-color: transparent; } body .company-logo__container{ margin-top: 0!important; } /* SNK - NAV bar */ .widget--navbar { background-color: #000; left: 253px; padding: 0!important; position: absolute; top: 24px; width: auto; z-index: 1000 } @media only screen and (max-width: 48em) { .widget--navbar { left: auto; right: 92px; top: 10px } } /* */ .article-sidebar__custom-fields { display: none; } .course-group .email-capture:before { content: ""; font-size:16px; /*font-weight:800;*/} .course-group .enroll__title, .course-group .panel p small, .course-group .email-capture .form-control, .course-group .email-capture button, .course-group .email-capture .disabled { display:none; } .account #account-section-1 { display:none; } /* No transcript in Profie */ #dashboard-header-dropdown>li:nth-of-type(3) a[href^="/learn/transcript"] { display: none!important; } /* SNK- No transcript in Profie */ #dashboard-header-dropdown>li:nth-of-type(2) a[href^="/learn/account?tab=dashboard.account"] { display: none!important } /* - CSS for Team Creation Button - */ .no-click { pointer-events: none; } .elementToFadeInAndOut { opacity: .7; animation: flashfade 3s linear infinite; } @keyframes flashfade { 0%,100% { opacity: .1 } 50% { opacity: .7 } } .pers-training { background-color: #E5E9FF; border: 1px solid #0029FF; width: 90%; margin: 30px auto; border-radius: 0.3rem; padding: 20px 40px;} /* - CSS for Team Creation Button END - */ /* Quiz Test styling */ .results__controls .btn { background-color: var(--accent-color); border-color: var(--accent-color); color: var(--accent-contrast-color); border-radius: 23px; padding: 12px 34px; font-family: Inter; font-size: 15px; /* font-weight: 600;*/ line-height: 20px; } .results__controls .btn:hover { background-color: #ffffff; border-color: var(--accent-color); color: var(--accent-color); border-radius: 23px; padding: 12px 34px; } .results__controls .btn.btn--success { border-radius: 23px; padding: 12px 34px; font-family: Inter; font-size: 15px; font-weight: 600; line-height: 20px; background-color: #357635; border-color: #357635; color: #ffffff; } .results__controls .btn.btn--success:hover { background: #43a144; border-color: #43a144; color: #ffffff; } .results__question-time .icon-clock:before { font-size: 1.5rem; color: #000000; opacity: .5; } .results__question-time { color: #000000; font-size: 1.1rem; text-align: center; opacity: .8; } .question-results__grade .progress.colorized { height: .5rem; } .question-results__grade .progress.colorized .meter { background: green; } div.chart-bar.chart-bar--answered { display: none; } .results__chart-labels span:nth-child(3) { display: none; } /* FOR UNANSWERED IF NEEDED .results__chart-labels span:nth-child(5) { display: none; } span.label-circle.label-circle--unanswered { display: none; } span.label-circle.label-circle--unanswered + span { display: none; } div.chart-bar.chart-bar--unanswered { display: none; } */ .results__question-labels li:nth-child(2) { display: none; } .results__question-labels .label-circle.label-circle--correct { background-color: green; } .results__question-labels .label-circle.label-circle--incorrect { background-color: #ce3532; } div.chart-bar.chart-bar--incorrect { background-color: #ce3532; } .results__question-labels ul li:nth-child(1) { visibility: hidden; } .results__question-labels .label-circle.label-circle--total { background-color: #000000; visibility: visible; } span.label-circle.label-circle--total ~ span { visibility: visible; } div.chart-bar.chart-bar--total { background-color: #000000; height: 100%; } div.chart-bar.chart-bar--correct { background-color: green; } h3.results__title { /*font-weight: 600;*/ line-height: 1rem; } div.question-results__grade > span { text-transform: lowercase; font-size: .9rem; } .question-results__grade { text-align: center; } .results__question-pool { height: 496px; } /* Quiz Test styling END */ /* highlighting the active page in courses */ .syllabus__topic.syllabus__topic--active a span.syllabus__topic--non-expandable-title-text{ /* font-weight:600; */ padding-right: 0.4em; border-left: 1px solid #000000; } /* highlighting the active page in courses END */ /* remove archived content from Learner activity widget */ .dashboard-access-tabs .dashboard-access-tab--archived { display: none!important; } /* remove certifications content from Learner activity widget */ .dashboard-access-tabs .dashboard-access-tab--certificate { display: none; } /* SNK - .dashboard-access-tabs */ .dashboard-access,.dashboard-access-list-item,.dashboard-access-tabs { border: none } .dashboard-access section,.dashboard-access-tabs,.dashboard-access__header { filter: drop-shadow(0 0 0 #000000); transition: filter .1s ease,transform .1s ease; will-change: filter,transform } .dashboard-access__header.dashboard-access__header--expanded,.dashboard-access__header.dashboard-access__header--expanded~.dashboard-access-tabs,.dashboard-access__header.dashboard-access__header--expanded~section { filter: drop-shadow(16px 16px 0 #000000); transform: translate(-8px,-8px) } .dashboard-access section,.dashboard-access-tabs { border-left: 1px solid #000; border-right: 1px solid #000 } .dashboard-access-tabs { background: #f5f6f6 } /* END - SNK - .dashboard-access-tabs */ /* pointer cursor for FAQs */ details { cursor: pointer; } /* adjusting the menu for indented pages */ .learner__sidebar-inner-list li { /* font-family: Inter;*/ font-size: 14px; } button.syllabus__topic--expander .expander-triangle__container { padding: .5em .3em .4em 0; } /* SNK - .learner__sidebar-inner-list */ .learner__container .learner__sidebar-inner-list { border: none; padding: 0 } .learner__container .learner__sidebar-inner-list li { color: #000; padding-bottom: 8px; padding-right: 0; padding-top: 0 } /* END - SNK - .learner__sidebar-inner-list */ /* hide testimonial bar at end of courses thoroughly */ .sidebar__container--right .sidebar__testimonial { display: none !important; position: absolute; overflow: hidden; clip: rect(0 0 0 0); height: 1px; width: 1px; margin: -1px; padding: 0; border: 0; } /* SNK .sidebar__testimonial */ .sidebar__testimonial { display: none } /* faq arrows */ /*test on faq arrows */ .losfaqs details[open] h6::before { transform: rotate(90deg); color:#0029FF; font-size:1.2rem; } .losfaqs details h6::before { content: "▶"; display: inline-block; transform: rotate(0); transition: .40s transform ease; margin-right:.4rem; } /* .losfaqs details[open] summary ~ * { animation: sweepfaqs .3s ease-in-out forwards; } */ .losfaqs details[open] :is(p,ol,ul,li,span) { animation: sweepfaqs .3s ease-in-out forwards; } @keyframes sweepfaqs { 0% {opacity: 0; margin-left: -5px} 100% {opacity: 1; margin-left: 1.6rem} } .losfaqs p.muted { font-size: 22px; font-weight: 700; line-height: 38px; font-family: var(--alt-font); } .widget.widget--title.widget--title_standard.faq-page{ padding-bottom: 10px; } .widget.widget--two-column.widget--two-column_standard.faq-page{ padding-top: 0; } div.widget--two-column.widget--two-column_standard.losfaqs { padding: 30px 100px; } /* TT banner adjustment */ @media only screen and (min-width: 1400px) { .widget--learning-path-content-hero div.learning-content-hero.aspect-\[3\/1\] { aspect-ratio: /*5/1*/ unset; height: 400px; } } @media only screen and (min-width: 1100px) and (max-width: 1399px) { .widget--learning-path-content-hero div.learning-content-hero.aspect-\[3\/1\] { aspect-ratio: /*4/1*/ unset; height: 400px; } } @media only screen and (min-width: 1400px) { .widget--learning-path-content-hero div.learning-content-hero.aspect-\[2\/1\] { aspect-ratio: 5/1; } } @media only screen and (min-width: 1100px) and (max-width: 1399px) { .widget--learning-path-content-hero div.learning-content-hero.aspect-\[2\/1\] { aspect-ratio: 4/1; } } /* TT hide non-displayed image */ .widget--learning-path-content-hero div.learning-content-hero picture { display:none; } /* Course Authors (Languages) on Catalog Tiles*/ p.featured-content-item__authors::before { background: url(https://d3i9g4671ronu3.cloudfront.net/course-uploads/f86bfb1e-f628-483b-9811-046e663bd680/fcaydjbmx1ag-image.png) no-repeat; content: ''; display: inline-block; height: 25px; width: 25px; vertical-align: middle; margin-right: 5px; } p.featured-content-item__authors { margin-bottom: 1rem; } /* Languages on Detail Page tabs*/ p.language-detail-page::before { background: url(https://d3i9g4671ronu3.cloudfront.net/course-uploads/f86bfb1e-f628-483b-9811-046e663bd680/fcaydjbmx1ag-image.png) no-repeat; content: ''; display: inline-block; height: 25px; width: 25px; vertical-align: middle; margin-right: 8px; } .course__detail__content div:last-child.row .tabs-content { padding-top: 32px; } /* SNK - .course__detail__content div:last-child.row .tabs-content */ .course__detail__content div:last-child.row .tabs-content { border: none; margin-bottom: 32px; padding-top: 48px } @media only screen and (max-width: 48em) { .course__detail__content div:last-child.row .tabs-content { padding-top:24px } } .course__detail__content div:last-child.row .tabs-content>.content { padding: 0 } /* END SNK */ /* authors (languages) on TT tiles */ @media only screen and (min-width: 40.063em) { .learning-path-milestone-item div.learning-path-milestone-item__info, .learning-path-milestone-item div.learning-path-milestone-item__info strong { /*font-weight: 400!important;*/ color: #4b4444; font-size: .9rem; } } .learning-path-milestone-item p.learning-path-milestone-item__source { font-size: .85rem; } /* ----- Activity Widget spacing ----- */ @media only screen and (min-width: 64.063em) { .learn.dashboard div.widget--dashboard-access.widget--dashboard-access_standard { padding: 40px 100px 10px 100px; } } /* ----- NAVIGATION BAR ----- */ .global-nav__container .nav.nav--global-links>a:hover{ text-decoration: underline; /*font-weight: 600;*/ } /*@media only screen and (max-width: 48em) { .global-nav__container{display:block!important; overflow:auto; height: auto!important; padding: 5px 24px 5px 24px;} .global-nav__container .nav.nav--global-links{display:inline-flex; white-space: nowrap;} .global-nav__container::-webkit-scrollbar{display: none;} }*/ /* SNK - .global-nav__container and .top-bar.expanded section.top-bar-section*/ @media only screen and (min-width: 64.063em) { .container,.global-nav__container { max-width:100% } } .nav--global-links,body { background-color: #fff } @media (min-width: 640px) { .container { max-width:none } } .global-nav__container { display: flex; height: 46px; padding-left: 24px } @media only screen and (min-width: 48.063em) and (max-width:64em) { .global-nav__container { padding-left:32px } } @media only screen and (min-width: 64.063em) { .global-nav__container { padding-left:100px } } .global-nav__container { display: flex; height: 46px; padding-left: 24px } @media only screen and (min-width: 48.063em) and (max-width:64em) { .global-nav__container { padding-left:32px } } @media only screen and (min-width: 64.063em) { .global-nav__container { padding-left:100px } } .global-nav__container .nav.nav--global-links { align-self: center } .global-nav__container .nav.nav--global-links>a { color: #000; font-family: Inter; font-size: 17px; margin-right: 24px; padding: 0 } @media only screen and (max-width: 767px) { .global-nav__container { display:none } } @media only screen and (min-width: 64.063em) { .container,.global-nav__container { max-width:100% } } @media only screen and (max-width: 48em) { .header.header--microsite { padding:22px 24px } .header.header--microsite .company-logo__container { padding: 0 } .global-nav__container { display: none } .top-bar { float: right; margin-top: 8px; width: 30px } .top-bar .btn--bare:not(#cart-button) { padding: 0!important; width: 30px } .top-bar .btn--bare span [id^=i18n-] { display: none } .top-bar .toggle-topbar.menu-icon button span:after { box-shadow: 0 0 0 1px #fff,0 9px 0 1px #fff,0 18px 0 1px #fff; content: ""; display: block; height: 0; margin-top: -7px; position: absolute; right: 2px!important; right: 1rem; top: 50%; width: 25px } .top-bar.expanded .title-area { background: transparent } .top-bar.expanded .toggle-topbar.menu-icon button span:after { background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg width='24' height='25' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath fill-rule='evenodd' clip-rule='evenodd' d='m12.081 13.996 9.586 9.585 1.414-1.414-9.586-9.586 9.586-9.585-1.414-1.414-9.586 9.585L2.414 1.5 1 2.915l9.667 9.666L1 22.248l1.414 1.415 9.667-9.667z' fill='%23fff'/%3E%3C/svg%3E"); background-repeat: no-repeat; box-shadow: none; height: 25px; margin-top: -10px; width: 25px } .top-bar.expanded section.top-bar-section { background-color: #fff; height: 100%; left: 0; padding: 0 8px; position: fixed; top: 80px; width: 100%; z-index: 99 } .top-bar.expanded section.top-bar-section ul li { align-items: center; background: #fff!important; border-bottom: 1px solid #e5e5e5; display: flex; height: 67px; padding: 0 0 0 16px } .top-bar.expanded section.top-bar-section ul li:hover { border-bottom: 1px solid var(--link-color) } .top-bar.expanded section.top-bar-section ul li:hover>a { color: var(--link-color)!important } .top-bar.expanded section.top-bar-section ul li:hover>a:after { background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg width='20' height='20' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath fill-rule='evenodd' clip-rule='evenodd' d='M9.5 6.001 3 12.473l1.534 1.528L9.5 9.031 14.466 14 16 12.474 9.5 6z' fill='%230029FF'/%3E%3C/svg%3E"); background-repeat: no-repeat; top: 5px; transform: rotate(180deg) } .top-bar.expanded section.top-bar-section ul li.has-dropdown.open { border-bottom: 1px solid var(--link-color) } .top-bar.expanded section.top-bar-section ul li.has-dropdown.open>a { color: var(--link-color)!important } .top-bar.expanded section.top-bar-section ul li.has-dropdown.open:hover>a:after,.top-bar.expanded section.top-bar-section ul li.has-dropdown.open>a:after { background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg width='20' height='20' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath fill-rule='evenodd' clip-rule='evenodd' d='M9.5 6.001 3 12.473l1.534 1.528L9.5 9.031 14.466 14 16 12.474 9.5 6z' fill='%230029FF'/%3E%3C/svg%3E"); background-repeat: no-repeat } .top-bar.expanded section.top-bar-section ul li.has-dropdown.open:hover>a:after { top: 0; transform: unset } .top-bar.expanded section.top-bar-section ul ul.dropdown { background-color: #fff; display: none; left: 0; padding: 0 8px; position: relative!important; width: 100%; z-index: 9999 } .top-bar.expanded section.top-bar-section ul ul.dropdown.active { display: block; height: auto; padding: 0 } .top-bar.expanded section.top-bar-section ul ul.dropdown.active li { padding-left: 32px } .top-bar.expanded section.top-bar-section ul ul.dropdown.active .title.back { display: none } .top-bar.expanded section.top-bar-section ul li>a,.top-bar.expanded section.top-bar-section ul li>button { background: #fff!important; color: #000!important; display: inline-block; font-size: 17px; line-height: 64px; padding: 0 } .top-bar.expanded section.top-bar-section .has-dropdown>a:after { background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg width='20' height='20' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath fill-rule='evenodd' clip-rule='evenodd' d='M10.5 14.001 17 7.528l-1.534-1.527-4.966 4.97-4.966-4.97L4 7.528l6.5 6.473z' fill='%23000'/%3E%3C/svg%3E"); background-repeat: no-repeat; margin-left: 12px; margin-right: 0; position: relative; top: 0 } .top-bar.expanded section.top-bar-section ul>li:not(:first-of-type) { margin-left: 0 } } /* ----- END SNK top-bar and nav-bar & navigation bar ----- */ /* --- Hided elements --- */ /* SOURCE in videos */ div.article-content__info{display: none!important;} /* Hide SHARE */ a.ember-view.btn--link.btn--right-margin.btn.btn--email{display: none!important;} /* --- END hided elements --- */ /* ----- Responsive enhancements ----- */ /* NAVIGATION BAR - MOBILE DROPDOWN */ @media only screen and (max-width: 48em){ section.top-bar-section{height: calc(100% - 80px)!important;z-index: 3!important;overflow: scroll;} .top-bar.expanded section.top-bar-section .has-dropdown>a:after {margin-left: 6px;transform: rotate(270deg);} .top-bar.expanded section.top-bar-section .has-dropdown.open>a:after {top: 5px!important;transform: rotate(180deg)!important;} } /* Two - Four column gap */ .widget.widget--two-column.widget--two-column_standard .ember-view .row {margin: 0;} .widget.widget--two-column.widget--two-column_standard .ember-view .row .medium-6.columns {padding-left:0;padding-right: 0;} @media only screen and (min-width: 48.063em){ .widget.widget--two-column.widget--two-column_standard .ember-view .row .medium-6 {width: 48%;} } @media only screen and (min-width: 90.063em){ .widget.widget--four-column.widget--four-column_standard .ember-view .row .medium-6.large-3.columns{padding-left: 3%;padding-right: 3%;} } @media only screen and (min-width: 64.063em){ .widget.widget--four-column.widget--four-column_standard .ember-view .row .medium-6.large-3.columns{padding-left: 3%;padding-right: 3%;} } @media only screen and (max-width: 64.063em) and (min-width: 48.063em){ .widget.widget--four-column.widget--four-column_standard .ember-view .row .medium-6.large-3.columns{width: 100%;} .widget--four-column.widget--four-column_standard .medium-6.large-3.columns .ember-view.editor-content.indent-list p{margin-bottom:22px;} } @media only screen and (max-width: 48.063em){ .widget--four-column.widget--four-column_standard .medium-6.large-3.columns:not(:last-child) .ember-view.editor-content.indent-list p{margin-bottom:22px;} } /* Trainer-led image padding */ @media only screen and (min-width: 1400px){ .layout__content--trainer-led.layout__content .row.widget.widget--one-column.widget--one-column_standard .ember-view .row .medium-12.columns .editor-content.indent-list p img{ padding: 0 15%; } } @media only screen and (min-width: 80.7em) and (max-width: 1400px){ .layout__content--trainer-led.layout__content .row.widget.widget--one-column.widget--one-column_standard .ember-view .row .medium-12.columns .editor-content.indent-list p img{ padding: 0 6%; } } /* IMG inside Microlearning & Certifications imgs */ .cert-img .featured-content-default-grid .catalog-grid-item .row, .micro-img .featured-content-default-grid .catalog-grid-item .row, .home-cert-img .featured-content-default-grid .catalog-grid-item .row{height: 100%;} .cert-img .featured-content-default-grid .catalog-grid-item__asset-container{padding-bottom: 70px;padding-top: 70px;} /* REVIEW (comment) .home-cert-img .featured-content-default-grid .catalog-grid-item__asset-container{padding-bottom: 40px;padding-top: 40px;}*/ .micro-img .featured-content-default-grid .catalog-grid-item__asset-container{padding-bottom: 30px;padding-top: 30px;} /* KEEP .cert-img */ .cert-img .featured-content-default-grid .catalog-grid-item__asset-container img, .micro-img .featured-content-default-grid .catalog-grid-item__asset-container img, .home-cert-img .featured-content-default-grid .catalog-grid-item__asset-container img{height: 100%;} @media only screen and (min-width: 48.063em) and (max-width: 64em){ .cert-img .featured-content-default-grid .catalog-grid-item .catalog-grid-item__body, .micro-img .featured-content-default-grid .catalog-grid-item .catalog-grid-item__body, .home-cert-img .featured-content-default-grid .catalog-grid-item .catalog-grid-item__body{padding-right: 0;} } @media only screen and (max-width: 48em){ .cert-img .featured-content-default-grid .catalog-grid-item .catalog-grid-item__body, .micro-img .featured-content-default-grid .catalog-grid-item .catalog-grid-item__body, .home-cert-img .featured-content-default-grid .catalog-grid-item .catalog-grid-item__body{padding-right: 0;} } /* SNK - .catalog-grid-item__body */ .widget--catalog .catalog-grid-item { display: flex; flex-direction: column; height: 100%; padding: 32px 24px 24px } @media only screen and (max-width: 48em) { .widget--catalog .catalog-grid-item__body { padding-bottom:43px } } .widget--featured-content .catalog-grid-item__body { padding: 24px 0 0 } /* REMOVE Featured Content Standard .widget--featured-content .medium-block-grid-2 .catalog-grid-item__body { padding: 24px 24px 24px 0 } */ .featured-content-default-grid .catalog-grid-item__asset-container { border-bottom: 1px solid #000; padding-bottom: 32px; padding-top: 32px } .catalog-grid-item__asset-container--split { padding: 0 } /* KEEP widget items > li > a > item > div > img */ .widget--featured-content .medium-block-grid-2 .catalog-grid-item .catalog-grid-item__asset-container,.widget--featured-content .medium-block-grid-2 .catalog-grid-item .catalog-grid-item__asset-container>div.ember-view,.widget--featured-content .medium-block-grid-2 .catalog-grid-item .catalog-grid-item__asset-container>div.ember-view img { height: 100% } .widget--featured-content_multi-carousel.widget--featured-contentmulti-carousel-no-cards .catalog-grid-item__asset-container { flex-shrink: 0; width: 100% } /* REVIEW (comment) .catalog-grid-item__asset-container img { padding-top: 0 }*/ /* CERTIFICATIONS */ .course__detail__container .collection__courses__list img{ border: none; } /* SNK - .collection__courses__list */ /*REMOVE .collection__courses__list */ /* Padding small screen .course__detail__container,.dashboard-account,.layout-panel--article .topic__container { padding: 24px calc(24px - 1rem) }*/ /* REVIEW .collection__courses__list /* Padding medium screen @media only screen and (min-width: 48.063em) and (max-width:64em) { .course__detail__container,.dashboard-account,.layout-panel--article .topic__container { padding:1rem calc(32px - 1rem) } }*/ /* REVIEW AND REMOVE .collection__courses__list */ /* Padding big screen @media only screen and (min-width: 64.063em) { .course__detail__container,.dashboard-account,.layout-panel--article .topic__container { padding:6rem calc(100px - 1rem) 1rem } }*/ @media only screen and (min-width: 64.063em) { /* .course__detail__container .course__detail__content { padding-right:3rem comment }*/ } /* NAVIGATING ACADEMY */ .navigatingAcademy-video1 figure, .navigatingAcademy-video2 figure{margin: 0;} .navigatingAcademy-3column .navigatingAcademy-brochureButtons{display: flex; flex-direction: column; align-items: center;} @media only screen and (min-width: 48.063em){ .navigatingAcademy-3column .medium-4.columns:nth-child(2){padding-left: 2rem;padding-right: 2rem;} } @media only screen and (max-width: 48.063em){ .navigatingAcademy-video1 .row{display: flex; flex-direction: column-reverse;} .navigatingAcademy-3column .medium-4.columns:not(:last-child){margin-bottom: 40px;} .navigatingAcademy-3column .btn.btn--primary.btn--left.btn--large, .navigatingAcademy-video2 .btn.btn--primary.btn--left.btn--large{width:100%;} } /* --- END responsive enhancements --- */ /* --- TRANING TRACKS CSS --- */ /* Return to training track bar */ .learn.course .h-14.md_h-16.bg-accent[role=banner]{top: 59px!important;} @media only screen and (max-width: 40.063em){ .h-14.md_h-16.bg-accent[role=banner] {top: 41px!important;} } /* SNK - .learn.course .h-14.md_h-16.bg-acceNT */ @media only screen and (max-width: 40em) { .learn.course .h-14.md_h-16.bg-accent[role=banner],.learner__container { padding-left:24px!important; padding-right: 24px!important } } @media only screen and (min-width: 40.063em) and (max-width:64em) { .learn.course .h-14.md_h-16.bg-accent[role=banner],.learner__container { padding-left:32px!important; padding-right: 32px!important } } @media only screen and (min-width: 64.063em) { .learn.course .h-14.md_h-16.bg-accent[role=banner],.learner__container { padding-left:100px; padding-right: 100px } } @media only screen and (max-width: 48em) { .learn.course .h-14.md_h-16.bg-accent[role=banner] { top:80px } } @media only screen and (min-width: 48.063em) { .learn.course .h-14.md_h-16.bg-accent[role=banner] { height:48px } } .panel.panel--secondary.flex.py-2.px-4.rounded{margin-bottom: 0;} /* Notes on Training Tracks */ .learning-path-milestone-item__alt-description:not(.bluerocratic.manager .learning-path-milestone-item__alt-description){position: relative; bottom: 68px;} div.learning-path-milestone-item__alt-description div.editor-content.indent-list h4{line-height: 16px; margin-bottom: 85px;} div.learning-path-milestone-item__alt-description div.editor-content.indent-list h4 a{line-height: 0;} /* --- END Training Tracks CSS --- */ /*?*/ div.expandable-sidebar__content ul.learner__sidebar-list li.learner__sidebar-inner-list.learner__sidebar-inner-list--disabled{ margin: 0; } /*Language selector text color override SNK. - Sorry, Giannella. xoxo Mari --- REVIEW */ .txlive-langselector .txlive-langselector-current{color: #000000;} .txlive-langselector-list > li button {background-color: transparent!important; text-align: center!important; padding:12px 24px!important;} .txlive-langselector-list > li:hover button, .txlive-langselector-list > li button:hover {color: #000000!important;} ul.txlive-langselector-list>li{padding:0!important;} /* SNK - Language selector --- REVIEW */ .txlive-langselector { background: #5cfe50!important; border-radius: 0!important; bottom: 24px!important; box-shadow: none!important } .manager .txlive-langselector { bottom: 0!important } .txlive-langselector-toggle { border: none!important; color: #000; height: auto!important; padding: 12px 24px!important } .manager .txlive-langselector-toggle { padding: 8px 24px!important } .txlive-langselector .txlive-langselector-current { font-family: Inter; font-size: .938rem!important; font-weight: 600!important; line-height: 1.35!important; text-transform: uppercase } .txlive-langselector-marker { border-bottom: 4px solid #000!important; margin-left: 24px!important; margin-top: 8px!important } .txlive-langselector-list { background: #e5e5e5!important; border: none!important; border-radius: 0!important; bottom: 41px!important; box-shadow: none!important; color: #000!important; padding: 0!important } @media only screen and (min-width: 48.063em) { .txlive-langselector-list { bottom:44px!important } .manager .txlive-langselector-list { bottom: 36px!important } } .txlive-langselector-list>li { font-family: Inter!important; font-size: .938rem!important; font-weight: 600!important; line-height: 1.35!important; padding: 12px 24px!important } .txlive-langselector-list>li:not(:last-child) { border-bottom: 1px solid #fff!important } .txlive-langselector-list>li:hover { background: #5cfe50!important; color: #000!important } /*END Language selector text color override SNK*/ /*Adjust color of date for live events (webcasts) on catalog tiles */ .catalog-grid-item__start-date, .catalog-list-item__start-date { background-color: #000000; color: #ffffff; padding: 5px 10px; border-radius: 6px;} /* Black background in one and two columns */ .blackbg{background-color: #000000; color: #ffffff;} .blackbg .h2.widget__title,.blackbg .widget__subtitle{color: #ffffff;} /* Wistia video crop */ .video__frame /*.wistia_embed_initialized*/{overflow:visible!important; display: inline-flex!important;height:auto!important;} /* SNK - Wistia video crop */ .video__container .video__frame .w-bottom-bar-lower>div>div { background-color: #000!important } /* --- RECENTLY REVIEWED --- */ /* KEEP */ .widget--recent-content.widget--recent-content_multi-carousel .featured-content-with-sidebar .medium-9, .widget--recent-content.widget--recent-content_multi-carousel .hide-for-small-only .medium-9{ width: 100%; } .widget--recent-content_multi-carousel .featured-content-multi-carousel ul li { padding-bottom: 0; padding-top: 0 } .widget--recent-content_multi-carousel .small-12.columns>div.ember-view>div.ember-view+div.ember-view { position: relative } /* --- END recently reviewed --- */ /* Course - Test issue */ .quiz__overlay{position:unset;} .quiz__container--test--taking{z-index: 0;} /*Central Asset Library improved display*/ .topic__content div.central_library--expanded { width: 90%; } .central_library--expanded div.expandable-table__row__column--tags { width: 5%; } .central_library--expanded div.courses-table__header.central-library-table__header--tag { width: 5%; } .central_library--expanded div.small-3.columns.expandable-table__row__column.expandable-table__row__column--library-title { width:43%; } .central_library--expanded div.small-4.columns.courses-table__header.courses-table__header--title{ width:48%; } .central_library--expanded div.courses-table__header.central-library-table__header--date { width: 10%; } .central_library--expanded div.small-1.expandable-table__row__column.expandable-table__row__column--library--type.expandable-table__row__column--overflowable { width: 5%; } .central_library--expanded div.small-1.columns.courses-table__header { width: 5%; } .central_library--expanded div.small-1.columns.expandable-table__row__column { width: 5%; } /* Snippets poppup improved display */ .modal-dialog .modal-content .modal-body ul.items__list { margin: 0 0 1em; padding: 0; display: grid; grid-template-columns: repeat(auto-fit, minmax(400px, 1fr)); } .modal-dialog .modal-content div.modal-body { padding: 0px 4px 32px; } .modal-dialog .modal-content .modal-body ul.items__list li div.small-3.columns { padding-left: 0rem; padding-right: 0rem; width:10%; } .modal-dialog .modal-content .modal-body ul.items__list li { border: 1px solid #787878; margin-bottom: -1px; padding: .75em .5rem; } .modal-dialog .modal-content .modal-body ul.items__list li div.small-9.columns { width:85%; } div.modal-dialog { max-width: 80%; padding: 3em 1rem 0; } /* SNK - modal */ .modal .close { color: transparent; padding: 27px 32px } .modal .close:before { background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg width='23' height='23' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath fill-rule='evenodd' clip-rule='evenodd' d='m11.081 12.495 9.586 9.586 1.414-1.414-9.586-9.586 9.586-9.586L20.667.081 11.08 9.667 1.414 0 0 1.414l9.667 9.667L0 20.748l1.414 1.414 9.667-9.667Z' fill='%23000'/%3E%3C/svg%3E"); content: ""; display: block; height: 23px; position: absolute; top: 32px; width: 23px } .modal-content { border: none; border-radius: 0 } .modal-header { border-bottom: none; padding: 32px 32px 0 } .modal-title { border-bottom: 1px solid #e5e5e5; color: #000; padding-bottom: 24px } .modal-body { padding: 24px 32px 32px } .modal-body .h3.ask__title { /*font-family: Inter*/ } #learner .modal-footer { display: none; } /* Snippet checkboxes circle and square */ table.no-borders tr, table.no-borders td { border: 0px solid white!important; text-align: left; } td.input-cell { text-align:center; width: 5%; padding: .5em; vertical-align: top; } td.label-cell { padding:0px!important; } table.no-borders { width: 80%; margin-left: 10px; } .table-cell-input{ width: 20px; height: 20px; border-radius: 10px; accent-color:#0029FF; } .table-cell-label { font-size: 17px; color:#000000; padding-left: .5em; padding-bottom: 12px; } /* Snippet checkboxes circle and square END */ /* CSS display in course search */ .learner__sidebar .learner__sidebar__search.learner__sidebar__search--active .learner__sidebar__search-autocomplete{ display: none; } /* ----- KNOWLEDGE CHECK ---- */ .quiz__container{ padding: 0; } /* Start screen */ .quiz-start__content:before{ content: none; } .quiz-start__content{ display: flex; align-items: center; justify-content: center; background-color: var(--color-background-default-grey); border-radius: var(--card-border-radius); } .quiz-start__content .quiz-start__text{ display: flex; flex-direction: column; align-items: center; } .quiz-start__text p{ color: var(--color-paragraph-dark-grey); line-height: inherit; font-size: var(--typography-platform-heading-S-size); } .quiz-start__text .quiz-start__sub-text{ margin-top: 14px; } .quiz-start__text .btn--primary.btn--centered.btn--huge{ position: initial!important; transform: none!important; font-size: var(--typography-paragraph-font-size-M); background-color: var(--color-brand-black); border-color: var(--color-brand-black); } .quiz-start__text .btn--primary.btn--centered.btn--huge:hover, .quiz-start__text .btn--primary.btn--centered.btn--huge:focus-within{ background-color: var(--color-background-hover-black); color: var(--color-brand-white); } @media only screen and (min-width: 48em){ .quiz-start__content{ min-height: 600px; } } @media only screen and (max-width: 48em){ .quiz-start__content .quiz-start__text{ gap: 10px; } .quiz-start__text p{ font-size: var(--typography-paragraph-font-size-M); } .quiz-start__text .btn--primary.btn--centered.btn--huge{ width: 100%; } } /* choices */ .choices__list.choices__list--boolean .choice--multiple.choice .row{ margin: 0!important; } /*choice - letter*/ .choices__list.choices__list--boolean .choice--multiple .choice__index{ width: auto; } /*choice - question*/ .choices__list.choices__list--boolean .choice--multiple .leading-loose{ margin-left: 6px; } .choices__list .choice--multiple .choice, .choices__list.choices__list--boolean .choice__icon .choice__selected-answer{ font-size: var(--typography-paragraph-font-size-M); } .quiz__container--learner .choices__list li .choice, .quiz__container--learner .choices__list li .choice .small-11{ width: auto; } /*choice - question > answer*/ .quiz__container--learner .choice__review{ width: auto; } /* ----- END knowledge check ---- */ /* SNK. quiz */ .quiz__container { position: relative } .quiz__container .question__body img.image-zoom { height: auto; image-rendering: -webkit-optimize-contrast; transform-origin: left bottom; transition: transform .3s ease; width: 50% } .quiz__container .question__body img.image-zoom:hover { transform: scale(2) } .quiz-start__text .btn--primary.btn--centered.btn--huge { left: 50%; margin: 0!important; position: absolute; top: -48px; transform: translate(-50%,-100%) } a.dashboard-header-dropdown__link .dashboard-header__avatar__container .avatar { background: transparent; border: 1px solid #fff; color: #fff; font-family: Inter; font-size: 15px; font-weight: 600; height: 44px; min-width: 44px; text-transform: none } a.dashboard-header-dropdown__link .dashboard-header__avatar__container .avatar:focus,a.dashboard-header-dropdown__link .dashboard-header__avatar__container .avatar:hover { background-color: var(--accent-hover-color)!important; border-color: var(--accent-hover-color); color: var(--accent-contrast-color) } .avatar.avatar--completion-criteria { align-items: center; background: none; border: 1px solid #000; color: #000; display: flex; font-size: 15px; font-weight: 600; height: 44px; justify-content: center; line-height: 20px; width: 44px } /* REMOVE */ .catalog-grid-item__cta-container span.btn--link,.course__includes__title,.dashboard__user__avatar-upload span,.layout__content--sidebar .course__detail__social .h6.heading--alt,.learning-content__back-button,.learning-path-detail-milestone-item .learning-path-detail-milestone-item__cta,.learning-path-milestone__badge,.nav--top ul a,body:not(.manager) .btn--alt,body:not(.manager) .btn--bare:not(.catalog-aggregation__value),body:not(.manager) .btn--primary,body:not(.manager) .btn--primary--manager--new,body:not(.manager) .btn--submit,body:not(.manager) .btn--success-new,body:not(.manager) .subscription__cancel-button,body:not(.manager) .subscription__confirm-cancellation,body:not(.manager) .subscription__revert-cancellation { /* REMOVE font-family: Inter;*/ font-size: var(--typography-paragraph-font-size-M); /* font-weight: 600; line-height: 20px*/ } /* Img in course progress bar */ .avatar.avatar--completion-criteria.print_border-neutral-300 img, li.topic__list__item .topic__list__thumb img{ margin:0; } /* SNK - Img in course progress bar */ .avatar.avatar--completion-criteria { align-items: center; background: none; border: 1px solid #000; color: #000; display: flex; font-size: 15px; font-weight: 600; height: 44px; justify-content: center; line-height: 20px; width: 44px } .dashboard__user__avatar-upload { align-items: center; background: #f5f6f6; border: 1px dashed #000; border-radius: 200px; display: flex; height: 168px; justify-content: center; margin-left: 16px; margin-right: 16px; margin-top: 32px; max-width: none; padding: 0; width: 168px } @media only screen and (max-width: 48em) { .dashboard__user__avatar-upload { margin-bottom:32px } } .dashboard__user__avatar-upload span { color: #000; text-transform: none } .dashboard__user__avatar-upload { align-items: center; background: #f5f6f6; border: 1px dashed #000; border-radius: 200px; display: flex; height: 168px; justify-content: center; margin-left: 16px; margin-right: 16px; margin-top: 32px; max-width: none; padding: 0; width: 168px } @media only screen and (max-width: 48em) { .dashboard__user__avatar-upload { margin-bottom:32px } } .dashboard__user__avatar-upload span { color: #000; text-transform: none } a.dashboard-header-dropdown__link .dashboard-header__avatar__container { float: left; width: 100% } a.dashboard-header-dropdown__link .dashboard-header__avatar__container .avatar { background: transparent; border: 1px solid #fff; color: #fff; font-family: Inter; font-size: 15px; font-weight: 600; height: 44px; min-width: 44px; text-transform: none } .avatar.avatar--completion-criteria { align-items: center; background: none; border: 1px solid #000; color: #000; display: flex; font-size: 15px; font-weight: 600; height: 44px; justify-content: center; line-height: 20px; width: 44px } .dashboard__user__avatar-upload { align-items: center; background: #f5f6f6; border: 1px dashed #000; border-radius: 200px; display: flex; height: 168px; justify-content: center; margin-left: 16px; margin-right: 16px; margin-top: 32px; max-width: none; padding: 0; width: 168px } @media only screen and (max-width: 48em) { .dashboard__user__avatar-upload { margin-bottom:32px } } .dashboard__user__avatar-upload span { color: #000; text-transform: none } /* Lists in the backend */ .redactor-styles ol li, .redactor-styles ul li{ font-size: 17px; } /* =============== PLATFORM CONTENT =============== */ /*HERE*/ /* SNK - .topic */ .learner__content .topic__content .topic__content { padding-left: 0!important; padding-right: 0!important } .topic__text__body { padding: 0 } .topic__edit { padding: 0 2rem } /* SNK - .directional__nav */ .directional__nav a { padding-top: 24px } .directional__nav a:hover .directional__nav__button { background-color: var(--accent-color); border-color: var(--accent-color) } .directional__nav a:hover .directional__nav__button i:before { background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg width='13' height='24' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M12.645 11.96 1.557 23.048l-.998-.998 10.088-10.088L.56 1.87l.998-.999L12.645 11.96Z' fill='%23fff'/%3E%3C/svg%3E") } .directional__nav__button { align-items: center; background-color: #fff; border: 1px solid #000; display: flex; height: 46px; justify-content: center; width: 46px } .directional__nav__button i { color: #000 } .directional__nav__button i,.directional__nav__button i:before { display: inline-block; height: 24px; width: 13px } .directional__nav__button i:before { background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg width='13' height='24' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M12.645 11.96 1.557 23.048l-.998-.998 10.088-10.088L.56 1.87l.998-.999L12.645 11.96Z' fill='%23000'/%3E%3C/svg%3E"); background-repeat: no-repeat; color: transparent } .directional__nav__button i.icon-navigateleft { margin-right: 2px; transform: rotate(-180deg) } /* Header */ .header:not(.header--tools):not(.header--secondary-manager):not(.header--subtitle) { top: -1px!important; } /* KEEP Header:not */ /* SNK - Header:not */ .header:not(.header--tools):not(.header--secondary-manager):not(.header--subtitle) { /*background-color: #000!important; border: none; box-shadow: 0 12px 18px -12px rgba(0,0,0,.25); comment */ height: 96px; padding: 0 24px; position: -webkit-sticky; position: sticky; /* top: 0;*/ z-index: 999 } /* REMOVE Header:not @media only screen and (min-width: 48.063em) and (max-width:64em) { .header:not(.header--tools):not(.header--secondary-manager):not(.header--subtitle) { padding:20px 32px } }*/ /* REMOVE Header:not @media only screen and (min-width: 64.063em) { .header:not(.header--tools):not(.header--secondary-manager):not(.header--subtitle) { padding:20px 100px } }*/ /* REVIEW Header:not */ @media only screen and (max-width: 48em) { .header:not(.header--tools):not(.header--secondary-manager):not(.header--subtitle) { height:80px; padding-bottom: 10px; padding-top: 10px } } /* SNK - Header in courses */ .learn.course .header--student { display: flex } .learn.course .header--student .header__left,.learn.course .header--student .header__right { float: none; padding: 0 } .learn.course .header--student .header__right { left: 0; text-align: left } @media only screen and (max-width: 48em) { .learn.course .header--student .header__right { display:block } } .learn.course .header--student .header__left,.learn.course .header--student .header__left__icon { display: none } /* SNK - .learn.course*/ .learn.course .h-14.md_h-16.bg-accent[role=banner] { position: fixed; top: 96px; width: 100%; z-index: 99 } .learn.course .h-14.md_h-16.bg-accent[role=banner] .grid.h-full.grid-cols-2 { grid-template-columns: repeat(1,minmax(0,1fr)) } .learn.course .h-14.md_h-16.bg-accent[role=banner] .flex.justify-start.items-center.pl-4 { padding-left: 0 } .learn.course .h-14.md_h-16.bg-accent[role=banner] .flex.justify-end.items-center.pr-4 { display: none } .learn.course .h-14.md_h-16.bg-accent[role=banner] button { font-size: 15px; font-weight: 600; line-height: 20px; margin-bottom: 0 } .learn.course .h-14.md_h-16.bg-accent[role=banner] button i.icon-navigateleft { padding-right: 12px } .learn.course .h-14.md_h-16.bg-accent[role=banner] button i.icon-navigateleft:before { background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg width='8' height='13' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath fill-rule='evenodd' clip-rule='evenodd' d='M0 6.5 6.472 13 8 11.466 3.03 6.5 8 1.534 6.472 0 0 6.5Z' fill='%23fff'/%3E%3C/svg%3E"); background-repeat: no-repeat; color: transparent; display: inline-block; height: 13px; vertical-align: text-top; width: 8px } /* SNK - course*/ /* KEEP Sidebar */ .heading--primary.collection__course__title,.heading.heading--primary { color: #000 } .course__includes { margin: 24px 0 } @media only screen and (max-width: 48em) { .course__includes { margin-bottom:0; margin-top: 48px } } .course__includes hr { border-color: #e5e5e5 } .course__includes__title { /*font-family: Inter!important;*/ line-height: 20px; padding: 0 16px } .course__includes__title+hr { margin-bottom: 24px } /* KEEP Milestones */ .collection__courses .center-ruled-title { display: flex; flex-direction: column } /* KEEP Milestones */ .collection__courses .center-ruled-title>hr { border-color: #e5e5e5; margin: .5rem 0 1rem; order: 2 } /* KEEP Milestones */ .collection__courses .center-ruled-title>span { align-self: flex-start; /*color: #000; font-family: Poppins; comment */ margin: 0; padding: 0; text-transform: none } /* KEEP Milestones */ .learning-path-detail-milestone-list { list-style: none; margin: 0; padding: 0; } .widget--course-benefits .course__includes__list { margin-top: 10px } .widget--course-benefits .course__includes__list li { margin-bottom: 24px; padding-left: 0 } .widget--course-benefits .course__includes__list li>span { font-size: 17px; line-height: 30px; padding-left: 40px } .widget--course-benefits .course__includes__list .icon--round { background: none; height: 30px; margin-right: 10px; margin-top: -3px; width: 30px } .widget--course-benefits .course__includes__list .icon--round:before { background-repeat: no-repeat; color: transparent; display: block; margin-left: calc(50% + 1px); transform: translateX(-50%) } .widget--course-benefits .course__includes__list .icon-mobile:before { background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg width='12' height='20' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M10.166.842 1.833.833C.916.833.166 1.583.166 2.5v15c0 .917.75 1.667 1.667 1.667h8.333c.917 0 1.667-.75 1.667-1.667v-15c0-.917-.75-1.658-1.667-1.658Zm0 14.991H1.833V4.167h8.333v11.666Z' fill='%23000'/%3E%3C/svg%3E") } .widget--course-benefits .course__includes__list .icon-clock:before { background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg width='20' height='20' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M9.991 1.667c-4.6 0-8.325 3.733-8.325 8.333s3.725 8.333 8.325 8.333c4.608 0 8.342-3.733 8.342-8.333S14.599 1.667 9.99 1.667Zm.008 15A6.665 6.665 0 0 1 3.333 10a6.665 6.665 0 0 1 6.666-6.667A6.665 6.665 0 0 1 16.666 10a6.665 6.665 0 0 1-6.667 6.667Z' fill='%23000'/%3E%3Cpath d='M10.416 5.833h-1.25v5l4.375 2.625.625-1.025-3.75-2.225V5.833Z' fill='%23000'/%3E%3C/svg%3E"); height: 20px; width: 20px } .widget--course-benefits .course__includes__list .icon-write:before { background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg width='16' height='16' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M.5 12.375V15.5h3.125l9.217-9.217-3.125-3.125L.5 12.375Zm14.758-8.508a.83.83 0 0 0 0-1.175l-1.95-1.95a.83.83 0 0 0-1.175 0l-1.525 1.525 3.125 3.125 1.525-1.525Z' fill='%23000'/%3E%3C/svg%3E"); height: 16px; width: 16px } /* REMOVE .layout__content--sidebar .widget--course-purchase,.layout__content--sidebar .widget--course-social { padding: 0 }*/ /* KEEP Sidebar > button */ .layout__content--sidebar .widget--course-purchase .btn { /* display: block; text-align: center; comment */ width: 100% } .layout__content--sidebar .widget--course-purchase .btn--alt.btn--primary:not(:hover) { background-color: var(--accent-color); border-color: var(--accent-color); color: #fff } .layout__content--sidebar .widget--course-purchase .btn--alt:not(.btn--primary) { display: none } .course-purchase__mobile-button { display: none } .home.course-group .container { padding: 0 } .course-progress { display: flex; flex-direction: column } .course-progress>div.ember-view { order: 3 } .course-progress>div.clearfix .btn--link { float: none; font-size: 14px; font-weight: 700; line-height: 24px } .course-progress>div.clearfix .btn--link:before { border-color: #000 transparent transparent; border-style: solid; border-width: 5px 5px 0; content: ""; display: inline-block; height: 0; margin-right: 16px; vertical-align: 4px; width: 0 } .course-progress>div.clearfix .btn--link:hover { color: #000 } .course-progress .progress { height: 8px; margin-top: 21px } .course-progress hr { display: none } .course-progress__overall .small-4 { display: inline-block; width: auto } .course-progress__overall .description,.course-progress__overall .stat,.course-progress__overall .stat sup { display: inline-block; font-size: 17px; font-weight: 700; line-height: 30px; width: auto } .course-progress__overall .stat { margin-left: 16px; min-width: auto } .course-progress__overall .stat sup { margin-right: 6px; top: 0 } .course-progress__overall .highlight { color: #000 } .course-progress__section .description,.course-progress__section .stat { font-size: 14px; font-weight: 300; line-height: 24px } .course-progress__section .description,.course-progress__section .stat .highlight { color: #000 } .course-progress__section .stat { min-width: auto; width: auto } .course-progress__section .stat sup { margin-right: 8px; top: 0 } .course-progress__section__expander { min-width: 26px } /* Footer de custome code no lo he puesto porque no tiene sentido ponerlo si es el antiguo? */ /* SNK - .learner-section__title */ /* REMOVE dashboard-access__header .dashboard-access__header,.dashboard-account .dashboard--content-panel .section__header .section__title,.enroll__buy--monthly .enroll__price,.enroll__buy--yearly .enroll__price,.featured-content-carousel-item__title,.h4,.learner-section__title,.learning-path-detail-milestone-list>li>h3,.learning-path-milestone__title,.session__container .order-confirmation .heading,.session__container .subscription h1,.tools__container .heading--primary,h4 { font-weight: 700 }*/ @media only screen and (max-width: 48em) { .dashboard-access__header,.dashboard-account .dashboard--content-panel .section__header .section__title,.enroll__buy--monthly .enroll__price,.enroll__buy--yearly .enroll__price,.featured-content-carousel-item__title,.h4,.learner-section__title,.learning-path-detail-milestone-list>li>h3,.learning-path-milestone__title,.session__container .order-confirmation .heading,.session__container .subscription h1,.tools__container .heading--primary,h4 { font-size:22px; line-height: 30px } } /* REMOVE dashboard-access__header @media only screen and (min-width: 48.063em) { .dashboard-access__header,.dashboard-account .dashboard--content-panel .section__header .section__title,.enroll__buy--monthly .enroll__price,.enroll__buy--yearly .enroll__price,.featured-content-carousel-item__title,.h4,.learner-section__title,.learning-path-detail-milestone-list>li>h3,.learning-path-milestone__title,.session__container .order-confirmation .heading,.session__container .subscription h1,.tools__container .heading--primary,h4 { font-size:30px; line-height: 38px } }*/ .learner-lesson__title,.learner-section__title,.tools__container .heading--primary { color: #000!important; display: block } .learner-section__title,.tools__container .heading--primary { margin-bottom: 24px } .learner-section__title__slash { display: none } .learner-section__title__container h3 { margin-top: 0 } .learner-section__title__container .bookmark-check,.learner-section__title__container .bookmark-plus { bottom: 0; margin-right: 16px; top: auto } .learner-section__title__container .bookmark-check i,.learner-section__title__container .bookmark-plus i { color: #000 } /* SNK - bookmark */ .bookmark-content .btn--primary,.bookmark-content .btn--primary:hover,.btn--link.btn--default,.btn--social,.has-tooltip,.heading.heading--alt,body { color: #000 } .bookmark-folder__edit-name button { height: auto } /* SNK - .learner-lesson__title */ @media only screen and (max-width: 48em) { .h5,.learner-lesson__title,.learning-path-milestone-item.learning-path-milestone-item--secondary .learning-path-milestone-item__title h4,.session__container .order-confirmation .heading+p+p,.widget--featured-content .medium-block-grid-3 .catalog-grid-item__title,.widget--featured-content .medium-block-grid-4 .catalog-grid-item__title,h5 { font-size:18px; font-weight: 600; line-height: 30px } } @media only screen and (min-width: 48.063em) { .h5,.learner-lesson__title,.learning-path-milestone-item.learning-path-milestone-item--secondary .learning-path-milestone-item__title h4,.session__container .order-confirmation .heading+p+p,.widget--featured-content .medium-block-grid-3 .catalog-grid-item__title,.widget--featured-content .medium-block-grid-4 .catalog-grid-item__title,h5 { font-size:22px; font-weight: 700; line-height: 38px } } .learner-lesson__title,.learner-section__title,.tools__container .heading--primary { color: #000!important; display: block } /* SNK - .learner__content .topic__container */ .learner__content .topic__container { border-bottom: 1px solid #e5e5e5; margin-bottom: 24px; padding-bottom: 32px; padding-top: 48px } /* SNK - .editor-content*/ .editor-content ol,.editor-content ul { line-height: 1.77; margin-left: 28px; padding-left: 0 } .editor-content ol li,.editor-content ul li { margin-bottom: 0 } .editor-content a:not(.btn):hover { color: var(--link-color); text-decoration: underline } /* SNK - syllabus */ .learner__container .learner__sidebar-inner-list span.syllabus__section-title { color: #000; /*font-family: Inter;*/ font-size: 17px; font-weight: 700; line-height: 30px; margin-bottom: 16px } .learner__container .learner__sidebar-inner-list .syllabus__lesson .syllabus__lesson--title .completed__indicator i { color: var(--accent-color); padding-right: 0 } .learner__container button.syllabus__lesson--expander { margin-bottom: 0!important } .learner__container button.syllabus__lesson--expander .expander-triangle__closed-down,.learner__container button.syllabus__lesson--expander .expander-triangle__closed-right { border-left-width: 5px; border-top-width: 5px; padding: 0 } .learner__container button.syllabus__lesson--expander .expander-triangle__closed-right { border-bottom-width: 5px; border-left-color: #000; margin: 5px 18px 0 0 } .learner__container button.syllabus__lesson--expander .expander-triangle__closed-down { border-right-width: 5px; border-top-color: #000; margin: 7px 13px 0 0 } .learner__container .learner__sidebar-list ul.syllabus__section-list { margin: 0 } .learner__container .learner__sidebar-list ul.syllabus__section-list .syllabus__lesson-container { margin-bottom: 0; padding: 0 } .learner__container .syllabus__topic.syllabus__topic--active.syllabus__topic--non-expandable { background: none } .learner__container li.syllabus__topic--non-expandable:before { display: none } .learner__container .learner__sidebar-inner-list .syllabus__lesson .syllabus__lesson--title .syllabus__lesson--title-text,.learner__container .learner__sidebar__search-autocomplete__label { color: #000; /* font-family: Inter;*/ font-size: 14px; font-weight: 700; line-height: 24px; margin: 4px 0 } .learner__container .learner__sidebar__search-autocomplete__link,.learner__container .syllabus__topic--non-expandable-title-text { color: #000; font-family: Inter; font-size: 14px; font-weight: 300; line-height: 24px } /* SNK -learning-content-hero */ @media only screen and (min-width: 48.063em) { .h1,h1 { font-size:70px; line-height: 80px } } /* REMOVE hero .h2,.hero .hero__caption .hero__title,.learning-content-hero .w-full.py-0.px-10.absolute.left-0 h1,.learning-content-hero__caption h1,h2 { font-weight: 800 } */ @media only screen and (max-width: 48em) { .h2,.hero .hero__caption .hero__title,.learning-content-hero .w-full.py-0.px-10.absolute.left-0 h1,.learning-content-hero__caption h1,h2 { font-size:32px; line-height: 42px } } @media only screen and (min-width: 48.063em) { .h2,.hero .hero__caption .hero__title,.learning-content-hero .w-full.py-0.px-10.absolute.left-0 h1,.learning-content-hero__caption h1,h2 { font-size:54px; line-height: 72px } } /* REMOVE .course__detail__content .course__detail__content h1,.featured-content-image-overlay-item__title,.featured-content-multi-carousel-item__title,.h2.widget__title,.h3,.hero .hero__caption .widget__title.hero__title,.learn.account .header--subtitle h1,.learning-path-criterion__value-container,.user-engagement-stat__value-container,.widget--catalog .widget__alt-title__container h3,.widget--catalog.widget--catalog_standard .h2.widget__title,.widget__alt-title__container h3,h3 { font-weight: 800 } */ @media only screen and (max-width: 48em) { .catalog-grid-item__price,.catalog-list-item__info,.course__detail__header p,.enroll .contains,.enroll .interval,.enroll .srp,.featured-content-multi-carousel-item__description,.featured-content-multi-carousel-item__source,.learning-content-hero .w-full.py-0.px-10.absolute.left-0 h4,.learning-content-hero__caption h4,.modal-body .h3.ask__title,.session__container .order-confirmation .receipt-item__text p,form label { font-size:16px; line-height: 28px } } @media only screen and (min-width: 48.063em) { .catalog-grid-item__price,.catalog-list-item__info,.course__detail__header p,.enroll .contains,.enroll .interval,.enroll .srp,.featured-content-multi-carousel-item__description,.featured-content-multi-carousel-item__source,.learning-content-hero .w-full.py-0.px-10.absolute.left-0 h4,.learning-content-hero__caption h4,.modal-body .h3.ask__title,.session__container .order-confirmation .receipt-item__text p,form label { font-size:17px; line-height: 30px } } .learning-content-hero { background-color: #000 } @media only screen and (max-width: 48em) { .learning-content-hero .learning-content__back-button,.learning-content-hero picture { position:relative!important } } .learning-content-hero .picturefill img { -o-object-fit: cover; object-fit: cover } @media only screen and (max-width: 48em) { .learning-content-hero .picturefill img { height:100% } } @media only screen and (min-width: 48.063em) { .learning-content-hero .picturefill img { max-height:646px } } @media only screen and (max-width: 48em) { .learning-content-hero--no-asset { height:auto } .learning-content-hero--no-asset .learning-content-hero__caption { padding-top: 24px } } .learning-content-hero .w-full.py-0.px-10.absolute.left-0,.learning-content-hero__caption { padding: 0 24px; top: 76px } @media only screen and (min-width: 64.063em) { .learning-content-hero .w-full.py-0.px-10.absolute.left-0,.learning-content-hero__caption { padding:45px 100px 0 } } .learning-content-hero .w-full.py-0.px-10.absolute.left-0 h1,.learning-content-hero__caption h1 { margin-bottom: 24px } .learning-content-hero .w-full.py-0.px-10.absolute.left-0 h4,.learning-content-hero__caption h4 { font-family: Inter; font-weight: 300 } .learning-content-hero__overlay { display: none } /* SNK - .learning-path-milestone-item VER QUE HACER PORQUE SON COMO 115 - lmao comeback to this */ /* SNK - .learner__container */ .learner__container .learner__sidebar { padding-left: 0; padding-right: 0; padding-top: 0; visibility: hidden } @media only screen and (min-width: 64.063em) { .learner__container .learner__sidebar { width:372px } } .learner__container--toggled .learner__sidebar { visibility: visible } .learner__container .learner__sidebar__search>.row { display: flex; flex-direction: column-reverse } .learner__container .learner__sidebar__search>.row .small-8.columns { width: 100% } .learner__container .learner__sidebar__search input { border: 1px solid #000; border-radius: 23px; box-shadow: none; color: #000; font-family: Inter; font-size: 15px; font-weight: 600; height: auto!important; line-height: 20px; padding: 13px 34px } .learner__container .learner__sidebar__search .learner__sidebar__search-icon { border: none; bottom: -8px; left: auto; padding: 0!important; right: 34px; top: auto } .learner__container .learner__sidebar__search .learner__sidebar__search-icon .icon-search:before { background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg width='24' height='25' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M10.858 0c5.996 0 10.857 4.861 10.857 10.858 0 2.577-.898 4.946-2.399 6.808l4.33 4.285c.469.465.473 1.221.008 1.69l-.008.008a1.22 1.22 0 0 1-1.716 0l-4.326-4.283a10.812 10.812 0 0 1-6.746 2.35C4.86 21.715 0 16.853 0 10.857 0 4.86 4.861 0 10.858 0Zm0 2.413a8.445 8.445 0 1 0 5.84 14.544.739.739 0 0 1 .078-.09l.009-.01.102-.087a8.445 8.445 0 0 0-6.03-14.357Z' fill='%23000'/%3E%3C/svg%3E"); color: transparent; display: block; height: 25px; width: 24px } .learner__container .learner__sidebar__search--active .learner__sidebar__search-icon .icon-search { display: none } .learner__container .learner__sidebar__search--active .learner__sidebar__search-autocomplete-close { border: none; bottom: 10px; left: auto; padding: 0!important; right: 20px; text-align: right; top: auto } .learner__container .learner__sidebar__search--active .learner__sidebar__search-autocomplete-close i { font-size: 25px } .learner__container .learner__content { padding-left: 8.7%!important; padding-top: 36px!important } @media only screen and (min-width: 64.063em) { .learner__container .learner__content { width:calc(100% - 372px) } } .learner__container .learner__content .layout-panel { margin-left: -1em; margin-right: -1em; margin-top: 0; padding: 0 } .learner__container--closed .learner__content { padding-left: 0!important; padding-top: 0!important; width: 100% } .learner__container--closed .learner__container__toggle { display: flex } .learner__container--toggled .learner__content .learner__container__toggle .btn { display: none } .learner__container .layout-panel { margin-top: 24px; padding-bottom: 24px; padding-top: 0 } .learner__container .learner__container__toggle .btn { background: none; border: none; color: #000; font-size: 15px; height: auto; margin-bottom: 16px!important; padding: 0; text-align: left } .learner__container .learner__container__toggle .btn i { padding-right: 12px } .learner__container .learner__container__toggle .btn i:before { background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg width='8' height='13' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath fill-rule='evenodd' clip-rule='evenodd' d='M8 6.5 1.528 13 0 11.466 4.97 6.5 0 1.534 1.528 0 8 6.5Z' fill='%23000'/%3E%3C/svg%3E"); background-repeat: no-repeat; color: transparent; display: inline-block; height: 13px; vertical-align: middle; width: 8px } .learner__container .learner__container__toggle .btn.hide-sidebar i:before { background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg width='8' height='13' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath fill-rule='evenodd' clip-rule='evenodd' d='M0 6.5 6.472 13 8 11.466 3.03 6.5 8 1.534 6.472 0 0 6.5Z' fill='%23000'/%3E%3C/svg%3E") } .learner__container .expandable-sidebar__link { margin-bottom: 0!important } .learner__container .learner__sidebar__expandables { margin: 0 } .learner__container .expandable-sidebar__toggle { background: #fff; border-bottom: 1px solid #000; color: #000; font-size: 17px; font-weight: 700; line-height: 30px; padding: 8px 16px 16px; text-transform: none } .learner__container .expandable-sidebar__toggle i { margin-top: 6px; padding: 0 } .learner__container .expandable-sidebar__toggle i:not(.icon-navigateright):not(.icon-navigatedown) { display: none } .learner__container .expandable-sidebar--toggled { border-bottom: 1px solid #000; margin-top: 8px } .learner__container .expandable-sidebar--toggled .expandable-sidebar__toggle { background: #f5f6f6; border: none } .learner__container .expandable-sidebar--toggled .expandable-sidebar__toggle i { color: var(--accent-color) } .learner__container .expandable-sidebar__content { background: #f5f6f6; margin-bottom: 8px; padding-left: 16px; padding-right: 16px; padding-top: 0 } .learner__container .learner__sidebar-inner-list { border: none; padding: 0 } .learner__container .learner__sidebar-inner-list span.syllabus__section-title { color: #000; font-family: Inter; font-size: 17px; font-weight: 700; line-height: 30px; margin-bottom: 16px } .learner__container .learner__sidebar-inner-list .syllabus__lesson .syllabus__lesson--title .completed__indicator i { color: var(--accent-color); padding-right: 0 } .learner__container .learner__sidebar-inner-list li { color: #000; padding-bottom: 8px; padding-right: 0; padding-top: 0 } .learner__container button.syllabus__lesson--expander { margin-bottom: 0!important } .learner__container button.syllabus__lesson--expander .expander-triangle__closed-down,.learner__container button.syllabus__lesson--expander .expander-triangle__closed-right { border-left-width: 5px; border-top-width: 5px; padding: 0 } .learner__container button.syllabus__lesson--expander .expander-triangle__closed-right { border-bottom-width: 5px; border-left-color: #000; margin: 5px 18px 0 0 } .learner__container button.syllabus__lesson--expander .expander-triangle__closed-down { border-right-width: 5px; border-top-color: #000; margin: 7px 13px 0 0 } .learner__container .learner__sidebar-list ul.syllabus__section-list { margin: 0 } .learner__container .learner__sidebar-list ul.syllabus__section-list .syllabus__lesson-container { margin-bottom: 0; padding: 0 } .learner__container .syllabus__topic.syllabus__topic--active.syllabus__topic--non-expandable { background: none } .learner__container li.syllabus__topic--non-expandable:before { display: none } .learner__container .lesson-progress-page .icon-circle { background: transparent; border-color: #000; display: inline-block; margin-left: 8px; vertical-align: -3px } .learner__container .lesson-progress-page .icon-circle,.learner__container .lesson-progress-page .icon-circle span { height: 8px; width: 8px } .learner__container .lesson-progress-page .icon-circle span { background: none } .learner__container .lesson-progress-page.lesson-progress-page--completed .icon-circle,.learner__container .lesson-progress-page.lesson-progress-page--current .icon-circle { background-color: #000 } .learner__container .sidebar__resources>li { background: none } .learner__container .resources__count { background: var(--accent-color); font-size: 14px; font-weight: 600; height: 20px; line-height: 20px; min-width: 20px; padding: 0 5px; right: 0 } .learner__container .expandable-sidebar__buttons a { color: #000; font-size: 15px; font-weight: 600; line-height: 20px; padding: 0; text-transform: none } .learner__container .learner__sidebar__search-autocomplete { background: #f5f6f6; padding: 16px; top: 71px } .learner__container .learner__sidebar__search>.row .small-8.columns ::-webkit-input-placeholder { font-family: Inter; font-size: 15px; font-style: normal; font-weight: 600; line-height: 20px; opacity: .5 } .learner__container .learner__sidebar__search>.row .small-8.columns ::-moz-placeholder { font-family: Inter; font-size: 15px; font-style: normal; font-weight: 600; line-height: 20px; opacity: .5 } .learner__container .learner__sidebar__search>.row .small-8.columns :-ms-input-placeholder { font-family: Inter; font-size: 15px; font-style: normal; font-weight: 600; line-height: 20px; opacity: .5 } .learner__container .learner__sidebar__search>.row .small-8.columns :-moz-placeholder { font-family: Inter; font-size: 15px; font-style: normal; font-weight: 600; line-height: 20px; opacity: .5 } @media only screen and (min-width: 48.063em) { .learn.course .course__container>.company__beta-logo+.ember-view+.header--learner+.learner__container { padding-top:108px } } @media only screen and (max-width: 48em) { .learn.course .course__container>.company__beta-logo+.ember-view+.header--learner+.learner__container { padding-top:109px } } .learn.course .course__container>.company__beta-logo+.ember-view[style="display:none;"]+.header--learner+.learner__container { padding-top: 60px } .learner__container .learner__sidebar-inner-list .syllabus__lesson .syllabus__lesson--title .syllabus__lesson--title-text,.learner__container .learner__sidebar__search-autocomplete__label { color: #000; font-family: Inter; font-size: 14px; font-weight: 700; line-height: 24px; margin: 4px 0 } .learner__container .learner__sidebar__search-autocomplete__link,.learner__container .syllabus__topic--non-expandable-title-text { color: #000; font-family: Inter; font-size: 14px; font-weight: 300; line-height: 24px } /* --------------- PLATFORM CONTENT --------------- */ /* --- NAVIGATION BAR --- */ /* Catalog dropdown */ .header.header--microsite .header__inner .top-bar .top-bar-section ul li.has-dropdown.hover ul.dropdown{display: grid; border: 1px solid #000000;} .header.header--microsite .header__inner .top-bar .top-bar-section ul li.has-dropdown.hover ul.dropdown li{-webkit-box-shadow: none; box-shadow:none; padding:0;} .header.header--microsite .header__inner .top-bar .top-bar-section ul li.has-dropdown.hover ul.dropdown li:hover a{background-color: #0029ff!important; color: #ffffff!important;} /* Catalog dropdown - left column (main) */ .header.header--microsite .header__inner .top-bar .top-bar-section ul li.has-dropdown:nth-child(6) ul.dropdown li:nth-child(4), .header.header--microsite .header__inner .top-bar .top-bar-section ul li.has-dropdown:nth-child(6) ul.dropdown li:nth-child(7), .header.header--microsite .header__inner .top-bar .top-bar-section ul li.has-dropdown:nth-child(6) ul.dropdown li:nth-child(10), .header.header--microsite .header__inner .top-bar .top-bar-section ul li.has-dropdown:nth-child(6) ul.dropdown li:nth-child(13), .header.header--microsite .header__inner .top-bar .top-bar-section ul li.has-dropdown:nth-child(6) ul.dropdown li:nth-child(16), .header.header--microsite .header__inner .top-bar .top-bar-section ul li.has-dropdown:nth-child(6) ul.dropdown li:nth-child(19), .header.header--microsite .header__inner .top-bar .top-bar-section ul li.has-dropdown:nth-child(6) ul.dropdown li:nth-child(22), header.header--microsite .header__inner .top-bar .top-bar-section ul li.has-dropdown:nth-child(6) ul.dropdown li:nth-child(25), .header.header--microsite .header__inner .top-bar .top-bar-section ul li.has-dropdown:nth-child(6) ul.dropdown li:nth-child(28), .header.header--microsite .header__inner .top-bar .top-bar-section ul li.has-dropdown:nth-child(6) ul.dropdown li:nth-child(31), .header.header--microsite .header__inner .top-bar .top-bar-section ul li.has-dropdown:nth-child(6) ul.dropdown li:nth-child(34){grid-column:1/2;} .header.header--microsite .header__inner .top-bar .top-bar-section ul li.has-dropdown:nth-child(6) ul.dropdown li:nth-child(4) a::after, .header.header--microsite .header__inner .top-bar .top-bar-section ul li.has-dropdown:nth-child(6) ul.dropdown li:nth-child(7) a::after{content:"\276F";} .header.header--microsite .header__inner .top-bar .top-bar-section ul li.has-dropdown:nth-child(6) ul.dropdown li:nth-child(4) a, .header.header--microsite .header__inner .top-bar .top-bar-section ul li.has-dropdown:nth-child(6) ul.dropdown li:nth-child(7) a{display: flex; justify-content: space-between;} /* Catalog dropdown - right column (hover to display) */ .header.header--microsite .header__inner .top-bar .top-bar-section ul li.has-dropdown:nth-child(6) ul.dropdown li:nth-child(31), .header.header--microsite .header__inner .top-bar .top-bar-section ul li.has-dropdown:nth-child(6) ul.dropdown li:nth-child(34), .header.header--microsite .header__inner .top-bar .top-bar-section ul li.has-dropdown:nth-child(6) ul.dropdown li:nth-child(37), .header.header--microsite .header__inner .top-bar .top-bar-section ul li.has-dropdown:nth-child(6) ul.dropdown li:nth-child(40), .header.header--microsite .header__inner .top-bar .top-bar-section ul li.has-dropdown:nth-child(6) ul.dropdown li:nth-child(43), .header.header--microsite .header__inner .top-bar .top-bar-section ul li.has-dropdown:nth-child(6) ul.dropdown li:nth-child(46){position:absolute; grid-column: 2/3; width:171px; display:none; border: 1px solid #000000;} .header.header--microsite .header__inner .top-bar .top-bar-section ul li.has-dropdown:nth-child(6) ul.dropdown li:nth-child(31){grid-row:1/2; border-bottom: none;} .header.header--microsite .header__inner .top-bar .top-bar-section ul li.has-dropdown:nth-child(6) ul.dropdown li:nth-child(34){grid-row:2/3; border-top: none;} .header.header--microsite .header__inner .top-bar .top-bar-section ul li.has-dropdown:nth-child(6) ul.dropdown li:nth-child(37){grid-row:3/4; border-top: none;} .header.header--microsite .header__inner .top-bar .top-bar-section ul li.has-dropdown:nth-child(6) ul.dropdown li:nth-child(40){grid-row:4/5; border-top: none;} .header.header--microsite .header__inner .top-bar .top-bar-section ul li.has-dropdown:nth-child(6) ul.dropdown li:nth-child(43){grid-row:2/3; border-top: none;} .header.header--microsite .header__inner .top-bar .top-bar-section ul li.has-dropdown:nth-child(6) ul.dropdown li:nth-child(46){grid-row:3/4; border-top: none;} /* end catalog dropdown */ /* Role dropdown*/ .header.header--microsite .header__inner .top-bar .top-bar-section ul li.has-dropdown:nth-child(9) ul.dropdown{grid-template-columns: repeat(2, 1fr); grud-template-columns: repeat(9, 1fr)} .header.header--microsite .header__inner .top-bar .top-bar-section ul li.has-dropdown:nth-child(9) ul.dropdown li:nth-child(4) a, .header.header--microsite .header__inner .top-bar .top-bar-section ul li.has-dropdown:nth-child(9) ul.dropdown li:nth-child(7) a{background-color: #000000!important; color: #ffffff!important; border: 2px solid #ffffff; pointer-events: none;} .header.header--microsite .header__inner .top-bar .top-bar-section ul li.has-dropdown:nth-child(9) ul.dropdown li:nth-child(10), .header.header--microsite .header__inner .top-bar .top-bar-section ul li.has-dropdown:nth-child(9) ul.dropdown li:nth-child(13), .header.header--microsite .header__inner .top-bar .top-bar-section ul li.has-dropdown:nth-child(9) ul.dropdown li:nth-child(16), .header.header--microsite .header__inner .top-bar .top-bar-section ul li.has-dropdown:nth-child(9) ul.dropdown li:nth-child(19), .header.header--microsite .header__inner .top-bar .top-bar-section ul li.has-dropdown:nth-child(9) ul.dropdown li:nth-child(22), .header.header--microsite .header__inner .top-bar .top-bar-section ul li.has-dropdown:nth-child(9) ul.dropdown li:nth-child(25), .header.header--microsite .header__inner .top-bar .top-bar-section ul li.has-dropdown:nth-child(9) ul.dropdown li:nth-child(28), .header.header--microsite .header__inner .top-bar .top-bar-section ul li.has-dropdown:nth-child(9) ul.dropdown li:nth-child(31){grid-column: 1/2;} .header.header--microsite .header__inner .top-bar .top-bar-section ul li.has-dropdown:nth-child(9) ul.dropdown li:nth-child(34), .header.header--microsite .header__inner .top-bar .top-bar-section ul li.has-dropdown:nth-child(9) ul.dropdown li:nth-child(37), .header.header--microsite .header__inner .top-bar .top-bar-section ul li.has-dropdown:nth-child(9) ul.dropdown li:nth-child(40), .header.header--microsite .header__inner .top-bar .top-bar-section ul li.has-dropdown:nth-child(9) ul.dropdown li:nth-child(43), .header.header--microsite .header__inner .top-bar .top-bar-section ul li.has-dropdown:nth-child(9) ul.dropdown li:nth-child(46), .header.header--microsite .header__inner .top-bar .top-bar-section ul li.has-dropdown:nth-child(9) ul.dropdown li:nth-child(49), .header.header--microsite .header__inner .top-bar .top-bar-section ul li.has-dropdown:nth-child(9) ul.dropdown li:nth-child(52), .header.header--microsite .header__inner .top-bar .top-bar-section ul li.has-dropdown:nth-child(9) ul.dropdown li:nth-child(55){grid-column: 2/3; border-left: 1px solid #333; background: #ffffff!important} .header.header--microsite .header__inner .top-bar .top-bar-section ul li.has-dropdown:nth-child(9) ul.dropdown li:nth-child(58){grid-column: 1/3; border-top: 1px solid #333;} .header.header--microsite .header__inner .top-bar .top-bar-section ul li.has-dropdown:nth-child(9) ul.dropdown li:nth-child(34){grid-row: 2/3;} .header.header--microsite .header__inner .top-bar .top-bar-section ul li.has-dropdown:nth-child(9) ul.dropdown li:nth-child(37){grid-row: 3/4;} .header.header--microsite .header__inner .top-bar .top-bar-section ul li.has-dropdown:nth-child(9) ul.dropdown li:nth-child(40){grid-row: 4/5;} .header.header--microsite .header__inner .top-bar .top-bar-section ul li.has-dropdown:nth-child(9) ul.dropdown li:nth-child(43){grid-row: 5/6;} .header.header--microsite .header__inner .top-bar .top-bar-section ul li.has-dropdown:nth-child(9) ul.dropdown li:nth-child(46){grid-row: 6/7;} .header.header--microsite .header__inner .top-bar .top-bar-section ul li.has-dropdown:nth-child(9) ul.dropdown li:nth-child(49){grid-row: 7/8;} .header.header--microsite .header__inner .top-bar .top-bar-section ul li.has-dropdown:nth-child(9) ul.dropdown li:nth-child(52){grid-row: 8/9;} .header.header--microsite .header__inner .top-bar .top-bar-section ul li.has-dropdown:nth-child(9) ul.dropdown li:nth-child(55){grid-row: 9/10; pointer-events:none;} /* END Role dropdown */ /* SNK dropdown */ @media only screen and (min-width: 48.063em) { .widget--navbar .navigation-bar .dropdown li:not(.has-form) a:not(.button) { font-size:17px; font-weight: 700; padding: 8px 16px } } #dashboard-header-dropdown>li:nth-of-type(2) a[href^="/learn/account?tab=dashboard.account"] { display: none!important } .dashboard-header-dropdown>li>a.btn { margin-bottom: 0!important } /* Navigation bar - Mobile view */ @media only screen and (max-width: 48.063em) { ul.left ul:nth-child(8).dropdown.active, ul.left ul:nth-child(12).dropdown.active{display: grid!important; grid-template-columns: .1fr 1fr;} ul.left ul:nth-child(8).dropdown.active li:nth-child(4) a, ul.left ul:nth-child(8).dropdown.active li:nth-child(7) a, ul.left ul:nth-child(12).dropdown.active li:nth-child(4) a, ul.left ul:nth-child(12).dropdown.active li:nth-child(7) a{color: #858585!important; rotate: 180deg; text-wrap: nowrap; line-height: 38px;} ul.left ul:nth-child(8).dropdown.active li:nth-child(4), ul.left ul:nth-child(8).dropdown.active li:nth-child(7), ul.left ul:nth-child(12).dropdown.active li:nth-child(4), ul.left ul:nth-child(12).dropdown.active li:nth-child(7){padding-top: 20px;padding-left: 0px!important; writing-mode: vertical-rl; grid-column: 1/2; height: auto;} ul.left ul:nth-child(8).dropdown.active li:nth-child(4){grid-row: 1/4;} ul.left ul:nth-child(8).dropdown.active li:nth-child(7){grid-row: 4/6;} ul.left ul:nth-child(8).dropdown.active li:nth-child(31){grid-row: 1/2;} ul.left ul:nth-child(8).dropdown.active li:nth-child(34){grid-row: 2/3;} ul.left ul:nth-child(8).dropdown.active li:nth-child(37){grid-row: 3/4;} ul.left ul:nth-child(8).dropdown.active li:nth-child(40){grid-row: 4/5;} ul.left ul:nth-child(8).dropdown.active li:nth-child(43){grid-row: 5/6;} ul.left ul:nth-child(12).dropdown.active li:nth-child(4){grid-row:1/10;} ul.left ul:nth-child(12).dropdown.active li:nth-child(7){grid-row:10/16;} ul:not(.dropdown.active).left li:not(ul.dropdown li), nav.nav.nav--top ul li:not(ul.dropdown li):nth-child(1), nav.nav.nav--top ul li:not(ul.dropdown li):nth-child(4), ul.left ul:nth-child(4).dropdown.active li:nth-child(4), ul.left ul:nth-child(4).dropdown.active li:nth-child(7), ul.left ul:nth-child(4).dropdown.active li:nth-child(10), ul.left ul:nth-child(8).dropdown.active li:nth-child(10), ul.left ul:nth-child(8).dropdown.active li:nth-child(13), ul.left ul:nth-child(8).dropdown.active li:nth-child(16), ul.left ul:nth-child(8).dropdown.active li:nth-child(19), ul.left ul:nth-child(8).dropdown.active li:nth-child(22), ul.left ul:nth-child(8).dropdown.active li:nth-child(25){border-bottom: none;} ul.left ul:nth-child(8).dropdown.active li:nth-child(31), ul.left ul:nth-child(8).dropdown.active li:nth-child(34), ul.left ul:nth-child(8).dropdown.active li:nth-child(37), ul.left ul:nth-child(8).dropdown.active li:nth-child(40), ul.left ul:nth-child(8).dropdown.active li:nth-child(43), ul.left ul:nth-child(12).dropdown.active li:nth-child(10), ul.left ul:nth-child(12).dropdown.active li:nth-child(13), ul.left ul:nth-child(12).dropdown.active li:nth-child(16), ul.left ul:nth-child(12).dropdown.active li:nth-child(19), ul.left ul:nth-child(12).dropdown.active li:nth-child(22), ul.left ul:nth-child(12).dropdown.active li:nth-child(25), ul.left ul:nth-child(12).dropdown.active li:nth-child(28), ul.left ul:nth-child(12).dropdown.active li:nth-child(31), ul.left ul:nth-child(12).dropdown.active li:nth-child(34), ul.left ul:nth-child(12).dropdown.active li:nth-child(37), ul.left ul:nth-child(12).dropdown.active li:nth-child(40), ul.left ul:nth-child(12).dropdown.active li:nth-child(43), ul.left ul:nth-child(12).dropdown.active li:nth-child(46), ul.left ul:nth-child(12).dropdown.active li:nth-child(49), ul.left ul:nth-child(12).dropdown.active li:nth-child(52){grid-column: 2/3; border-left: 1px solid #e5e5e5; border-bottom: none;} ul.left ul:nth-child(8).dropdown.active li:nth-child(10), ul.left ul:nth-child(8).dropdown.active li:nth-child(13), ul.left ul:nth-child(8).dropdown.active li:nth-child(16), ul.left ul:nth-child(8).dropdown.active li:nth-child(19), ul.left ul:nth-child(8).dropdown.active li:nth-child(22), ul.left ul:nth-child(8).dropdown.active li:nth-child(25), ul.left ul:nth-child(8).dropdown.active li:nth-child(28), ul.left ul:nth-child(12).dropdown.active li:nth-child(58){grid-column: 1/3;} ul.left ul:nth-child(8).dropdown.active li:nth-child(37), ul.left ul:nth-child(8).dropdown.active li:nth-child(43), ul.left ul:nth-child(12).dropdown.active li:nth-child(4), ul.left ul:nth-child(12).dropdown.active li:nth-child(34), ul.left ul:nth-child(12).dropdown.active li:nth-child(52), ul.left ul:nth-child(12).dropdown.active li:nth-child(58){border-bottom: 1px solid #e5e5e5;} ul.left ul:nth-child(12).dropdown.active li:nth-child(55){display: none;} ul.left ul.dropdown.active li a{font-weight: 700!important;} ul.left li:not(.has-dropdown.open) a, nav ul li a span, nav ul li button span{font-weight: 500!important;} } /* END Nav bar - Mobile view */ /* --- END navigation bar --- */ /* --- SPACING - PADDING IN WIDGETS --- */ .widget.widget--featured-content.widget--featured-content_multi-carousel{ padding-bottom: 0!important; } /* KEEP .widget--featured-content */ @media only screen and (min-width: 64.063em){ /* .widget:not( .widget--course-purchase.widget--course-purchase_standard, .widget--course-social.widget--course-social_standard, .widget--course-benefits.widget--course-benefits_standard, .widget--hero-image.widget--hero-image_standard, .widget--learning-path-purchase.widget--learning-path-purchase_standard, .widget--navbar.widget--navbar_standard, .widget--topic-article-content.widget--topic-article-content_standard, .widget--discount-group-purchase, .widget--learning-path-content-hero.widget--learning-path-content-hero_title-text, .widget--milestones.widget--milestones_standard, .widget-rolenavbar, .widget--course-related.widget--course-related_standard){ padding: 50px 100px 20px!important; }*/ .widget.widget--featured-content.widget--featured-content_standard, .widget.widget--featured-content.widget--featured-content_multi-carousel, .widget.widget--featured-content.widget--featured-content_multi-carousel.widget--featured-contentmulti-carousel-no-cards, .widget.widget--testimonial.widget--testimonial_standard, .widget.widget--one-column.widget--one-column_standard, .widget.widget--two-column.widget--two-column_standard{ padding: 50px 100px 20px; } } /* KEEP featured-content-multi-carousel */ @media only screen and (min-width: 64.063em) { .widget.widget--featured-content.widget--featured-content_standard, .widget.widget--featured-content.widget--featured-content_multi-carousel, .widget.widget--featured-content.widget--featured-content_multi-carousel.widget--featured-contentmulti-carousel-no-cards, .widget.widget--testimonial.widget--testimonial_standard, .widget.widget--one-column.widget--one-column_standard, .widget.widget--two-column.widget--two-column_standard, .topic__container.topic__container__article { padding: 50px 100px 20px !important; } } /* SNK- featured-content-multi-carousel */ /* REMOVE widget content .featured-content-multi-carousel { margin: -8px; padding: 8px }*/ @media only screen and (min-width: 48.063em) and (max-width:64em) { .featured-content-multi-carousel .featured-content-block-grid.medium-block-grid-4 .catalog-grid-item__completed,.featured-content-multi-carousel .featured-content-block-grid.medium-block-grid-5 .catalog-grid-item__completed { top:53% } .featured-content-multi-carousel .featured-content-block-grid.medium-block-grid-4 .catalog-grid-item__completed .icon-check,.featured-content-multi-carousel .featured-content-block-grid.medium-block-grid-5 .catalog-grid-item__completed .icon-check { border-width: 10px; font-size: 25px } .featured-content-multi-carousel .featured-content-block-grid.medium-block-grid-4 .catalog-grid-item__completed p,.featured-content-multi-carousel .featured-content-block-grid.medium-block-grid-5 .catalog-grid-item__completed p { margin-top: -10px } } /* REMOVE widget content > li > a > img .featured-content-multi-carousel-item img { padding-left: 0; padding-right: 0 }*/ /* REMOVE .featured-content-multi-carousel-item__title */ .featured-content-multi-carousel-item__title { /* margin-bottom: 1.5rem; */ text-align: left } .featured-content-multi-carousel-item__description { font-weight: 400; margin-top: 0; padding: 0 } .featured-content-multi-carousel-item__body { /* padding: 32px 0 0; remove this */ padding: 32px 24px 24px } /* REMOVE widget content > li > a > img .catalog-grid-item__asset-container img { padding-top: 0 }*/ /* REMOVE .featured-content-multi-carousel-item__title .featured-content-multi-carousel-item__title { margin-bottom: 4px } */ /* REMOVE .featured-content-multi-carousel-item__source { margin-bottom: 0; text-align: left }*/ .featured-content-multi-carousel-item__source strong { font-weight: 300 } /* REVIEW (comment) .featured-content-multi-carousel__nav-left,.featured-content-multi-carousel__nav-right { color: transparent!important; margin-top: -32px }*/ @media only screen and (max-width: 64em) { .featured-content-multi-carousel__nav-left,.featured-content-multi-carousel__nav-right { display:none } } /* REMOVE arrow buttons .featured-content-multi-carousel__nav-left,.featured-content-multi-carousel__nav-left i:before,.featured-content-multi-carousel__nav-right,.featured-content-multi-carousel__nav-right i:before { height: 64px; width: 24px }*/ /* REVIEW (comment) .featured-content-multi-carousel__nav-left i,.featured-content-multi-carousel__nav-right i { font-size: 64px } */ /* KEEP arrow buttons */ .featured-content-multi-carousel__nav-left i:before,.featured-content-multi-carousel__nav-right i:before { background-repeat: no-repeat; display: inline-block } /* REVIEW (comment) .featured-content-multi-carousel__nav-right { right: -48px }*/ /* KEEP arrow buttons */ .featured-content-multi-carousel__nav-right i:before { background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg width='24' height='64' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='m5.994 44 10.303-10.303a2.4 2.4 0 0 0 0-3.394L5.994 20' stroke='%23000' stroke-width='2' stroke-linecap='round'/%3E%3C/svg%3E") } .featured-content-multi-carousel__nav-right:hover i:before { background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg width='24' height='64' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='m5.994 44 10.303-10.303a2.4 2.4 0 0 0 0-3.394L5.994 20' stroke='%230029FF' stroke-width='2' stroke-linecap='round'/%3E%3C/svg%3E") } .featured-content-multi-carousel__nav-left { left: -48px } .featured-content-multi-carousel__nav-left i:before { background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg width='24' height='64' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M17 44 6.697 33.697a2.4 2.4 0 0 1 0-3.394L17 20' stroke='%23000' stroke-width='2' stroke-linecap='round'/%3E%3C/svg%3E") } .featured-content-multi-carousel__nav-left:hover i:before { background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg width='24' height='64' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M17 44 6.697 33.697a2.4 2.4 0 0 1 0-3.394L17 20' stroke='%230029FF' stroke-width='2' stroke-linecap='round'/%3E%3C/svg%3E") } /* REMOVE widget content > li > a > div > content > item source .featured-content-multi-carousel-item__source,.featured-content-multi-carousel-item__start-date { color: #000 } */ @media only screen and (max-width: 48em) { .course__detail__content h1,.featured-content-image-overlay-item__title,.featured-content-multi-carousel-item__title,.h2.widget__title,.h3,.hero .hero__caption .widget__title.hero__title,.learn.account .header--subtitle h1,.learning-path-criterion__value-container,.user-engagement-stat__value-container,.widget--catalog .widget__alt-title__container h3,.widget--catalog.widget--catalog_standard .h2.widget__title,.widget__alt-title__container h3,h3 { font-size:26px; line-height: 36px } } /* REMOVE .course__detail__content @media only screen and (min-width: 48.063em) { .course__detail__content h1,.featured-content-image-overlay-item__title,.featured-content-multi-carousel-item__title,.h2.widget__title,.h3,.hero .hero__caption .widget__title.hero__title,.learn.account .header--subtitle h1,.learning-path-criterion__value-container,.user-engagement-stat__value-container,.widget--catalog .widget__alt-title__container h3,.widget--catalog.widget--catalog_standard .h2.widget__title,.widget__alt-title__container h3,h3 { font-size:36px; line-height: 49px } }*/ @media only screen and (max-width: 48em) { .catalog-grid-item__price,.catalog-list-item__info,.course__detail__header p,.enroll .contains,.enroll .interval,.enroll .srp,.featured-content-multi-carousel-item__description,.featured-content-multi-carousel-item__source,.learning-content-hero .w-full.py-0.px-10.absolute.left-0 h4,.learning-content-hero__caption h4,.modal-body .h3.ask__title,.session__container .order-confirmation .receipt-item__text p,form label { font-size:16px; line-height: 28px } } /* KEEP widget content > li > a > div > content > description */ @media only screen and (min-width: 48.063em) { .catalog-grid-item__price,.catalog-list-item__info,.course__detail__header p,.enroll .contains,.enroll .interval,.enroll .srp,.featured-content-multi-carousel-item__description,.featured-content-multi-carousel-item__source,.learning-content-hero .w-full.py-0.px-10.absolute.left-0 h4,.learning-content-hero__caption h4,.modal-body .h3.ask__title,.session__container .order-confirmation .receipt-item__text p,form label { font-size:17px; line-height: 30px } } /* REMOVE Featured Content Standard .catalog-grid-item,.featured-content-multi-carousel-item,.learning-path-detail-milestone-item,.learning-path-milestone-item:not(.learning-path-milestone-item--secondary) { border: 1px solid #000; background: #fff; filter: drop-shadow(0 0 0 #000000); transition: filter .1s ease,transform .1s ease; will-change: filter,transform; }*/ .widget--recent-content .featured-content-multi-carousel-item__description,.widget--recent-content .hr__accent { display: none } /* KEEP arrow buttons */ .directional__nav__button i:before,.featured-content-multi-carousel__nav-left i:before,.featured-content-multi-carousel__nav-right i:before,.layout__content--sidebar .course__detail__social .btn--social i:before,.search-bar-widget button .icon-search:before { transition: background-image .25s ease-in-out } /* SNK- widget--featured-content */ @media only screen and (max-width: 48em) { .h5,.learner-lesson__title,.learning-path-milestone-item.learning-path-milestone-item--secondary .learning-path-milestone-item__title h4,.session__container .order-confirmation .heading+p+p,.widget--featured-content .medium-block-grid-3 .catalog-grid-item__title,.widget--featured-content .medium-block-grid-4 .catalog-grid-item__title,h5 { font-size:18px; font-weight: 600; line-height: 30px } } @media only screen and (min-width: 48.063em) { .h5,.learner-lesson__title,.learning-path-milestone-item.learning-path-milestone-item--secondary .learning-path-milestone-item__title h4,.session__container .order-confirmation .heading+p+p,.widget--featured-content .medium-block-grid-3 .catalog-grid-item__title,.widget--featured-content .medium-block-grid-4 .catalog-grid-item__title,h5 { font-size:22px; font-weight: 700; line-height: 38px } } .widget--featured-content .hr__accent { display: none } /* REMOVE Featured Content Standard @media only screen and (min-width: 48.063em) { .widget--featured-content .featured-content-block-grid { margin-top:-64px } } */ @media only screen and (max-width: 48em) { .widget--featured-content .featured-content-block-grid>li:last-of-type { padding-bottom:0 } } /* REMOVE Featured Content Standard .widget--featured-content .catalog-grid-item { padding: 24px } */ .widget--featured-content .catalog-grid-item:hover .catalog-grid-item__description,.widget--featured-content .catalog-grid-item:hover .catalog-grid-item__title { color: var(--link-color) } /* REMOVE Featured Content Standard .widget--featured-content .catalog-grid-item__body { padding: 24px 0 0 }*/ .widget--featured-content .medium-block-grid-2 .catalog-grid-item__body { padding: 24px 24px 24px 0 } /* KEEP widget items > li > a > item > div */ .widget--featured-content .medium-block-grid-2 .catalog-grid-item>.row { display: flex } /* KEEP widget items > li > a > item > div > img */ .widget--featured-content .medium-block-grid-2 .catalog-grid-item img { -o-object-fit: cover; object-fit: cover } /* REMOVE widget content .widget--featured-content .medium-block-grid-3,.widget--featured-content .medium-block-grid-4 { margin-left: -1.5rem; margin-right: -1.5rem }*/ /* REVIEW (comment) .widget--featured-content .medium-block-grid-3>li,.widget--featured-content .medium-block-grid-4>li { padding-left: 1.5rem; padding-right: 1.5rem } @media only screen and (min-width: 48.063em) { .widget--featured-content .medium-block-grid-3>li,.widget--featured-content .medium-block-grid-4>li { padding-bottom:0; padding-top: 64px } }*/ .widget--featured-content .catalog-grid-item__cta-container { display: none } .widget--featured-content_carousel { background: #000 } .widget--featured-content_carousel.widget { padding-bottom: 32px; padding-top: 0 } .hero .hero__caption .widget--featured-content_carousel .widget__title.hero__title,.widget--featured-content_carousel .h2.widget__title,.widget--featured-content_carousel .hero .hero__caption .widget__title.hero__title,.widget--featured-content_carousel .hr__accent,.widget--featured-content_carousel .widget__alt-title__container { display: none } @media only screen and (max-width: 48em) { .widget--featured-content_carousel .featured-content-carousel { margin-left:-24px; margin-right: -24px } } /* REMOVE Featured Content Standard .widget--catalog .catalog-grid-item,.widget--featured-content .medium-block-grid-2 .catalog-grid-item { border: 1px solid #000 } */ .widget--catalog .catalog-grid-item__cta-container span.btn--link:after,.widget--featured-content .medium-block-grid-2 .catalog-grid-item__cta-container span.btn--link:after { background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg width='17' height='12' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath fill-rule='evenodd' clip-rule='evenodd' d='M16.75 5.973c0-.145-.034-.253-.103-.326-.034-.036-1.41-1.628-4.125-4.777-.069-.072-.172-.108-.31-.108-.137 0-.24.036-.309.108-.206.218-.206.435 0 .652l3.455 4.017H.662c-.275 0-.412.144-.412.434 0 .29.138.434.412.434h14.696l-3.455 4.017c-.206.217-.206.434 0 .651.206.217.413.217.619 0L16.647 6.3c.069-.073.103-.181.103-.326Z' fill='%230029FF'/%3E%3C/svg%3E"); background-repeat: no-repeat; content: ""; display: inline-block; height: 12px; margin-left: 8px; vertical-align: -1px; width: 17px } /*REVIEW (comment) .widget--featured-content_multi-carousel .small-12.columns>div.ember-view>div.ember-view+div.ember-view,.widget--featured-content_multi-carousel.widget--featured-contentmulti-carousel-no-cards>.row>.small-12>.ember-view>.ember-view { position: relative } */ .widget--featured-content_multi-carousel.widget--featured-contentmulti-carousel-no-cards .featured-content-multi-carousel ul li { padding-bottom: 99px; padding-top: 98px } .widget--featured-content_multi-carousel.widget--featured-contentmulti-carousel-no-cards .featured-content-multi-carousel .featured-content-block-grid { align-items: center; margin-top: 0 } .widget--featured-content_multi-carousel.widget--featured-contentmulti-carousel-no-cards .featured-content-multi-carousel .featured-content-block-grid .catalog-item,.widget--featured-content_multi-carousel.widget--featured-contentmulti-carousel-no-cards .featured-content-multi-carousel .featured-content-block-grid .featured-content-multi-carousel-item { height: auto } .widget--featured-content_multi-carousel.widget--featured-contentmulti-carousel-no-cards .featured-content-multi-carousel-item { background: none; border: none; display: flex; filter: none } .widget--featured-content_multi-carousel.widget--featured-contentmulti-carousel-no-cards .featured-content-multi-carousel-item:hover { filter: none; transform: none } .widget--featured-content_multi-carousel.widget--featured-contentmulti-carousel-no-cards .featured-content-multi-carousel-item:hover .featured-content-multi-carousel-item__source,.widget--featured-content_multi-carousel.widget--featured-contentmulti-carousel-no-cards .featured-content-multi-carousel-item:hover .featured-content-multi-carousel-item__title { color: var(--link-color) } .widget--featured-content_multi-carousel.widget--featured-contentmulti-carousel-no-cards .catalog-grid-item__asset-container { flex-shrink: 0; width: 100% } .widget--featured-content.widget--featured-content_article,.widget--title.widget--title_standard { padding: 1rem 24px } @media only screen and (min-width: 48.063em) and (max-width:64em) { .widget--featured-content.widget--featured-content_article,.widget--title.widget--title_standard { padding:1rem 32px } } @media only screen and (min-width: 64.063em) { .widget--featured-content.widget--featured-content_article,.widget--title.widget--title_standard { padding:1rem 100px } } /* REMOVE catalog-list-item .catalog-list-item__title,.collection__courses .center-ruled-title>span,.course__detail__content div:last-child.row .tab-title a,.dashboard-account .dashboard--content-panel .section__body .panel .subscription-name,.dashboard-account .dashboard--content-panel h4,.featured-content-multi-carousel-item__title,.h6,.learning-path-detail-milestone-item .learning-path-detail-milestone-item__title,.learning-path-milestone-item .learning-path-milestone-item__title h4,.session__container .subscription__confirmation,.testimonial .testimonial-quote__text,.widget--catalog .catalog-grid-item__title,.widget--featured-content .medium-block-grid-2 .catalog-grid-item__title,h6 { font-weight: var(--typography-font-weight); }*/ @media only screen and (max-width: 48em) { .catalog-list-item__title,.collection__courses .center-ruled-title>span,.course__detail__content div:last-child.row .tab-title a,.dashboard-account .dashboard--content-panel .section__body .panel .subscription-name,.dashboard-account .dashboard--content-panel h4,.featured-content-multi-carousel-item__title,.h6,.learning-path-detail-milestone-item .learning-path-detail-milestone-item__title,.learning-path-milestone-item .learning-path-milestone-item__title h4,.session__container .subscription__confirmation,.testimonial .testimonial-quote__text,.widget--catalog .catalog-grid-item__title,.widget--featured-content .medium-block-grid-2 .catalog-grid-item__title,h6 { font-size:16px; line-height: 28px } } /* REMOVE catalog-list-item @media only screen and (min-width: 48.063em) { .catalog-list-item__title,.collection__courses .center-ruled-title>span,.course__detail__content div:last-child.row .tab-title a,.dashboard-account .dashboard--content-panel .section__body .panel .subscription-name,.dashboard-account .dashboard--content-panel h4,.featured-content-multi-carousel-item__title,.h6,.learning-path-detail-milestone-item .learning-path-detail-milestone-item__title,.learning-path-milestone-item .learning-path-milestone-item__title h4,.session__container .subscription__confirmation,.testimonial .testimonial-quote__text,.widget--catalog .catalog-grid-item__title,.widget--featured-content .medium-block-grid-2 .catalog-grid-item__title,h6 { font-size:18px; line-height: 34px } } @media only screen and (max-width: 48em) { .catalog-list-item__description,.learning-path-detail-milestone-item .learning-path-detail-milestone-item__description,.learning-path-milestone-item .learning-path-milestone-item__description,.testimonial .testimonial-quote__author-description,.widget--catalog .catalog-grid-item__description,.widget--featured-content .medium-block-grid-2 .catalog-grid-item__description,.widget--featured-content .medium-block-grid-3 .catalog-grid-item__description,.widget--featured-content .medium-block-grid-4 .catalog-grid-item__description { font-size:14px; font-weight: 300; line-height: 24px } } @media only screen and (min-width: 48.063em) { .catalog-list-item__description,.learning-path-detail-milestone-item .learning-path-detail-milestone-item__description,.learning-path-milestone-item .learning-path-milestone-item__description,.testimonial .testimonial-quote__author-description,.widget--catalog .catalog-grid-item__description,.widget--featured-content .medium-block-grid-2 .catalog-grid-item__description,.widget--featured-content .medium-block-grid-3 .catalog-grid-item__description,.widget--featured-content .medium-block-grid-4 .catalog-grid-item__description { font-size:15px; line-height: 26px } }*/ /* Detail page*/ .home__content .course__detail__container .course__detail__sidebar .widget--one-column.widget--one-column_standard{ padding: 24px!important; } .layout__content .widget--html.widget--html_standard{ padding: 0 !important; } } /* SNK - .widget--html*/ .layout__content .widget--hero-image .hero,.layout__content .widget--html .hero { margin: 0 } .layout__content .widget--html { padding: 0 } /* --- SEARCH BAR widget --- */ .widget--searchbar{padding-top: 30px!important;padding-bottom: 50px!important;} .search-bar-widget form{display: flex;align-items: center;padding: 20px!important;} .search-bar-widget button{position: relative; height: 44px!important; } form input[type=text]{ margin-bottom: 0!important; } .search-bar-widget form button.btn--primary.btn--submit span{white-space: nowrap;} @media only screen and (min-width: 48.063em){ .search-bar-widget{ margin-top: 0!important; } .search-bar-widget input[type=text]{ padding: 0 40px 0 0!important; } } @media only screen and (max-width: 40em){ .search-bar-widget form button.btn--primary.btn--submit { margin-top: 0!important; width: unset!important; } .search-bar-widget form button.btn--primary.btn--submit i.icon-search{ margin-right: 0; } .search-bar-widget form button.btn--primary.btn--submit span{ display: none; } } /* SNK - SEARCH BAR widget --- */ .widget--searchbar { background: #000; padding-bottom: 32px!important; padding-top: 8px!important } @media only screen and (max-width: 40em) { .widget--searchbar { padding-left:24px!important; padding-right: 24px!important } } @media only screen and (min-width: 40.063em) and (max-width:64em) { .widget--searchbar { padding-left:32px!important; padding-right: 32px!important } } @media only screen and (min-width: 64.063em) { .widget--searchbar { padding-left:100px!important; padding-right: 100px!important } } @media only screen and (max-width: 48em) { .search-bar-widget { margin-bottom:8px; margin-top: 10px } } @media only screen and (min-width: 48.063em) { .search-bar-widget { margin-top:2em } } @media only screen and (min-width: 40.063em) { .search-bar-widget form { border-bottom:2px solid #fff } } .search-bar-widget input[type=text] { -webkit-font-smoothing: initial; color: #fff; font-family: Inter; font-size: 15px; font-weight: 700; height: auto; line-height: 28px } @media only screen and (max-width: 48em) { .search-bar-widget input[type=text] { padding:13px 20px } } @media only screen and (min-width: 48.063em) { .search-bar-widget input[type=text] { padding:13px 40px 29px } } .search-bar-widget input[type=text],.search-bar-widget input[type=text]:focus { background: transparent; border: none; border-radius: 0; box-shadow: none } @media only screen and (max-width: 40em) { .search-bar-widget input[type=text] { width:100% } .search-bar-widget input[type=text],.search-bar-widget input[type=text]:focus { border-bottom: 2px solid #fff } } .search-bar-widget button { border-radius: 23px!important; display: flex; flex-direction: row-reverse; height: auto; padding: 11px 40px!important; text-transform: none } @media only screen and (max-width: 40em) { .search-bar-widget button { justify-content:center; margin-top: 24px; position: relative; width: 100% } } .search-bar-widget button:hover .icon-search:before { background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg width='17' height='18' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M7.69.5a7.69 7.69 0 0 1 5.992 12.513l3.067 3.036a.846.846 0 0 1 .006 1.197l-.006.006a.864.864 0 0 1-1.215 0l-3.065-3.034A7.69 7.69 0 1 1 7.691.5Zm0 1.71a5.982 5.982 0 1 0 4.138 10.301.527.527 0 0 1 .055-.064l.006-.006.073-.062A5.982 5.982 0 0 0 7.69 2.209Z' fill='%230029FF'/%3E%3C/svg%3E") } .search-bar-widget button .icon-search { line-height: 20px; margin-right: 16px; order: 1; padding: 0 } .search-bar-widget button .icon-search:before { background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg width='17' height='18' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M7.69.5a7.69 7.69 0 0 1 5.992 12.513l3.067 3.036a.846.846 0 0 1 .006 1.197l-.006.006a.864.864 0 0 1-1.215 0l-3.065-3.034A7.69 7.69 0 1 1 7.691.5Zm0 1.71a5.982 5.982 0 1 0 4.138 10.301.527.527 0 0 1 .055-.064l.006-.006.073-.062A5.982 5.982 0 0 0 7.69 2.209Z' fill='%23fff'/%3E%3C/svg%3E"); color: transparent; display: inline-block; height: 18px; width: 17px } .widget--searchbar ::-webkit-input-placeholder { -webkit-font-smoothing: initial; color: grey; font-family: Inter; font-size: 15px; font-style: normal; font-weight: 700 } .widget--searchbar ::-moz-placeholder { -webkit-font-smoothing: initial; color: grey; font-family: Inter; font-size: 15px; font-style: normal; font-weight: 700 } .widget--searchbar :-ms-input-placeholder { -webkit-font-smoothing: initial; color: grey; font-family: Inter; font-size: 15px; font-style: normal; font-weight: 700 } .widget--searchbar :-moz-placeholder { -webkit-font-smoothing: initial; color: grey; font-family: Inter; font-size: 15px; font-style: normal; font-weight: 700 } /* --- CONTENT-CAROUSEL --- */ @media only screen and (min-width: 48.063em){ .featured-content-carousel__container { padding-bottom: 0!important; } } /* --- FEATURED CONTENT --- */ .widget--featured-content_multi-carousel.widget--featured-contentmulti-carousel-no-cards .featured-content-multi-carousel ul li{ padding-top: 50px!important; } /* KEEP widget content */ @media only screen and (min-width: 40.063em){ .widget--featured-content .featured-content-block-grid { margin-top: 0px; } /* KEEP widget content */ .widget--featured-content .medium-block-grid-3>li, .widget--featured-content .medium-block-grid-4>li { padding-top: 0; padding-bottom: 30px; } } /* --- TO REVIEW - CATALOG? --- */ /* --- CATALOG WIDGET --- */ .widget--catalog .row{margin:0;} .widget--catalog .row .medium-12.columns{padding-left: 0; padding-right: 0;} /* SNK - CATALOG WIDGET */ /* KEEP widget items */ .featured-content-default-grid ul[class*=block-grid-],.widget--catalog ul[class*=block-grid-] { display: flex; flex-wrap: wrap } /* KEEP widget items > li > a */ .featured-content-default-grid ul[class*=block-grid-]>li .catalog-grid-item,.featured-content-default-grid ul[class*=block-grid-]>li>a,.widget--catalog ul[class*=block-grid-]>li .catalog-grid-item,.widget--catalog ul[class*=block-grid-]>li>a { height: 100% } .widget--catalog [class*=block-grid-]>li { padding-bottom: 20px } .widget--catalog .catalog-grid-item { box-shadow: 0 4px 0 var(--accent-color); will-change: filter,transform,box-shadow } .widget--catalog .catalog-grid-item:hover { box-shadow: none } .widget--catalog .catalog-grid-item:hover .catalog-grid-item__source,.widget--catalog .catalog-grid-item:hover .catalog-grid-item__title { color: var(--link-color) } .widget--catalog .catalog-grid-item>.row { display: flex; flex-direction: column; height: 100% } .widget--catalog .catalog-grid-item>.row>.column:nth-child(2) { flex: 1 } .widget--catalog .catalog-grid-item__body { display: flex; flex-direction: column; height: 100%; padding: 32px 24px 24px } @media only screen and (max-width: 48em) { .widget--catalog .catalog-grid-item__body { padding-bottom:43px } } .widget--catalog .catalog-grid-item__asset { padding: 0 } .widget--catalog .catalog-grid-item__title { margin-bottom: 4px } .widget--catalog .catalog-grid-item__cta-container { margin-top: auto } @media only screen and (max-width: 48em) { .widget--catalog .js-results-holder ul { padding-top:48px } } .widget--catalog .hr__accent { display: none } @media only screen and (min-width: 64.063em) { .home.catalog .widget--catalog { padding-top:96px!important } } /* SNK - .featured-content */ .featured-content-image-overlay-item__overlay { padding: 2rem 0 0 } .featured-content-image-overlay-item__title { margin-bottom: 0; padding: 0 } @media only screen and (min-width: 48.063em) { .featured-content-carousel__container { padding-bottom:74px } } .featured-content-carousel-item { display: grid; height: 528px } @media only screen and (max-width: 48em) { .featured-content-carousel-item { height:auto } } .featured-content-carousel-item picture { grid-area: 1/-1; position: static } @media only screen and (max-width: 48em) { .featured-content-carousel-item picture { grid-row:1/2 } } .featured-content-carousel-item img { height: 528px; -o-object-fit: contain; object-fit: contain } @media only screen and (max-width: 48em) { .featured-content-carousel-item img { height:auto } } .featured-content-carousel-item__overlay { background: none; display: flex; flex-direction: column; grid-area: 1/-1; justify-content: flex-end; padding: 0; position: relative } @media only screen and (max-width: 48em) { .featured-content-carousel-item__overlay { grid-row:2/3; padding-left: 24px; padding-right: 24px } } @media only screen and (min-width: 48.063em) { .featured-content-carousel-item__overlay { max-width:66%; top: 52px } } .featured-content-carousel-item__title { margin-bottom: 24px } @media only screen and (max-width: 48em) { .featured-content-carousel-item__title { margin-bottom:16px } } .featured-content-carousel-item__description { font-family: Inter; font-size: 17px; font-weight: 300; line-height: 30px; margin-top: 0 } .featured-content-carousel__dots { bottom: 0 } @media only screen and (max-width: 48em) { .featured-content-carousel__dots { margin-top:17px; position: relative } } .featured-content-carousel__dot { height: 8px; width: 8px } .featured-content-carousel__dot:not(.featured-content-carousel__dot--active) { background: #e5e5e5 } .featured-content-carousel__nav { bottom: 24px; display: flex; right: 1rem } @media only screen and (max-width: 48em) { .featured-content-carousel__nav { display:none } } .featured-content-carousel__nav button { border-radius: 0!important; border-width: 2px; height: 3rem; margin-bottom: 0!important; margin-left: 1rem; padding: 0!important; width: 3rem } .featured-content-carousel__nav button>i { font-size: 1.563rem; padding: 0 } .featured-content-carousel__nav button.disabled { background: #333; border-color: #333; opacity: 1 } .featured-content-carousel__nav button.disabled i { color: #fff; opacity: .2 } @media only screen and (max-width: 64em) { .widget--recent-content .featured-content-sidebar { display:none } } /* Search Bar */ .widget--catalog .row .medium-12.columns .catalog-search-bar{margin-top: 0; margin-bottom: 20px; height: unset;} .widget--catalog .catalog-search-bar .catalog-filters{display: grid; grid-template-columns: 82% 18%; background: unset; border: unset;} .widget--catalog .catalog-filters input, .widget--catalog .catalog-filters form button, .widget--catalog .catalog-filters form button i, .widget--catalog .catalog-filters .columns{padding: unset;} .widget--catalog .catalog-filters__search, .widget--catalog .catalog-filters__sort{border: 1px solid #000000;} .widget--catalog .catalog-filters form{display: flex; align-items: center; padding: 0 20px;} .widget--catalog .catalog-filters form button{margin:unset; position: unset;} .widget--catalog .catalog-display-type{padding: unset; display: none;} .widget--catalog .catalog-display-type button{height: unset; width: unset;} .widget--catalog .catalog-filters .catalog-filters__selections{grid-area:2/1/3/3; border: unset; margin-top:10px;} .widget--catalog .catalog-filters__search, .widget--catalog .catalog-filters__sort, .widget--catalog .catalog-filters__selections, .widget--catalog .catalog-filters__selections .catalog-active-filters{width: unset;} .widget--catalog .catalog-filters__sort{display: flex;} .widget--catalog .catalog-filters__sort select#sort-options{height: unset!important; margin: unset; padding: 0 .5em!important;} .catalog-filters__selections, .catalog-filters__sort{font-style: normal!important;} .widget--catalog span.catalog-active-filter{margin: unset; padding: unset;} .widget--catalog span.catalog-active-filter .catalog-active-filter__remove{margin: unset; display: block; color: #0029ff; border-color: #0029ff; line-height: 24px;} /* END Search Bar */ /* SNK - CATALOG */ .catalog-header { display: none } .catalog-search-bar { margin-bottom: 40px } @media only screen and (max-width: 48em) { .catalog-search-bar { margin-bottom:38px; overflow: auto } } @media only screen and (min-width: 48.063em) { .catalog-search-bar { height:2.875rem; margin-top: 25px } } .catalog-search-bar .columns { margin-bottom: 0 } @media only screen and (max-width: 48em) { .catalog-search-bar .columns { margin-bottom:10px } } @media only screen and (min-width: 48.063em) { .catalog-filters { border:1px solid #000 } .catalog-filters__search,.catalog-filters__selections,.catalog-filters__sort { height: 2.75rem!important } } .catalog-filters__search input,.catalog-filters__selections select,.catalog-filters__sort select { color: #000; font-family: Inter; font-size: 17px; font-weight: 300; line-height: 30px } @media only screen and (max-width: 48em) { .catalog-filters__search { border:1px solid #000; height: 2.875rem } .catalog-filters__search input { border: 0; box-shadow: none; height: 38px; margin: 0 } } .catalog-filters__search input:focus { box-shadow: none } .catalog-filters__selections,.catalog-filters__sort { font-style: italic } @media only screen and (max-width: 48em) { .catalog-filters__selections,.catalog-filters__sort { border:1px solid #000; width: calc(100% - 133px) } .catalog-filters__selections select,.catalog-filters__sort select { background-color: transparent; border: 0; height: 100% } .catalog-filters__sort { height: 2.875rem } } @media only screen and (min-width: 48.063em) { .catalog-filters__sort { border-left:2px solid #000 } } @media only screen and (max-width: 48em) { .catalog-filters__selections>.row,.catalog-filters__selections>.row .catalog-content-type { height:100% } } .catalog-filters__selections .catalog-active-filters { margin-bottom: 0 } .catalog-active-filter { padding: 11px 0 } .catalog-active-filter__remove { border: 1px solid #000; border-radius: 23px; color: #000; font-style: normal; font-weight: 600; margin-bottom: -8px; margin-top: -8px; padding: 8px 12px!important } .catalog-active-filter__remove i { margin-right: 8px } .catalog-display-type button,.catalog-display-type button.btn--primary { border: 1px solid #000 } @media only screen and (max-width: 48em) { .catalog-display-type { padding-right:0 } } .catalog-display-type button { color: #e5e5e5; height: 2.875rem; width: 2.875rem } .catalog-display-type button:active,.catalog-display-type button:focus { background: transparent } @media only screen and (max-width: 48em) { .catalog-display-type button { background:transparent; border-radius: 0; margin-bottom: 0!important; padding: 0 } .catalog-display-type button.btn--primary { color: #000 } .catalog-display-type button i { font-size: 1.375rem; padding: 0 } } .catalog-aggregation__expander i.icon-navigatedown,.catalog-search__button i.icon-search { color: var(--accent-color) } .catalog-aggregation { border-top: 1px solid #000; padding: 8px } .catalog-aggregation--expanded { background-color: #f5f6f6; border: none; margin-bottom: .5em!important } .catalog-aggregation--expanded .catalog-aggregation__header { margin-bottom: 1em!important } .catalog-aggregation--expanded .catalog-aggregation__header--label,.catalog-aggregation--expanded .catalog-aggregation__header--label:hover { color: var(--accent-color) } .catalog-aggregation--expanded>ul>li.ember-view { margin-bottom: 8px; padding-right: 1em } .catalog-aggregation--expanded>ul>li.ember-view:last-of-type { margin-bottom: 0 } .catalog-aggregation__expander { font-size: 1rem; line-height: 29px; margin-left: .75em } .catalog-aggregation__expander i.icon-navigateright { color: #000 } .catalog-aggregation__header { color: #000; margin-bottom: 8px } .catalog-aggregation__header>.row>.column.small-1,.catalog-aggregation__header>.row>.column.small-11 { width: auto } .catalog-aggregation__header>.row>.column.small-11 { float: left } .catalog-aggregation__header--label { font-family: Inter; font-size: 17px; font-weight: 700; line-height: 30px; padding-left: .875em } .catalog-aggregation__header--label:hover { color: #000 } .btn.catalog-aggregation__value { border: none; color: #000; font-size: 17px; font-weight: 300; line-height: 30px; margin: 0; padding: 0 0 0 2.75em } .btn.catalog-aggregation__value:hover,.btn.catalog-aggregation__value:hover .catalog-aggregation__count { color: var(--accent-color) } .catalog-aggregation__count { color: #000; font-size: 1.063rem; font-weight: 300 } .catalog-filters__search ::-webkit-input-placeholder { color: #000; font-family: Inter; font-size: 17px; font-style: italic; font-weight: 300; line-height: 30px } .catalog-filters__search ::-moz-placeholder { color: #000; font-family: Inter; font-size: 17px; font-style: italic; font-weight: 300; line-height: 30px } .catalog-filters__search :-ms-input-placeholder { color: #000; font-family: Inter; font-size: 17px; font-style: italic; font-weight: 300; line-height: 30px } .catalog-filters__search :-moz-placeholder { color: #000; font-family: Inter; font-size: 17px; font-style: italic; font-weight: 300; line-height: 30px } /* DELETE PADDING .home.catalog .widget,.home.redeem .widget,.home.register .widget,.home.support .widget,.layout__content .widget:not(.widget--bundle-purchase):not(.widget--discount-group-purchase):not(.widget--course-purchase):not(.widget--course-social):not(.widget--course-related),.learn.account .header--subtitle,.learn.dashboard .widget,.learn.transcript .widget { padding: 24px }*/ @media only screen and (min-width: 48.063em) and (max-width:64em) { .home.catalog .widget,.home.redeem .widget,.home.register .widget,.home.support .widget,.layout__content .widget:not(.widget--bundle-purchase):not(.widget--discount-group-purchase):not(.widget--course-purchase):not(.widget--course-social):not(.widget--course-related),.learn.account .header--subtitle,.learn.dashboard .widget,.learn.transcript .widget { padding:24px 32px } } /* DELETE PADDING @media only screen and (min-width: 64.063em) { .home.catalog .widget,.home.redeem .widget,.home.register .widget,.home.support .widget,.layout__content .widget:not(.widget--bundle-purchase):not(.widget--discount-group-purchase):not(.widget--course-purchase):not(.widget--course-social):not(.widget--course-related),.learn.account .header--subtitle,.learn.dashboard .widget,.learn.transcript .widget { padding:70px 100px } } */ @media only screen and (max-width: 48em) { .catalog-grid-item__source,.footer__company__info,.footer__company__name,.footer__links .link,.learning-path-detail-milestone-item .learning-path-detail-milestone-item__content-type,.learning-path-milestone-item .learning-path-milestone-item__info { font-size:14px; line-height: 24px } } @media only screen and (min-width: 48.063em) { .catalog-grid-item__source,.footer__company__info,.footer__company__name,.footer__links .link,.learning-path-detail-milestone-item .learning-path-detail-milestone-item__content-type,.learning-path-milestone-item .learning-path-milestone-item__info { font-size:17px; line-height: 30px } } /* KEEP */ @media only screen and (min-width: 64.063em) { .home.catalog .widget--recent-content { padding-top:6px; } } /* REVIEW .catalog-aggregation__count .catalog-aggregation__count,.directional__nav__button,.nav--top ul a,body:not(.manager) .subscription__cancel-button,body:not(.manager) .subscription__confirm-cancellation,body:not(.manager) .subscription__revert-cancellation { transition-duration: .25s; transition-property: background-color,border-color,color,opacity; transition-timing-function: ease-in-out }*/ @media only screen and (max-width: 48em) { .catalog .hero .hero__caption { padding-bottom:64px; padding-top: 64px } } /* REMOVE Featured Content Standard .featured-content-default-grid .catalog-grid-item__asset-container { border-bottom: 1px solid #000; padding-bottom: 32px; padding-top: 32px } */ .featured-content-default-grid .catalog__ribbon--attached .catalog__ribbon-corner { display: none } /* KEEP widget items > li > a > item > div > img */ .catalog-grid-item__asset-container--split { padding: 0 } /* KEEP widget items > li > a > item > div > content > source & description */ .catalog-grid-item__source { margin-bottom: 16px } .catalog-grid-item__source,.catalog-grid-item__source>strong { font-weight: 400 } /* REMOVE Catalog grid .catalog-grid-item__cta-container,.catalog-grid-item__description,.catalog-grid-item__title { height: auto!important }*/ /* REMOVE Catalog grid .catalog-grid-item__title { font-family: Poppins; font-style: normal } */ .catalog-grid-item__description { /* font-style: normal; comment font-weight: 400;*/ padding-top: 0; font-size: var(--typography-paragraph-font-size-M); } /* REMOVE Featured Content Standard*/ .catalog-grid-item__hr { display: none } .catalog-grid-item__price { float: left; font-weight: 300 } .catalog-grid-item__cta-container { height: auto } .catalog-grid-item__cta-container span.btn--link { clear: both; float: left; margin-top: 36px } @media only screen and (max-width: 48em) { .catalog-grid-item__cta-container span.btn--link { margin-top:28px } } .catalog-grid-item__cta-container span.btn--link.btn--primary:hover { color: var(--link-color) } .catalog-grid-item__cta-container-with-queue,.catalog-grid-item__cta-container-with-queue span { display: block } /* KEEP widget items > li > a > item > ribbon */ .catalog__ribbon { font-size: 15px; font-weight: 600; line-height: 20px; padding: 4px 8px } /* KEEP widget items > li > a > item > ribbon */ .catalog__ribbon[style="color: #111; background-color: #ffffff"] { border: 1px solid #000; color: #000; } /* REVIEW CON EL DE ARRIBA widget items > li > a > item > ribbon .catalog__ribbon[style="color: #111; background-color: #ffffff"] .catalog__ribbon-corner { border-left-color: #000!important; border-top-color: #000!important; right: -1px }*/ /* KEEP widget items > li > a > item > ribbon */ .catalog__ribbon--attached { right: -9px; text-transform: uppercase; top: 10px } .catalog-grid-item__completed .icon-check { background-color: var(--accent-color); border-color: rgba(0,41,255,.13); border-width: 15px; color: transparent; position: relative } .catalog-grid-item__completed .icon-check:before { background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg width='15' height='12' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath fill-rule='evenodd' clip-rule='evenodd' d='m5.141 11.25 9.734-9.727L13.726.375 5.141 8.974 1.754 5.589.625 6.737l4.516 4.513Z' fill='%23fff'/%3E%3C/svg%3E"); background-repeat: no-repeat; height: 12px; left: 50%; position: absolute; top: 50%; transform: translate(-50%,-50%); width: 15px } .catalog-grid-item__completed p { color: var(--accent-color); font-size: 14px; font-weight: 700; line-height: 24px; margin: 0; padding: 0 } /*REVIEW BUTTONS */ body:not(.manager) .btn--alt,body:not(.manager) .btn--bare:not(.catalog-aggregation__value),body:not(.manager) .btn--primary,body:not(.manager) .btn--primary--manager--new,body:not(.manager) .btn--submit,body:not(.manager) .btn--success-new,body:not(.manager) .subscription__cancel-button,body:not(.manager) .subscription__confirm-cancellation,body:not(.manager) .subscription__revert-cancellation { /*border-radius: 23px; <- COMMENT, TO DELETE */ padding: 12px 34px } body:not(.manager) .btn--link:not(.catalog-aggregation__header) { color: var(--link-color) } /*KEEP AND COMMENT */ .builder__mini-widget,.catalog-grid-item__description,.catalog-grid-item__source,.catalog-list-item__description,.course__detail__enrolled,.course__detail__social,.example-widget,.multiselect,.panel,.panel--flex,.panel--logs,.topic__sidebar__add { /* border-radius: 0; comment */ color: #000 } .catalog-list-item { border: 1px solid #000; margin-bottom: 3rem; position: relative } @media only screen and (max-width: 40em) { .catalog-list-item__title-container,.learning-path-detail-milestone-item>.row:first-child,.learning-path-milestone-item:not(.learning-path-milestone-item--secondary) .learning-path-milestone-item__title { padding:188px 24px 0; width: 100% } } @media only screen and (min-width: 40.063em) { .catalog-list-item__title-container,.learning-path-detail-milestone-item>.row:first-child,.learning-path-milestone-item:not(.learning-path-milestone-item--secondary) .learning-path-milestone-item__title { margin-left:50%; padding: 24px 24px 0 48px; width: 50% } .catalog-list-item__body>.row>.columns,.learning-path-detail-milestone-item>.row:nth-child(2)>.columns,.learning-path-milestone-item .learning-path-milestone-item__body>.row>.columns { width: 50% } } .catalog-list-item__body>.row>.medium-4.columns,.learning-path-detail-milestone-item>.row:nth-child(2)>.medium-4.columns,.learning-path-milestone-item .learning-path-milestone-item__body>.row>.medium-4.columns { height: 100%; position: absolute; top: 0 } @media only screen and (max-width: 40em) { .catalog-list-item__body>.row>.medium-4.columns,.learning-path-detail-milestone-item>.row:nth-child(2)>.medium-4.columns,.learning-path-milestone-item .learning-path-milestone-item__body>.row>.medium-4.columns { height:156px } } .catalog-list-item__body>.row>.medium-4.columns img,.learning-path-detail-milestone-item>.row:nth-child(2)>.medium-4.columns img,.learning-path-milestone-item .learning-path-milestone-item__body>.row>.medium-4.columns img { height: 100%; -o-object-fit: contain; object-fit: contain; padding: 0; width: 100% } .catalog-list-item__title-container .catalog__ribbon { top: 0 } .catalog-list-item__body { position: static } .catalog-list-item__body>.row>.medium-3.columns,.catalog-list-item__body>.row>.medium-5.columns,.catalog-list-item__body>.row>.medium-8.columns,.catalog-list-item__body>.row>.small-12.columns { float: none } @media only screen and (max-width: 40em) { .catalog-list-item__body>.row>.medium-3.columns,.catalog-list-item__body>.row>.medium-5.columns,.catalog-list-item__body>.row>.medium-8.columns,.catalog-list-item__body>.row>.small-12.columns { padding:0 24px } } @media only screen and (min-width: 40.063em) { .catalog-list-item__body>.row>.medium-3.columns,.catalog-list-item__body>.row>.medium-5.columns,.catalog-list-item__body>.row>.medium-8.columns,.catalog-list-item__body>.row>.small-12.columns { left:50%; padding: 0 48px } } .catalog-list-item__title { margin-bottom: 4px } .catalog-list-item__info { font-weight: 700; margin-top: 0 } .catalog-list-item__description { font-weight: 300; margin-top: 16px } .catalog-list-item__cta-container { border: none; margin-top: 0; padding-left: 0; padding-right: 0 } .catalog-list-item__price { text-align: left } .catalog-list-item__cta .btn { margin-left: 0 } .learning-path-milestone-item .learning-path-milestone-item__title .btn--primary.catalog-item { align-items: center; background: none!important; border: none; border-radius: 0; box-shadow: none; color: var(--link-color); display: flex; height: auto; padding: 0 } .learning-path-milestone-item .learning-path-milestone-item__title .btn--primary.catalog-item:after { background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg width='17' height='12' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath fill-rule='evenodd' clip-rule='evenodd' d='M16.75 5.973c0-.145-.034-.253-.103-.326-.034-.036-1.41-1.628-4.125-4.777-.069-.072-.172-.108-.31-.108-.137 0-.24.036-.309.108-.206.218-.206.435 0 .652l3.455 4.017H.662c-.275 0-.412.144-.412.434 0 .29.138.434.412.434h14.696l-3.455 4.017c-.206.217-.206.434 0 .651.206.217.413.217.619 0L16.647 6.3c.069-.073.103-.181.103-.326Z' fill='%230029FF'/%3E%3C/svg%3E"); background-repeat: no-repeat; content: ""; display: inline-block; height: 12px; margin-left: 8px; width: 17px } .learning-path-milestone-item .learning-path-milestone-item__title .btn--primary.catalog-item~br { display: none } .learning-path-milestone-item .learning-path-milestone-item__body .catalog-grid-item__completed-container { background: #fff } @media only screen and (max-width: 64em) { .home.catalog .widget--recent-content { padding-top:30px } } @media only screen and (min-width: 64.063em) { .home.catalog .widget--recent-content { padding-top:6px!important } } /* SNK -.course__detail */ .builder__mini-widget,.course__detail__enrolled,.course__detail__social,.example-widget,.multiselect,.panel--alt { border-color: #e5e5e5 } /* KEEP course__detail */ .course__detail__header { padding: 0 } /* KEEP course__detail */ .course__detail__header h1,.course__detail__header p { color: #000 } /* REMOVE course__detail .course__detail__header p { font-weight: 300 }*/ /* KEEP course__detail */ .course__detail__asset { margin-bottom: 32px; /* margin-top: 8px comment */ } @media only screen and (min-width: 48.063em) { .course__detail__asset { margin-top:32px } } /* KEEP course__detail */ .course__detail__asset picture img { border: 1px solid #000; box-shadow: 8px 8px 0 #000; width: 400px; } /* KEEP course__detail */ .course__detail__asset img { max-width: 100%; } /* KEEP course__detail */ @media only screen and (min-width: 64.063em) { .course__detail__asset picture img { max-width:50% } } /* REMOVE course__detail .course__detail__content { color: #000; display: flex; flex-direction: column }*/ /* KEEP course__detail */ .course__detail__content h1 { margin-bottom: 24px } /* KEEP Milestone */ .course__detail__content .collection__courses { order: 2 } /* REMOVE course__detail__assetlestone .course__detail__content>.row>.column .course__detail__asset { margin-left: -1rem; margin-right: -1rem }*/ /* KEEP course__detail */ .course__detail__content div:last-child.row { order: 1 } .course__detail__content div:last-child.row>.column { padding: 0 } /* REMOVE .course__detail__content div:last-child.row .tabs { border-color: #e5e5e5 }*/ /* KEEP course__detail */ .course__detail__content div:last-child.row .tab-title { margin-right: 32px; margin-top: 16px } .course__detail__content div:last-child.row .tab-title:after { border-bottom: 1px solid #e5e5e5; content: ""; display: block; height: 1px; position: absolute; width: 100% } @media only screen and (min-width: 48.063em) { .course__detail__content div:last-child.row .tab-title:after { width:calc(100% + 32px) } } .course__detail__content div:last-child.row .tab-title:last-of-type { margin-right: 0 } .course__detail__content div:last-child.row .tab-title>a>span { border-bottom: 4px solid transparent; display: inline-block; /* height: 40px comment */ } /* REMOVE course__detail .course__detail__content div:last-child.row .tab-title.active>a>span { border-color: var(--accent-color); display: inline-block } */ .course__detail__content div:last-child.row .tab-title a { background: none; /* border: none; color: #000; font-family: Poppins; padding: 0 comment */ } /* REMOVE course__detail .course__detail__content div:last-child.row .tabs-content { border: none; margin-bottom: 32px; padding-top: 48px }*/ @media only screen and (max-width: 48em) { .course__detail__content div:last-child.row .tabs-content { padding-top:24px } } .course__detail__content div:last-child.row .tabs-content>.content { padding: 0 } @media only screen and (max-width: 48em) { .course__detail__sidebar { margin-top:40px } } .layout__content--sidebar .course__detail__social { margin-bottom: 16px; margin-top: 8px } .layout__content--sidebar .course__detail__social .h6.heading--alt { font-family: Inter!important; margin-bottom: 10px } .layout__content--sidebar .course__detail__social>div { display: flex } .layout__content--sidebar .course__detail__social .btn--social { align-items: center; border: 1px solid #000; border-radius: 50%; display: inline-flex; height: 36px; justify-content: center; width: 36px } .layout__content--sidebar .course__detail__social .btn--social:not(:first-of-type) { margin-left: 20px } .layout__content--sidebar .course__detail__social .btn--social:hover { background: #000 } .layout__content--sidebar .course__detail__social .btn--social i { padding: 0 } .layout__content--sidebar .course__detail__social .btn--social i:before { background-repeat: no-repeat; color: transparent } .layout__content--sidebar .course__detail__social .btn--facebook i,.layout__content--sidebar .course__detail__social .btn--facebook i:before { height: 16px; width: 8px } .layout__content--sidebar .course__detail__social .btn--facebook i:before { background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg width='8' height='16' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath fill-rule='evenodd' clip-rule='evenodd' d='M1.614 3.099v2.203H0v2.694h1.614V16h3.315V7.996h2.225s.208-1.292.309-2.704H4.942V3.45c0-.275.361-.646.718-.646h1.807V0H5.01C1.53 0 1.614 2.696 1.614 3.099Z' fill='%23000'/%3E%3C/svg%3E") } .layout__content--sidebar .course__detail__social .btn--facebook:hover i:before { background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg width='8' height='16' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath fill-rule='evenodd' clip-rule='evenodd' d='M1.614 3.099v2.203H0v2.694h1.614V16h3.315V7.996h2.225s.208-1.292.309-2.704H4.942V3.45c0-.275.361-.646.718-.646h1.807V0H5.01C1.53 0 1.614 2.696 1.614 3.099Z' fill='%23fff'/%3E%3C/svg%3E") } .layout__content--sidebar .course__detail__social .btn--twitter i,.layout__content--sidebar .course__detail__social .btn--twitter i:before { height: 14px; width: 16px } .layout__content--sidebar .course__detail__social .btn--twitter i:before { background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg width='16' height='14' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath fill-rule='evenodd' clip-rule='evenodd' d='M16 1.539a6.546 6.546 0 0 1-1.885.517A3.291 3.291 0 0 0 15.558.24a6.568 6.568 0 0 1-2.085.796A3.283 3.283 0 0 0 7.88 4.03 9.32 9.32 0 0 1 1.114.6 3.281 3.281 0 0 0 2.13 4.984a3.27 3.27 0 0 1-1.487-.41v.041a3.285 3.285 0 0 0 2.633 3.219 3.288 3.288 0 0 1-1.482.056 3.286 3.286 0 0 0 3.066 2.28A6.586 6.586 0 0 1 0 11.527a9.29 9.29 0 0 0 5.032 1.475c6.038 0 9.34-5.002 9.34-9.34 0-.142-.004-.284-.01-.425A6.667 6.667 0 0 0 16 1.54' fill='%23000'/%3E%3C/svg%3E") } .layout__content--sidebar .course__detail__social .btn--twitter:hover i:before { background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg width='16' height='14' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath fill-rule='evenodd' clip-rule='evenodd' d='M16 1.539a6.546 6.546 0 0 1-1.885.517A3.291 3.291 0 0 0 15.558.24a6.568 6.568 0 0 1-2.085.796A3.283 3.283 0 0 0 7.88 4.03 9.32 9.32 0 0 1 1.114.6 3.281 3.281 0 0 0 2.13 4.984a3.27 3.27 0 0 1-1.487-.41v.041a3.285 3.285 0 0 0 2.633 3.219 3.288 3.288 0 0 1-1.482.056 3.286 3.286 0 0 0 3.066 2.28A6.586 6.586 0 0 1 0 11.527a9.29 9.29 0 0 0 5.032 1.475c6.038 0 9.34-5.002 9.34-9.34 0-.142-.004-.284-.01-.425A6.667 6.667 0 0 0 16 1.54' fill='%23fff'/%3E%3C/svg%3E") } .layout__content--sidebar .course__detail__social .btn--linkedin i,.layout__content--sidebar .course__detail__social .btn--linkedin i:before { height: 16px; width: 16px } .layout__content--sidebar .course__detail__social .btn--linkedin i:before { background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg width='16' height='16' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath fill-rule='evenodd' clip-rule='evenodd' d='M.204 15.289h3.43V4.973H.203v10.316ZM1.94 0C.768 0 0 .77 0 1.782c0 .99.746 1.783 1.896 1.783h.023c1.196 0 1.94-.793 1.94-1.783C3.836.77 3.115 0 1.941 0ZM16 9.374v5.915h-3.43v-5.52c0-1.386-.495-2.332-1.737-2.332-.947 0-1.511.638-1.76 1.255-.09.22-.113.527-.113.836v5.76H5.53s.046-9.347 0-10.315h3.43v1.462l-.022.033h.022v-.033c.456-.702 1.27-1.705 3.091-1.705C14.308 4.73 16 6.205 16 9.374Z' fill='%23000'/%3E%3C/svg%3E") } .layout__content--sidebar .course__detail__social .btn--linkedin:hover i:before { background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg width='16' height='16' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath fill-rule='evenodd' clip-rule='evenodd' d='M.204 15.289h3.43V4.973H.203v10.316ZM1.94 0C.768 0 0 .77 0 1.782c0 .99.746 1.783 1.896 1.783h.023c1.196 0 1.94-.793 1.94-1.783C3.836.77 3.115 0 1.941 0ZM16 9.374v5.915h-3.43v-5.52c0-1.386-.495-2.332-1.737-2.332-.947 0-1.511.638-1.76 1.255-.09.22-.113.527-.113.836v5.76H5.53s.046-9.347 0-10.315h3.43v1.462l-.022.033h.022v-.033c.456-.702 1.27-1.705 3.091-1.705C14.308 4.73 16 6.205 16 9.374Z' fill='%23fff'/%3E%3C/svg%3E") } .layout__content--sidebar .course__detail__social .btn--pinterest i,.layout__content--sidebar .course__detail__social .btn--pinterest i:before { height: 18px; width: 18px } .layout__content--sidebar .course__detail__social .btn--pinterest i:before { background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg width='18' height='18' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M10.228.084a9.001 9.001 0 0 0-4.83 17.166 6.98 6.98 0 0 1 .146-2.064c.167-.755 1.166-4.916 1.166-4.916a3.363 3.363 0 0 1-.291-1.419c0-1.336.771-2.333 1.73-2.333a1.2 1.2 0 0 1 1.208 1.357c0 .81-.52 2.035-.792 3.185a1.39 1.39 0 0 0 1.417 1.73c1.708 0 2.853-2.187 2.853-4.77 0-1.979-1.311-3.462-3.728-3.462A4.27 4.27 0 0 0 4.67 8.872a2.663 2.663 0 0 0 .584 1.773.432.432 0 0 1 .145.498c-.041.166-.145.56-.187.706a.318.318 0 0 1-.459.228c-1.245-.498-1.832-1.869-1.832-3.434 0-2.561 2.145-5.628 6.438-5.628 3.415 0 5.687 2.499 5.687 5.171 0 3.518-1.96 6.162-4.854 6.162a2.575 2.575 0 0 1-2.208-1.12s-.52 2.083-.623 2.478a7.223 7.223 0 0 1-.917 1.917 8.68 8.68 0 0 0 2.561.374 8.986 8.986 0 0 0 8.995-9A9 9 0 0 0 10.23.084l-.002-.001Z' fill='%23000'/%3E%3C/svg%3E") } .layout__content--sidebar .course__detail__social .btn--pinterest:hover i:before { background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg width='18' height='18' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M10.228.084a9.001 9.001 0 0 0-4.83 17.166 6.98 6.98 0 0 1 .146-2.064c.167-.755 1.166-4.916 1.166-4.916a3.363 3.363 0 0 1-.291-1.419c0-1.336.771-2.333 1.73-2.333a1.2 1.2 0 0 1 1.208 1.357c0 .81-.52 2.035-.792 3.185a1.39 1.39 0 0 0 1.417 1.73c1.708 0 2.853-2.187 2.853-4.77 0-1.979-1.311-3.462-3.728-3.462A4.27 4.27 0 0 0 4.67 8.872a2.663 2.663 0 0 0 .584 1.773.432.432 0 0 1 .145.498c-.041.166-.145.56-.187.706a.318.318 0 0 1-.459.228c-1.245-.498-1.832-1.869-1.832-3.434 0-2.561 2.145-5.628 6.438-5.628 3.415 0 5.687 2.499 5.687 5.171 0 3.518-1.96 6.162-4.854 6.162a2.575 2.575 0 0 1-2.208-1.12s-.52 2.083-.623 2.478a7.223 7.223 0 0 1-.917 1.917 8.68 8.68 0 0 0 2.561.374 8.986 8.986 0 0 0 8.995-9A9 9 0 0 0 10.23.084l-.002-.001Z' fill='%23fff'/%3E%3C/svg%3E") } /* SNK - .learn.account */ .learn.account .header--subtitle { margin-bottom: 0; padding-top: 24px } @media only screen and (min-width: 48.063em) and (max-width:64em) { .learn.account .header--subtitle { padding-top:1rem } } @media only screen and (min-width: 64.063em) { .learn.account .header--subtitle { padding-bottom:0; padding-top: 6rem } } .learn.account .header--subtitle hr { display: none } .learn.account .header--subtitle h1 { font-family: Poppins; margin-bottom: 0 } /* SNK - .nav--top */ .nav--top ul a:focus span,.nav--top ul a:hover span,body:not(.manager) .btn--alt:after,body:not(.manager) .btn--bare:after,body:not(.manager) .btn--link:after,body:not(.manager) .btn--primary--manager--new:after,body:not(.manager) .btn--primary:after,body:not(.manager) .btn--success-new:after,body:not(.manager) .subscription__cancel-button:after,body:not(.manager) .subscription__revert-cancellation:after { transition-duration: .25s; transition-timing-function: ease-in-out } /* REMOVE @media only screen and (min-width: 48.063em) { .header__inner .nav--top li .btn--bare span, .header__inner .nav--top li span, .top-bar-section ul li>a { color: #fff !important; } }*/ /* REMOVE .nav--top .nav--top { padding: 8px 0 } */ @media only screen and (max-width: 48em) { .nav--top { display:none } .nav--top ul { text-align: left } } /* REVIEW .nav--top @media only screen and (min-width: 48.063em) { .nav--top ul { display:flex; flex-direction: row-reverse; height: 50px } }*/ @media only screen and (max-width: 48em) { .nav--top ul a,.nav--top ul button { transition:none } } /* KEEP Manager button*/ .nav--top ul a { /* border: 1px solid #fff; border-radius: 23px!important; height: auto;*/ padding: 10px 20px; text-transform: none } @media only screen and (max-width: 48em) { .nav--top ul a { border:none } .nav--top ul a span { font-family: Inter; font-weight: 700 } } .nav--top ul a:focus,.nav--top ul a:hover { background-color: var(--accent-contrast-color)!important; border-color: var(--accent-color); color: var(--accent-color) } .nav--top ul a:focus span,.nav--top ul a:hover span { color: var(--accent-color)!important; transition-property: color } /* KEEP Basket button */ .nav--top #cart-button { /* border: none; font-size: 17px; font-weight: 700; line-height: 42px; margin-bottom: 0; margin-right: 16px;*/ padding: 0; text-transform: none } /* Side bar (tags) */ .widget--catalog .row .medium-12.columns .row .medium-3.columns{padding: 1em 0 1em 1em; width: 18%; border: 1px solid #000000; position: sticky; top: 120px; margin-bottom: 74px; max-height: 80vh; overflow-y: scroll;} .widget--catalog .row .medium-12.columns .row .medium-3.columns::-webkit-scrollbar{width: 8px; padding: 0;} .widget--catalog .catalog-aggregation{border-top: none;} .widget--catalog .catalog-aggregation.catalog-aggregation--expanded{background-color: transparent; } .widget--catalog .catalog-aggregation button{margin-bottom: 0!important; -webkit-transition-duration: unset; transition-duration: unset;} .widget--catalog .catalog-aggregation:hover button.catalog-aggregation__header div span{color: #0029ff;} .widget--catalog .catalog-aggregation button.catalog-aggregation__header .row.collapse{display: flex; flex-direction: row-reverse; justify-content: flex-end;} .widget--catalog .catalog-aggregation button.catalog-aggregation__header .catalog-aggregation__header--label{font-weight: 600;} .widget--catalog .catalog-aggregation button.catalog-aggregation__header .catalog-aggregation__header--label, .widget--catalog .catalog-aggregation ul li button.catalog-aggregation__value{padding-left: 0;} .widget--catalog .catalog-aggregation ul li:hover button.catalog-aggregation__value{font-weight: 600; color: #0029ff;} .widget--catalog .catalog-aggregation.catalog-aggregation--expanded ul li{padding-right: 0;} /* END Side bar (tags) */ /* Catalog */ .widget--catalog .row .medium-12.columns .row .medium-9.columns.js-results-holder{padding-left: 0; padding-right: 0; width: 82%;} .widget--catalog .row .medium-12.columns .row .medium-9.columns.js-results-holder ul.small-block-grid-1.large-block-grid-3.medium-block-grid-2{margin:0;} .widget--catalog .row .medium-12.columns .row .medium-9.columns.js-results-holder ul.small-block-grid-1.large-block-grid-3.medium-block-grid-2 li{padding-right: 0; width: 25%;} .widget--catalog .row .medium-12.columns .row .medium-9.columns.js-results-holder ul.small-block-grid-1.large-block-grid-3.medium-block-grid-2 li .row .column{padding-left: 0; padding-right: 0;} /* END Catalog */ /* Catalog ribbon spacing */ div.widget--featured-content_standard div.ember-view div.ember-view{margin-bottom: 0!important;} /* END catalog ribbon spacing */ /* Responsive*/ @media only screen and (min-width: 64em) and (max-width: 90em){ .widget--catalog .row .medium-12.columns .row .medium-3.columns{width: 22%;} .widget--catalog .row .medium-12.columns .row .medium-9.columns.js-results-holder{width: 78%;} .widget--catalog .row .medium-12.columns .row .medium-9.columns.js-results-holder ul.small-block-grid-1.large-block-grid-3.medium-block-grid-2 li{width: 33.333%;} } @media only screen and (min-width: 48.063em) and (max-width: 64em){ .widget--catalog .row .medium-12.columns .row .medium-3.columns{padding:1em; width: 27%;} .widget--catalog .row .medium-12.columns .row .medium-9.columns.js-results-holder{width: 73%;} .widget--catalog .row .medium-12.columns .row .medium-9.columns.js-results-holder ul.small-block-grid-1.large-block-grid-3.medium-block-grid-2 li{width: 50%;} } @media only screen and (max-width: 48.063em){ .widget--catalog .catalog-search-bar .catalog-filters{grid-template-columns: 70% 30%;} .widget--catalog .row .medium-12.columns .catalog-search-bar, .widget--catalog .catalog-filters__search, .widget--catalog .catalog-filters__sort{margin-bottom: 0!important;} .catalog-filters__sort select#sort-options{height: unset!important;} .widget--catalog .row .medium-12.columns .row .medium-9.columns.js-results-holder ul.small-block-grid-1.large-block-grid-3.medium-block-grid-2 li{width: 100%;} .widget--catalog .row .medium-12.columns .row .medium-3.columns{width: 100%; position: relative; display: flex; justify-content: space-between; max-height: unset; top: unset; padding: 0; float: none; margin-bottom:0;} .widget--catalog .row .medium-12.columns .row .medium-3.columns::-webkit-scrollbar{height: 6px;} .widget--catalog .catalog-aggregation{display: flex; flex-direction: column;} .widget--catalog .catalog-aggregation.catalog-aggregation--expanded{margin: 0!important; padding: 12px;} .widget--catalog .catalog-aggregation.catalog-aggregation--expanded ul li{text-wrap: nowrap;} .widget--catalog .row .medium-12.columns .row .medium-9.columns.js-results-holder{width: 100%;} body.catalog .widget--catalog.widget--catalog_standard .ember-view .row{ margin: 0; } body.catalog .catalog-search-bar { margin-bottom: 16px!important; } body.catalog .catalog-filters div.catalog-filters__sort.small-6.medium-2.columns{ width: 100%!important; } body.catalog .widget--catalog .ember-view .row .columns{ padding-left:0; padding-right:0; } .widget--catalog .js-results-holder ul { padding-top: 16px!important; margin: 0; } body.catalog .widget--catalog .ember-view .row .columns .ember-view .row .columns.js-results-holder ul li{ padding-left:0; padding-right:0; } body.catalog .widget--catalog .ember-view .row .columns .ember-view .row .columns.js-results-holder ul li a .catalog-grid-item .row .column{ padding-left:0; padding-right:0; } body.catalog ul.small-block-grid-1.large-block-grid-3.medium-block-grid-2 li a.catalog-item div.catalog-grid-item .row{ margin: 0; } body.catalog li a.catalog-item div.catalog-grid-item .row{ flex-direction: row!important; align-items: center; } body.catalog li a.catalog-item div.catalog-grid-item .row .column.medium-12:first-child{ width: 0.5%; height: 100%; display: flex; } body.catalog li a.catalog-item div.catalog-grid-item .row .column.medium-12 .catalog-grid-item__body{ padding-bottom: 32px; } body.catalog li a.catalog-item div.catalog-grid-item .row .column.medium-12 .catalog-grid-item__body .catalog-grid-item__source{ margin-bottom: 6px; } body.catalog li a.catalog-item div.catalog-grid-item .row .column.medium-12 .catalog-grid-item__body .featured-content-item__authors{ display: flex; align-items: center; line-height: 10px;} body.catalog li a.catalog-item div.catalog-grid-item .row .column.medium-12 .catalog-grid-item__body .featured-content-item__authors::before{ height: 15px; width: 15px; background-size: contain; } body.catalog li a.catalog-item div.catalog-grid-item .row .column.medium-12 .catalog-grid-item__asset-container{ display: none;} body.catalog li a.catalog-item div.catalog-grid-item .row .column.medium-12 .catalog-grid-item__body .catalog-grid-item__cta-container .grid.grid-cols-3.gap-2{ display: flex; flex-direction: column; gap: 0; } body.catalog li a.catalog-item div.catalog-grid-item .row .column.medium-12 .catalog-grid-item__body .catalog-grid-item__cta-container .grid.grid-cols-3.gap-2 .col-span-2 .grid.grid-rows-3.gap-2{ display: flex; flex-direction: column; } body.catalog li a.catalog-item div.catalog-grid-item .row .column.medium-12 .catalog-grid-item__body .catalog-grid-item__cta-container .grid.grid-cols-3.gap-2 .col-span-2 .grid.grid-rows-3.gap-2 .row-span-2{ margin-bottom: 10px; } body.catalog li a.catalog-item div.catalog-grid-item .row .column.medium-12 .catalog-grid-item__body .catalog-grid-item__cta-container .grid.grid-cols-3.gap-2 .place-self-top span.btn.btn--link.btn--right.btn--primary{ margin-top: 0; } /*pagination*/ .widget--catalog .pagination.flex.justify-between.mx-2.my-4.items-center.flex-wrap-reverse{justify-content: center;} .widget--catalog .pagination__controls-button.first-page, .widget--catalog .pagination__controls-button.last-page, .widget--catalog .pagination__controls.flex.justify-center .pagination__controls-button.numbers:nth-child(21){display:none;} /*end pagination*/ } /* END responsive */ /* --- END catalog --- */ /*SNK - body:not(.manager)*/ body:not(.manager) .btn--primary--manager--new.active,body:not(.manager) .btn--primary--manager--new:active,body:not(.manager) .btn--primary--manager--new:focus,body:not(.manager) .btn--primary.active,body:not(.manager) .btn--primary:active,body:not(.manager) .btn--primary:focus,body:not(.manager) .btn--submit,body:not(.manager) .btn--submit.active,body:not(.manager) .btn--submit:active,body:not(.manager) .btn--submit:focus,body:not(.manager) .btn--success-new,body:not(.manager) .btn--success-new.active,body:not(.manager) .btn--success-new:active,body:not(.manager) .btn--success-new:focus,body:not(.manager) .btn-primary.active,body:not(.manager) .btn-primary:active,body:not(.manager) .btn-primary:focus,body:not(.manager) .subscription__cancel-button.active,body:not(.manager) .subscription__cancel-button:active,body:not(.manager) .subscription__cancel-button:focus,body:not(.manager) .subscription__revert-cancellation.active,body:not(.manager) .subscription__revert-cancellation:active,body:not(.manager) .subscription__revert-cancellation:focus { background-color: var(--accent-color); border-color: var(--accent-color) } body:not(.manager) .btn--primary--manager--new:hover,body:not(.manager) .btn--primary:hover,body:not(.manager) .btn--submit:hover,body:not(.manager) .btn--success-new:hover,body:not(.manager) .btn-primary:hover,body:not(.manager) .subscription__cancel-button:hover,body:not(.manager) .subscription__revert-cancellation:hover { background-color: #fff; border-color: var(--accent-color); color: var(--accent-color) } body:not(.manager) .btn--alt:hover:after,body:not(.manager) .btn--bare:hover:after,body:not(.manager) .btn--link:hover:after,body:not(.manager) .btn--primary--manager--new:hover:after,body:not(.manager) .btn--primary:hover:after,body:not(.manager) .btn--success-new:hover:after,body:not(.manager) .subscription__cancel-button:hover:after,body:not(.manager) .subscription__revert-cancellation:hover:after { transform: translate(4px) } body:not(.manager) .btn--alt:after,body:not(.manager) .btn--bare:after,body:not(.manager) .btn--link:after,body:not(.manager) .btn--primary--manager--new:after,body:not(.manager) .btn--primary:after,body:not(.manager) .btn--success-new:after,body:not(.manager) .subscription__cancel-button:after,body:not(.manager) .subscription__revert-cancellation:after { transition-property: transform } body:not(.manager) .btn--primary--manager--new,body:not(.manager) .subscription__cancel-button,body:not(.manager) .subscription__revert-cancellation { background-color: var(--accent-color); border: 1px solid var(--accent-color) } body:not(.manager) .subscription__cancel-button,body:not(.manager) .subscription__revert-cancellation { color: var(--accent-contrast-color) } body:not(.manager) .subscription__confirm-cancellation { background-color: var(--secondary-contrast-color); border: 1px solid var(--secondary-color) } body:not(.manager) .subscription__confirm-cancellation:hover { background-color: var(--secondary-color); border-color: var(--secondary-color); color: var(--secondary-contrast-color) } /*SNK - pagination*/ body:not(.manager) .pagination { margin: 4px 0 0 } @media only screen and (max-width: 48em) { body:not(.manager) .pagination { margin-top:21px } } body:not(.manager) .pagination__left { font-size: .938rem; line-height: 20px } @media only screen and (max-width: 48em) { body:not(.manager) .pagination__left { margin-top:12px } } body:not(.manager) .pagination__left,body:not(.manager) .pagination__left strong { font-weight: 600 } body:not(.manager) .pagination__controls-button { border-color: #000; color: #000; font-family: Inter; font-size: .938rem; font-weight: 600; height: 46px; line-height: 20px; width: 46px } @media only screen and (max-width: 48em) { body:not(.manager) .pagination__controls-button { height:40px; width: 40px } } body:not(.manager) .pagination__controls-button.first-page,body:not(.manager) .pagination__controls-button.next-page { border-right: 1px solid #000 } body:not(.manager) .pagination__controls-button>i { font-size: 1.563rem; padding-right: 0 } body:not(.manager) .pagination__controls-button.numbers:not(.last-child) { border-right: 1px solid #000 } body:not(.manager) .pagination__controls-button.active { background-color: var(--accent-color); border-color: var(--accent-color); color: #fff } body:not(.manager) .pagination__controls-button.disabled,body:not(.manager) .pagination__controls-button:hover { background: #fff; border-color: #000; color: #000 } body:not(.manager) .pagination__controls-button,body:not(.manager) .pagination__controls-button.first-child,body:not(.manager) .pagination__controls-button.first-page,body:not(.manager) .pagination__controls-button.last-child,body:not(.manager) .pagination__controls-button.last-page,body:not(.manager) .pagination__controls-button.next-page,body:not(.manager) .pagination__controls-button.previous-page { border-radius: 0 } body:not(.manager) .pagination__controls-button.last-child,body:not(.manager) .pagination__controls-button.last-page,body:not(.manager) .pagination__controls-button.previous-page { border-right: 1px solid #000 } /* --- MY ACTIVITY --- */ /* Nav */ .dashboard-access .dashboard-access-tabs{background: #ffffff; display: flex;} .dashboard-access .dashboard-access-tabs li{display: flex; justify-content: center; width: 100%;} .dashboard-access .dashboard-access-tabs .dashboard-access-tab--active{border-width: 0 0 4px 0;} .dashboard-access .dashboard-access-tabs .dashboard-access-tab--inactive{border-width: 0 0 1px 0; border-color: #cbcbcb;} .dashboard-access .dashboard-access-tabs .dashboard-access-tab--inactive button.btn.btn--link.btn--inherit-font{color: #000000;} .dashboard-access .dashboard-access-tabs .dashboard-access-tab--inactive button .dashboard-access-tab__count{background: #000000;} /* SNK - .dashboard-access */ /* REMOVE .dashboard-access__header,.dashboard-account .dashboard--content-panel .section__header .section__title,.enroll__buy--monthly .enroll__price,.enroll__buy--yearly .enroll__price,.featured-content-carousel-item__title,.h4,.learner-section__title,.learning-path-detail-milestone-list>li>h3,.learning-path-milestone__title,.session__container .order-confirmation .heading,.session__container .subscription h1,.tools__container .heading--primary,h4 { font-weight: 700 }*/ @media only screen and (max-width: 48em) { .dashboard-access__header,.dashboard-account .dashboard--content-panel .section__header .section__title,.enroll__buy--monthly .enroll__price,.enroll__buy--yearly .enroll__price,.featured-content-carousel-item__title,.h4,.learner-section__title,.learning-path-detail-milestone-list>li>h3,.learning-path-milestone__title,.session__container .order-confirmation .heading,.session__container .subscription h1,.tools__container .heading--primary,h4 { font-size:22px; line-height: 30px } } /* REMOVE repeated code @media only screen and (min-width: 48.063em) { .dashboard-access__header,.dashboard-account .dashboard--content-panel .section__header .section__title,.enroll__buy--monthly .enroll__price,.enroll__buy--yearly .enroll__price,.featured-content-carousel-item__title,.h4,.learner-section__title,.learning-path-detail-milestone-list>li>h3,.learning-path-milestone__title,.session__container .order-confirmation .heading,.session__container .subscription h1,.tools__container .heading--primary,h4 { font-size:30px; line-height: 38px } }*/ @media only screen and (max-width: 48em) { .dashboard-access-list-item__description p,.purchase-list__container .expandable-table__row__column,.testimonial .testimonial-quote__author-name { font-size:14px; line-height: 24px } } /* REVIEW Author name */ @media only screen and (min-width: 48.063em) { .dashboard-access-list-item__description p,.purchase-list__container .expandable-table__row__column,.testimonial .testimonial-quote__author-name { font-size:16px; /* line-height: 28px comment*/ } } .dashboard-access-list-item__description,.dashboard-stat--collaborations .dashboard-stat__value,.dashboard-stat--completed .dashboard-stat__value,.dashboard-stat--started .dashboard-stat__value { color: #000 } .dashboard-access-list-item__description p { font-weight: 300 } .dashboard-access,.dashboard-access-list-item,.dashboard-access-tabs { border: none } .dashboard-access section { border-bottom: 1px solid #000 } .dashboard-access section,.dashboard-access-tabs,.dashboard-access__header { filter: drop-shadow(0 0 0 #000000); transition: filter .1s ease,transform .1s ease; will-change: filter,transform } .dashboard-access__header { align-items: center; background: #fff; border: 1px solid #000; box-shadow: none; display: flex; font-family: Poppins; /*font-weight: 700;*/ padding: 24px 32px } .dashboard-access__header:not(.dashboard-access__header--expanded):hover { color: var(--accent-color); filter: drop-shadow(16px 16px 0 #000000); transform: translate(-8px,-8px) } .dashboard-access__header:not(.dashboard-access__header--expanded):hover .button-expander i:before { background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg width='11' height='17' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath fill-rule='evenodd' clip-rule='evenodd' d='M10.3 8.4 2.531.6.7 2.441l5.965 5.96L.7 14.358 2.532 16.2 10.3 8.4Z' fill='%230029FF'/%3E%3C/svg%3E") } .dashboard-access__header.dashboard-access__header--expanded { border-bottom: none } .dashboard-access__header.dashboard-access__header--expanded,.dashboard-access__header.dashboard-access__header--expanded~.dashboard-access-tabs,.dashboard-access__header.dashboard-access__header--expanded~section { filter: drop-shadow(16px 16px 0 #000000); transform: translate(-8px,-8px) } .dashboard-access__header.dashboard-access__header--expanded .button-expander i:before { transform: rotate(90deg) } .dashboard-access__header .button-expander { border: none; height: 17px; margin: 0!important; padding-right: 39px!important; width: 11px } /* REMOVE .dashboard-access__header .button-expander+span { vertical-align: -3px }*/ .dashboard-access__header .button-expander i:before { background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg width='11' height='17' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath fill-rule='evenodd' clip-rule='evenodd' d='M10.3 8.4 2.531.6.7 2.441l5.965 5.96L.7 14.358 2.532 16.2 10.3 8.4Z' fill='%23000'/%3E%3C/svg%3E"); background-repeat: no-repeat; content: " "; display: block; height: 17px; width: 11px } .dashboard-access section,.dashboard-access-tabs { border-left: 1px solid #000; border-right: 1px solid #000 } .dashboard-access-tabs { background: #f5f6f6 } @media only screen and (max-width: 48em) { .dashboard-access-tab { padding:20px 16px 12px; width: 100% } } @media only screen and (min-width: 48.063em) { .dashboard-access-tab { padding:20px 32px 12px } } .dashboard-access-tab .btn--link { align-items: center; display: flex; margin-bottom: 0!important } .dashboard-access-tab .btn--link,.dashboard-access-tab .btn--link:hover { color: #000 } .dashboard-access-tab--active { border-color: var(--accent-color); border-width: 4px 0 0 } .dashboard-access-tab__label { font-size: 17px; font-weight: 700; line-height: 30px } .dashboard-access-tab__count { background: var(--accent-color); border: none; color: #fff; font-size: 15px; font-weight: 600; line-height: 24px; margin-left: 16px; min-width: 24px } .dashboard-access-list-item { color: #000; font-size: 16px; font-weight: 300; line-height: 28px } @media only screen and (max-width: 48em) { .dashboard-access-list-item { padding:16px } } @media only screen and (min-width: 48.063em) { .dashboard-access-list-item { padding:23px 32px } } @media only screen and (max-width: 48em) { .dashboard-access-list-item>.grid { gap:8px } } @media only screen and (min-width: 48.063em) { .dashboard-access-list-item>.grid { gap:32px } } .dashboard-access-list-item:nth-of-type(2n) { background: #f5f6f6 } @media only screen and (max-width: 48em) { .dashboard-access-list-item .col-span-3,.dashboard-access-list-item .col-span-4,.dashboard-access-list-item .col-start-11.col-span-2 { grid-column-start:span 12 } } .dashboard-access-list-item .col-span-4+.col-span-2 { display: none } @media only screen and (min-width: 48.063em) { .dashboard-access-list-item .col-span-4 { grid-column:1/9 } .dashboard-access-list-item .col-span-3 { grid-column: 9/11 } } .dashboard-access-list-item .col-span-3 strong { color: #000; font-family: Inter; font-size: 16px; font-weight: 300; line-height: 28px } @media only screen and (min-width: 48.063em) { .dashboard-access-list-item .col-span-2.col-start-11 { grid-column:11/13 } } .dashboard-access-list-item .col-span-2.col-start-11 .btn--primary { padding: 12px } @media only screen and (max-width: 48em) { .dashboard-access-list-item .col-span-2.col-start-11 .btn--primary { display:block } } @media only screen and (min-width: 48.063em) { .dashboard-access-list-item .col-span-2.col-start-11 .btn--primary { font-size:.938rem; line-height: 1.35 } } .dashboard-access-list-item .btn { margin-bottom: 0!important } .dashboard-access-list-item-expander i { color: var(--accent-color); font-size: 18px } .dashboard-access-list-item-expander i:before { background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg width='9' height='13' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath fill-rule='evenodd' clip-rule='evenodd' d='M8.5 6.5 2.028 0 .5 1.534 5.47 6.5.5 11.466 2.028 13 8.5 6.5Z' fill='%230029FF'/%3E%3C/svg%3E"); background-repeat: no-repeat; content: " "; display: inline-block; height: 13px; width: 9px } @media only screen and (max-width: 48em) { .dashboard-access-list-item-expander i { display:block } } @media only screen and (min-width: 992px) { .dashboard-access-list-item-expander i { padding-right:28px } } .dashboard-access-list-item-expander__title { color: #000; font-family: Poppins; font-size: 18px; font-weight: 700; line-height: 34px } @media only screen and (max-width: 48em) { .dashboard-access-list-item-expander__title { display:inline-block; margin-top: 8px } } .dashboard-access-list-item-expansion { margin: 8px 0 } /* SNK -testimonial */ .testimonial { padding-bottom: 173px; padding-top: 0; /* REVIEW */ } @media only screen and (max-width: 40em) { .testimonial { background-position:0 0; background-size: 280px auto; margin-top: -70px; padding: 0 } } @media only screen and (min-width: 40.063em) and (max-width:48em) { .testimonial { background-position:calc(50% - 164px) 18px; background-size: 282px auto } } @media only screen and (min-width: 48.063em) and (max-width:64em) { .testimonial { background-position:calc(50% - 185px) 8px; background-size: 330px auto } } /* REMOVE testimonial @media only screen and (min-width: 64.063em) { .testimonial { background-position:calc(50% - 240px) -3px; background-size: 378px auto } }*/ /* REMOVE testimonial .testimonial .testimonial-quote__text { margin-bottom: 24px }*/ .testimonial .testimonial-quote__author-name { /* REMOVE font-family: Poppins; font-weight: 700*/ font-style: normal; } .testimonial .testimonial-quote__author-name:before { display: none } /* KEEP Author description */ .testimonial .testimonial-quote__author-description { font-style: normal; /* font-weight: 300 comment*/ } /* KEEP testimonial */ .testimonial .testimonial-quote { padding-left: 0; position: relative; text-align: left; top: auto; transform: none } @media only screen and (max-width: 40em) { .testimonial .testimonial-quote { padding-right:0; padding-top: 241px } } /* REMOVE .testimonial .testimonial-quote @media only screen and (min-width: 40.063em) { .testimonial .testimonial-quote { margin-left:calc(50% + 12px); width: 50% } }*/ .testimonial .testimonial-quote:before { background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg width='62' height='45' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath fill-rule='evenodd' clip-rule='evenodd' d='M27 26.914 17.928 45h-13.5L13.5 26.914H0V0h27v26.914Zm35 0L53.144 45h-13.5L48.5 26.914H35V0h27v26.914Z' fill='%23000'/%3E%3C/svg%3E"); content: ""; display: block; height: 45px; margin-bottom: 30px; width: 62px } /* REMOVE .testimonial-widget .testimonial-widget { margin: 0 -1em }*/ .sidebar__testimonial { display: none } /* SNK -.session__container */ @media only screen and (min-width: 48.063em) { .session { background:#f5f6f6 } } .session__container { border: none; padding: 0 } .session__container>.text-center { background: #000 } .session__container>.text-center .company__beta-logo { margin-bottom: 22px; margin-top: 21px } .session__container>.text-center .company__beta-logo img { max-width: 200px } .session__container .order-confirmation,.session__container .subscription { padding: 32px } .session__container .subscription h1 { margin-bottom: 48px; text-align: left } .session__container .subscription .row .large-12.columns>p { font-weight: 700; margin-bottom: 24px } .session__container .subscription hr { margin: 24px 0 } .session__container .subscription .subscription__label { color: #000 } .session__container .order-confirmation { display: flex; flex-direction: column } .session__container .order-confirmation .cart-items,.session__container .order-confirmation>p { margin-bottom: 32px } .session__container .order-confirmation .cart-items { margin-top: -32px } .session__container .order-confirmation .cart-item { display: flex; padding-bottom: 32px; padding-top: 32px } @media only screen and (max-width: 48em) { .session__container .order-confirmation .cart-item { flex-wrap:wrap } } .session__container .order-confirmation .receipt-item__asset { padding-left: 0 } @media only screen and (max-width: 48em) { .session__container .order-confirmation .receipt-item__asset { margin-bottom:24px; padding-right: 0 } } @media only screen and (min-width: 48.063em) { .session__container .order-confirmation .receipt-item__asset { padding-right:42px; width: 200px } } .session__container .order-confirmation .receipt-item__asset img { border: 1px solid #000; box-shadow: 8px 8px 0 #000; width: 100% } .session__container .order-confirmation .receipt-item__content { padding-right: 0 } @media only screen and (max-width: 48em) { .session__container .order-confirmation .receipt-item__content { padding-left:0 } } @media only screen and (min-width: 48.063em) { .session__container .order-confirmation .receipt-item__content { padding-left:48px } } .session__container .order-confirmation .receipt-item__text { margin: 0 } .session__container .order-confirmation .receipt-item__text p { color: #000; margin-bottom: 24px } .session__container .order-confirmation .receipt-item__text p strong { font-weight: 400 } .session__container .order-confirmation .receipt-item__text p.receipt-item__title { font-weight: 700; margin-bottom: 8px } .session__container .order-confirmation>.btn.btn--primary.btn--right { margin-bottom: 0; margin-left: auto } .session__container .subscription__cancel-button,.session__container .subscription__confirmation { margin-top: 24px } @media only screen and (max-width: 48em) { .session__container .subscription__cancel-button,.session__container .subscription__confirmation { float:left } } .session__container .subscription__confirm-cancellation,.session__container .subscription__revert-cancellation { display: inline-block; text-align: center } @media only screen and (max-width: 48em) { .session__container .subscription__confirm-cancellation,.session__container .subscription__revert-cancellation { display:block } .session__container .subscription__confirm-cancellation { margin-top: 16px } } @media only screen and (min-width: 48.063em) { .session__container .subscription__confirm-cancellation { margin-left:18px; margin-right: 10px } } .session__container .subscription__revert-cancellation { position: relative } @media only screen and (max-width: 48em) { .session__container .subscription__revert-cancellation { margin-top:-16px } } .session__container .subscription__revert-cancellation:before { background: #fff; content: ""; display: block; height: 30px; left: -18px; position: absolute; top: 6px; width: 15px } @media only screen and (max-width: 48em) { .session__container .subscription__revert-cancellation:before { border-radius:20px; height: 24px; left: -7px; top: -10px; transform: rotate(16deg); width: 11px } } /*# sourceMappingURL=celonis-hr-styling.css.map */ /* SNK - .learning-path */ .widget--course-benefits,.widget--learning-path-purchase { padding: 0!important } .learning-path-criterion__label,.user-engagement-stat__label { color: #000; font-size: .938rem; font-weight: 300; height: auto; line-height: 1.75; text-align: left; text-transform: none } .learning-path-criterion__value-container,.user-engagement-stat__value-container { display: flex; font-family: Poppins; justify-content: center; margin-top: 8px } @media only screen and (min-width: 48.063em) { .widget--learning-path-content { margin-top:48px } } .learning-path-body { padding: 2em 24px } @media only screen and (min-width: 48.063em) and (max-width:64em) { .learning-path-body { padding:2em 32px } } @media only screen and (min-width: 64.063em) { .learning-path-body { padding:2em 100px } } .learning-path-body .hr__accent { display: none } .learning-path-body--primary>.row>.medium-9.medium-centered.columns { margin: 0; width: 100% } .learning-path-body--primary>.row>.medium-9.medium-centered.columns .small-block-grid-1 { margin-left: -92.2% } .learning-path-body--primary>.row>.medium-9.medium-centered.columns .small-block-grid-3 { margin-left: -19.2% } @media only screen and (min-width: 48.063em) { .learning-path-body--primary>.row>.medium-9.medium-centered.columns .medium-block-grid-4 { margin-left:-13.2% } .learning-path-body--primary>.row>.medium-9.medium-centered.columns .medium-block-grid-5 { margin-left: -10.2% } .learning-path-body--primary>.row>.medium-9.medium-centered.columns .medium-block-grid-6 { margin-left: -8.2% } } .learning-path-body--secondary { background: #fff } .learning-path-body--secondary:before { display: none } .learning-path-progress-bar-item__index { align-items: center; background: #fff; border: 2px solid #000; box-shadow: none; color: #000; display: flex; font-family: Poppins; font-size: 1.375rem; font-weight: 700; justify-content: center } .learning-path-progress-bar-item--current .learning-path-progress-bar-item__index { background: #000; color: #fff } .learning-path-progress-bar-item__border { border-top: 1px solid #e5e5e5 } .learning-path-progress-bar-item__border--right { left: calc(50% + 4px) } .learning-path-progress-bar-item--completed .learning-path-progress-bar-item__index { background: #fff; color: transparent } .learning-path-progress-bar-item--completed .learning-path-progress-bar-item__index:after { background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg width='22' height='16' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath fill-rule='evenodd' clip-rule='evenodd' d='m7.297 15.852 14-14L19.645.2 7.297 12.576 2.425 7.704.8 9.356l6.496 6.496Z' fill='%23000'/%3E%3C/svg%3E"); content: ""; display: block; height: 16px; position: absolute; width: 22px } .learning-path-milestone { background: #f5f6f6; border-radius: 0 } @media only screen and (max-width: 48em) { .learning-path-milestone { margin-left:-24px; margin-right: -24px; padding: 32px 24px } } @media only screen and (min-width: 48.063em) { .learning-path-milestone { padding:32px } } @media only screen and (max-width: 48em) { .learning-path-milestone>.row { display:flex; flex-direction: column-reverse } .learning-path-milestone>.row>.small-4.columns,.learning-path-milestone>.row>.small-8.columns { width: 100% } .learning-path-milestone>.row>.small-8.columns { margin-top: 16px } } .learning-path-milestone--completed { background: #e7f6e6; border: none; border-top: 4px solid #57b451 } .learning-path-milestone--completed:before { display: none } .learning-path-milestone--completed .learning-path-milestone__title:after { background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg width='18' height='14' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath fill-rule='evenodd' clip-rule='evenodd' d='m6.037 13.482 11.2-11.2L15.915.96l-9.878 9.9-3.898-3.897-1.3 1.322 5.198 5.197Z' fill='%23000'/%3E%3C/svg%3E"); background-position: 4px 6px; background-repeat: no-repeat; border: 2px solid #000; border-radius: 50%; box-shadow: none; content: " "; display: inline-block; flex-shrink: 0; height: 31px; margin-left: 24px; width: 31px } .learning-path-milestone__title { align-items: center; display: flex } .learning-path-milestone__badge { padding: 4px 16px } .learning-path-milestone__badge--required { background: var(--accent-color) } .learning-path-milestone__badge--elective { background: #000 } .learning-path-milestone-item { border-radius: 0; box-shadow: none; margin-bottom: 24px; margin-top: 24px; padding: 0; position: relative } .learning-path-milestone-item:not(.learning-path-milestone-item--secondary) { border: none } @media only screen and (min-width: 48.063em) { .learning-path-milestone-item:not(.learning-path-milestone-item--secondary) { min-height:200px } } .learning-path-milestone-item:not(.learning-path-milestone-item--secondary):hover .learning-path-milestone-item__info,.learning-path-milestone-item:not(.learning-path-milestone-item--secondary):hover .learning-path-milestone-item__title h4 { color: var(--link-color) } .learning-path-milestone-item .learning-path-milestone-item__title { border: none } .learning-path-milestone-item .learning-path-milestone-item__title>.row { display: flex; flex-wrap: wrap } .learning-path-milestone-item .learning-path-milestone-item__title>.row>.columns { width: 100% } .learning-path-milestone-item .learning-path-milestone-item__title>.row>.columns .text-right { text-align: left!important } .learning-path-milestone-item .learning-path-milestone-item__title>.row .small-3.columns { bottom: 24px; position: absolute } @media only screen and (max-width: 48em) { .learning-path-milestone-item .learning-path-milestone-item__title>.row .small-3.columns { bottom:43px } } .learning-path-milestone-item .learning-path-milestone-item__title>.row .small-3.columns>.text-right .btn { z-index: 1 } .learning-path-milestone-item .learning-path-milestone-item__title h4 { margin-bottom: 4px } .learning-path-milestone-item .learning-path-milestone-item__title .learning-path-milestone-item__reschedule { position: relative; z-index: 1 } .learning-path-milestone-item .learning-path-milestone-item__title .learning-path-milestone-item__reschedule:hover { color: var(--link-color) } .learning-path-milestone-item .learning-path-milestone-item__body { margin-top: 0 } @media only screen and (max-width: 40em) { .learning-path-milestone-item .learning-path-milestone-item__body>.row>.medium-8.columns,.learning-path-milestone-item .learning-path-milestone-item__body>.row>.small-12.columns { padding:0 24px } } @media only screen and (min-width: 40.063em) { .learning-path-milestone-item .learning-path-milestone-item__body>.row>.medium-8.columns,.learning-path-milestone-item .learning-path-milestone-item__body>.row>.small-12.columns { left:50%; padding: 0 48px } } .learning-path-milestone-item .learning-path-milestone__badge { display: block; margin-bottom: 8px; padding: 0 } .learning-path-milestone-item .learning-path-milestone__badge span { display: inline-block; padding: 4px 16px } .learning-path-milestone-item .learning-path-milestone__badge--required { background: none } .learning-path-milestone-item .learning-path-milestone__badge--required span { background: var(--accent-color) } .learning-path-milestone-item .learning-path-milestone__badge--elective { background: none; border: none } .learning-path-milestone-item .learning-path-milestone__badge--elective span { background: #000; border: 1px solid #000; color: #fff } .learning-path-milestone-item .learning-path-milestone-item__description { color: #000; font-weight: 300; padding-bottom: 92px } @media only screen and (max-width: 48em) { .learning-path-milestone-item .learning-path-milestone-item__description { padding-bottom:99px } } .learning-path-milestone-item .learning-path-milestone-item__info { font-weight: 700; margin: 0 0 16px } @media only screen and (max-width: 48em) { .learning-path-milestone-item .learning-path-milestone-item__info,.learning-path-milestone-item .learning-path-milestone-item__info strong { font-weight:300 } } .learning-path-milestone-item.learning-path-milestone-item--secondary { background: none; margin-bottom: 0 } .learning-path-milestone-item.learning-path-milestone-item--secondary .learning-path-milestone-item__title h4 { margin-bottom: 26px } .learning-path-milestone-item-session-select { right: 50%; top: -248px } @media only screen and (max-width: 64em) { .learning-path-milestone-item-session-select { right:60% } } @media only screen and (max-width: 40em) { .learning-path-milestone-item-session-select { right:0 } } .learning-path-milestone-item-session-select .learning-path-milestone-item-session-select__body { display: none } .learning-path-criterion { height: auto; width: auto } .learning-path-criterion:nth-of-type(1n) { color: var(--accent-color) } .learning-path-criterion__value-container i { display: none } .learning-path-criterion__value--pending { color: #000 } .learning-path-criterion__label:before { background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg width='36' height='36' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M25.5 4.5h-15a2.996 2.996 0 0 0-2.985 3l-.015 24L18 27l10.5 4.5v-24c0-1.65-1.35-3-3-3Zm0 22.5L18 23.73 10.5 27V7.5h15V27Z' fill='%23000'/%3E%3C/svg%3E"); content: ""; display: inline-block; height: 36px; vertical-align: middle; width: 36px } /* KEEP Milestones */ .learning-path-detail-milestone-list>li>h3 { margin-bottom: 48px; margin-top: 0; padding-top: 24px } /* REMOVE Milestones .learning-path-detail-milestone-list>li>h3:first-of-type { margin-top: 8px }*/ .learning-path-detail-milestone-list>li>hr { display: none } /* KEEP Milestones items (cards) */ .learning-path-detail-milestone-item { margin-bottom: 48px; position: relative } .learning-path-detail-milestone-item:hover .learning-path-detail-milestone-item__content-type,.learning-path-detail-milestone-item:hover .learning-path-detail-milestone-item__title { color: var(--accent-color) } .learning-path-detail-milestone-item>.row:first-child { display: flex; flex-direction: column-reverse } .learning-path-detail-milestone-item>.row:nth-child(2) { display: flex } @media only screen and (min-width: 40.063em) { .learning-path-detail-milestone-item>.row:nth-child(2)>.medium-8.columns,.learning-path-detail-milestone-item>.row:nth-child(2)>.small-12.columns { left:50% } } .learning-path-detail-milestone-item>hr { display: none } @media only screen and (max-width: 40em) { .learning-path-detail-milestone-item .learning-path-detail-milestone-item__content-type { padding:0 24px } .learning-path-detail-milestone-item .learning-path-detail-milestone-item__content-type,.learning-path-detail-milestone-item .learning-path-detail-milestone-item__content-type strong { font-weight: 300 } } @media only screen and (min-width: 40.063em) { .learning-path-detail-milestone-item .learning-path-detail-milestone-item__content-type { font-weight:700; padding: 0 24px 0 48px } } .learning-path-detail-milestone-item .learning-path-milestone__badge { float: left; margin-bottom: 8px } .learning-path-detail-milestone-item .learning-path-detail-milestone-item__title { margin-bottom: 4px; padding-right: 0 } .learning-path-detail-milestone-item .learning-path-detail-milestone-item__description { color: #000; font-weight: 300 } @media only screen and (max-width: 40em) { .learning-path-detail-milestone-item .learning-path-detail-milestone-item__description { padding:16px 24px } } @media only screen and (min-width: 40.063em) { .learning-path-detail-milestone-item .learning-path-detail-milestone-item__description { padding:16px 24px 16px 48px } } .learning-path-detail-milestone-item .learning-path-detail-milestone-item__cta { float: left } @media only screen and (max-width: 40em) { .learning-path-detail-milestone-item .learning-path-detail-milestone-item__cta { padding:20px 24px 24px!important } } @media only screen and (min-width: 40.063em) { .learning-path-detail-milestone-item .learning-path-detail-milestone-item__cta { padding:24px 24px 24px 48px!important } } .learning-path-detail-milestone-item .learning-path-detail-milestone-item__cta i:before { background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg width='17' height='12' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath fill-rule='evenodd' clip-rule='evenodd' d='M16.75 5.973c0-.145-.034-.253-.103-.326-.034-.036-1.41-1.628-4.125-4.777-.069-.072-.172-.108-.31-.108-.137 0-.24.036-.309.108-.206.218-.206.435 0 .652l3.455 4.017H.662c-.275 0-.412.144-.412.434 0 .29.138.434.412.434h14.696l-3.455 4.017c-.206.217-.206.434 0 .651.206.217.413.217.619 0L16.647 6.3c.069-.073.103-.181.103-.326Z' fill='%230029FF'/%3E%3C/svg%3E"); background-repeat: no-repeat; content: ""; display: inline-block; height: 12px; margin-left: 8px; vertical-align: -1px; width: 17px } /* REVIEW Sidebar > Button */ .widget--course-purchase .btn--primary,.widget--learning-path-purchase .btn--primary { /* display: block comment */ } /* SNK - progress */ .user-engagement-progress-bar .progress { background: #f5f6f6 } .fullscreen-scorm-container { z-index: 1000 } @media only screen and (max-width: 48em) { .section-progress-bar { padding:0 1rem } } .section-progress-bar div,.section-progress-bar span { height: 6px } .section-progress-bar div { background: #e5e5e5 } .section-progress-bar span { background: var(--accent-color) } .progress { background: #e5e5e5; border: none; padding: 0 } .progress.colorized .meter { background: var(--accent-color) } /* SNK -.dashboard-account */ .dashboard-account { height: auto } @media only screen and (min-width: 48.063em) { .dashboard-account { display:flex } } @media only screen and (min-width: 64.063em) { .dashboard-account { padding-top:64px } } @media only screen and (min-width: 48.063em) { .dashboard-account>.medium-3.columns { border-right:1px solid #000; padding-right: 0 } } .dashboard-account .dashboard--content-panel p { font-weight: 300 } .dashboard-account .dashboard--content-panel .section-container,.dashboard-account .dashboard--content-panel .section-container--head { box-shadow: none } @media only screen and (min-width: 48.063em) { .dashboard-account .dashboard--content-panel .section-container { margin-bottom:100px; padding-left: 12% } } .dashboard-account .dashboard--content-panel .section__header { background: none; border: none; box-shadow: none; padding: 0 } .dashboard-account .dashboard--content-panel .section__header .section__title { font-family: Poppins; margin-bottom: 48px; text-transform: none } @media only screen and (max-width: 48em) { .dashboard-account .dashboard--content-panel .section__header .section__title { margin-top:48px } } .dashboard-account .dashboard--content-panel .columns,.dashboard-account .dashboard--content-panel .section__body { padding: 0 } .dashboard-account .dashboard--content-panel .section__body form>.row:first-of-type { border-bottom: 1px solid #e5e5e5; display: flex; padding-bottom: 24px } @media only screen and (max-width: 64em) { .dashboard-account .dashboard--content-panel .section__body form>.row:first-of-type { flex-wrap:wrap } } .dashboard-account .dashboard--content-panel .section__body form>.row:first-of-type>.medium-3.columns { width: auto } @media only screen and (max-width: 48em) { .dashboard-account .dashboard--content-panel .section__body form>.row:first-of-type>.medium-3.columns { margin:0 auto } } @media only screen and (min-width: 64.063em) { .dashboard-account .dashboard--content-panel .section__body form>.row:first-of-type>.medium-9.columns { flex-grow:1; padding-left: 48px } .dashboard-account .dashboard--content-panel .section__body .large-offset-6.large-6.columns { padding-right: 16px; position: absolute; right: 0; top: -7px } } @media only screen and (min-width: 40.063em) { .dashboard-account .dashboard--content-panel .section__body .large-offset-6.large-6.columns>.row { display:flex; justify-content: flex-end } .dashboard-account .dashboard--content-panel .section__body .large-offset-6.large-6.columns .large-5.columns { margin-left: 32px; width: auto } } @media only screen and (max-width: 40em) { .dashboard-account .dashboard--content-panel .section__body .large-offset-6.large-6.columns .large-5.columns .btn--right { margin-top:16px; width: 100% } } .dashboard-account .dashboard--content-panel .section__body .profile--input { width: 100%!important } .dashboard-account .dashboard--content-panel .section__body .profile--input input { background-color: #e5e5e5; pointer-events: none } .dashboard-account .dashboard--content-panel .section__body .btn--primary--manager--new,.dashboard-account .dashboard--content-panel .section__body .btn--success-new { margin-bottom: 48px!important; margin-top: 48px; min-width: 242px } @media only screen and (max-width: 40em) { .dashboard-account .dashboard--content-panel .section__body .btn--primary--manager--new,.dashboard-account .dashboard--content-panel .section__body .btn--success-new { width:100% } } .dashboard-account .dashboard--content-panel .section__body .small-4.columns.text-centered.small-push-4 { margin-top: 32px } .dashboard-account .dashboard--content-panel .section__body .panel { background: transparent; border: 1px solid #000 } @media only screen and (min-width: 48.063em) { .dashboard-account .dashboard--content-panel .section__body .panel { padding-left:24px; padding-right: 24px } } @media only screen and (min-width: 64.063em) { .dashboard-account .dashboard--content-panel .section__body .panel>div { align-items:center; display: flex } } @media only screen and (max-width: 40em) { .dashboard-account .dashboard--content-panel .section__body .panel>div .btn--subscription { width:100% } } @media only screen and (max-width: 64em) { .dashboard-account .dashboard--content-panel .section__body .panel>div .btn--subscription { margin-top:16px } } @media only screen and (min-width: 64.063em) { .dashboard-account .dashboard--content-panel .section__body .panel>div .btn--subscription { margin-bottom:0; margin-left: auto } } .dashboard-account .dashboard--content-panel .section__body .panel hr { border-color: #000 } .dashboard-account .dashboard--content-panel .section__body .panel hr:last-of-type { display: none } .dashboard-account .dashboard--content-panel .section__body .panel .subscription-name { font-family: Poppins; margin-right: 8px } .dashboard-account .profile__name { margin-top: 0 } .dashboard-account .profile__name:after { content: "Contact our service team academy@celonis.com to change your personal details."; display: block } .dashboard-account #card-element { background: #f5f6f6; border: none; border-radius: 4px; box-shadow: none; color: #767575; height: 56px; margin-bottom: 48px; padding: 13px 16px; position: relative } .dashboard-account #card-element:after { background-color: #e5e5e5; bottom: -48px; content: ""; display: block; height: 1px; left: 0; position: absolute; width: 100% } .dashboard-account .section__body select { height: 46px!important } .dashboard-account-tabs { display: flex; flex-direction: column } .dashboard-account-tabs>.dashboard-account-tab { border-top: 0; margin-bottom: 0; padding: 16px } .dashboard-account-tabs>.dashboard-account-tab:nth-of-type(2) { display: none } .dashboard-account-tabs>.dashboard-account-tab--active { background: #f5f6f6; border-right: 4px solid #0029ff } .dashboard-account-tabs>.dashboard-account-tab--inactive { background: #fff } @media only screen and (max-width: 48em) { .dashboard-account-tabs>.dashboard-account-tab--inactive { border-right:1px solid #000 } } .dashboard-account-tabs>.dashboard-account-tab--inactive .btn--link { color: #000!important } .dashboard-account-tabs .btn { font-family: Inter; font-size: 17px; font-weight: 700; line-height: 30px; margin-bottom: 0!important } /* SNK -.purchase-list__container */ .purchase-list__container { border: 1px solid #000; clear: both; padding: 16px 24px 24px } @media only screen and (max-width: 64em) { .purchase-list__container .purchase-item__details-body .expandable-table__row__spacer,.purchase-list__container .purchase-item__details-header .expandable-table__row__spacer,.purchase-list__container .purchase-list__header .expandable-table__row__spacer { height:16px!important } } .purchase-list__container .purchase-list__header { background: transparent; border-bottom: 1px solid #000; padding: 0 } .purchase-list__container .purchase-list__header h4 { margin-bottom: 16px } .purchase-list__container .purchase-item { border: none } .purchase-list__container .purchase-item .purchase-item__details-header { padding-bottom: 0 } @media only screen and (min-width: 64.063em) { .purchase-list__container .purchase-item .purchase-item__details-header { padding-top:16px } } .purchase-list__container .expandable-table__row__column { height: 44px; line-height: 44px; padding-right: 16px!important } /* Closed */ .widget--dashboard-access.widget--dashboard-access_standard .row{margin:0;} .widget--dashboard-access.widget--dashboard-access_standard .row .small-12.columns{padding:0;} .widget--dashboard-access .dashboard-access section .dashboard-access-list-item:nth-of-type(2n){background-color:#ffffff;} .widget--dashboard-access .dashboard-access section .grid.grid-cols-12.gap-4.items-center{row-gap:0; column-gap: 24px; grid-template-columns: 1fr 200px; grid-template-rows: 1fr .1fr;} .widget--dashboard-access .dashboard-access section .grid.grid-cols-12.gap-4.items-center .col-span-4{grid-column: unset;} .widget--dashboard-access .dashboard-access section .grid.grid-cols-12.gap-4.items-center .col-span-4 button{display: flex;} .widget--dashboard-access .dashboard-access section .grid.grid-cols-12.gap-4.items-center .col-span-4 button .icon-navigatedown, .widget--dashboard-access .dashboard-access section .grid.grid-cols-12.gap-4.items-center .col-span-4 button .icon-navigateright{padding-right: 18px; padding-top: 6px;} .widget--dashboard-access .dashboard-access section .grid.grid-cols-12.gap-4.items-center .col-span-4 button .icon-navigateright{color: #000000;} .widget--dashboard-access .dashboard-access section .grid.grid-cols-12.gap-4.items-center .col-span-4 button .icon-navigatedown::before{rotate:90deg;} .widget--dashboard-access .dashboard-access section .grid.grid-cols-12.gap-4.items-center .col-span-4 button .dashboard-access-list-item-expander__title:hover{color: #0029ff;} .widget--dashboard-access .dashboard-access section .grid.grid-cols-12.gap-4.items-center .col-span-3{grid-column: unset; grid-row: 2/3; display: flex; font-size: 14px; padding-left: 18px; line-height: 16px;} .widget--dashboard-access .dashboard-access section .grid.grid-cols-12.gap-4.items-center .col-span-3 strong, .widget--dashboard-access .dashboard-access section .grid.grid-cols-12.gap-4.items-center .col-span-3 .catalog-list-item__source{font-size: 14px; padding: 0 10px; margin: 0; line-height: 16px;} .widget--dashboard-access .dashboard-access section .grid.grid-cols-12.gap-4.items-center .col-span-3 strong{padding-right: 5px;} .widget--dashboard-access .dashboard-access section .grid.grid-cols-12.gap-4.items-center .col-span-3 .catalog-list-item__source{margin: 0 0 0 10px; border-left: 1px solid #000000;} .widget--dashboard-access .dashboard-access section .grid.grid-cols-12.gap-4.items-center .col-start-11.col-span-2.text-right{grid-column: 2/3; grid-row: 1/3; text-align: center!important;} .widget--dashboard-access .dashboard-access section .grid.grid-cols-12.gap-4.items-center .col-start-11.col-span-2.text-right .btn.btn--primary.btn--small.m-0{width: 100%; text-wrap: nowrap;} .widget--dashboard-access .dashboard-access section .grid.grid-cols-12.gap-4.items-center .col-start-11.col-span-2.text-right a.ember-view{color: #0029ff;} .widget--dashboard-access .dashboard-access section .grid.grid-cols-12.gap-4.items-center .col-start-11.col-span-2.text-right a.ember-view small{font-size: unset;} /* Open */ /*Img*/ .dashboard-access-list-item .dashboard-access-list-item-expansion .row .medium-4.columns{display: none;} /*Stats*/.dashboard-access-list-item .dashboard-access-list-item-expansion .row .medium-8.columns{width: 100%; padding: 14px 0 0 28px; display: grid; grid-template-columns: auto 1fr; grid-template-rows: auto auto;} .dashboard-access-list-item .dashboard-access-list-item-expansion .row .medium-8.columns .dashboard-access-list-item__description p{margin: 0;} .dashboard-access-list-item .dashboard-access-list-item-expansion .row .medium-8.columns .small-12{grid-area: 1 / 2 / 2 / 3; margin-left: 20px;} .dashboard-access-list-item .dashboard-access-list-item-expansion .row .medium-8.columns .small-12 a{text-wrap: nowrap; padding: unset; border:none; border-radius: unset; border-color: unset; background-color: unset; color: #0029ff; font-weight: 600; text-decoration: underline;} .dashboard-access-list-item .dashboard-access-list-item-expansion .row .medium-8.columns .ember-view{grid-column: 1/3;} .dashboard-access-list-item .dashboard-access-list-item-expansion .row .medium-8.columns .ember-view .ember-view{display: flex; align-items: center;} .dashboard-access-list-item .dashboard-access-list-item-expansion .row .medium-8.columns .user-engagement-stats .small-block-grid-2.medium-block-grid-3 , .dashboard-access-list-item .dashboard-access-list-item-expansion .row .medium-8.columns .user-engagement-stats .small-block-grid-2.medium-block-grid-4 {margin: 0;} .dashboard-access-list-item .dashboard-access-list-item-expansion .row .medium-8.columns .user-engagement-stats, .dashboard-access-list-item .dashboard-access-list-item-expansion .row .medium-8.columns .user-engagement-progress-bar, .dashboard-access-list-item .dashboard-access-list-item-expansion .row .medium-8.columns .user-engagement-stats .small-block-grid-2.medium-block-grid-4 li{width: 50%;} .dashboard-access-list-item .dashboard-access-list-item-expansion .row .medium-8.columns .user-engagement-stats .small-block-grid-2.medium-block-grid-3 li{width:100%;} .dashboard-access-list-item .dashboard-access-list-item-expansion .row .medium-8.columns .user-engagement-stats .small-block-grid-2.medium-block-grid-3 li, .dashboard-access-list-item .dashboard-access-list-item-expansion .row .medium-8.columns .user-engagement-stats .small-block-grid-2.medium-block-grid-4 li{margin: 0; display: flex; justify-content: center; gap: 24px;} .dashboard-access-list-item .dashboard-access-list-item-expansion .row .medium-8.columns .user-engagement-stats .small-block-grid-2.medium-block-grid-3 li, .dashboard-access-list-item .dashboard-access-list-item-expansion .row .medium-8.columns .user-engagement-stats .small-block-grid-2.medium-block-grid-4 li{padding: 0;} .dashboard-access-list-item .dashboard-access-list-item-expansion .row .medium-8.columns .user-engagement-stats .small-block-grid-2.medium-block-grid-3 li.user-engagement-stat--hours, .dashboard-access-list-item .dashboard-access-list-item-expansion .row .medium-8.columns .user-engagement-stats .small-block-grid-2.medium-block-grid-4 li.user-engagement-stat--hours, .dashboard-access-list-item .dashboard-access-list-item-expansion li .user-engagement-stat__label-hint{display: none;} .dashboard-access-list-item .dashboard-access-list-item-expansion li .user-engagement-stat__value-container.user-engagement-stat__value-container--huge, .dashboard-access-list-item .dashboard-access-list-item-expansion li .user-engagement-stat__value-container.user-engagement-stat__value-container--huge{color: #000000;} .dashboard-access-list-item .dashboard-access-list-item-expansion .row .medium-8.columns .user-engagement-progress-bar .nice.round.progress.colorized{margin:unset; background: #e5e5e5; height: 10px;} .dashboard-access-list-item .dashboard-access-list-item-expansion .row .medium-8.columns .user-engagement-progress-bar .nice.round.progress.colorized span.meter{background:#000000;} /* Responsive */ @media only screen and (min-width: 48.063em) and (max-width: 64em){ .dashboard-access-list-item .dashboard-access-list-item-expansion .row .medium-8.columns .user-engagement-stats .small-block-grid-2.medium-block-grid-3 li, .dashboard-access-list-item .dashboard-access-list-item-expansion .row .medium-8.columns .user-engagement-stats .small-block-grid-2.medium-block-grid-4 li{flex-direction: column; gap:0;} } @media only screen and (max-width: 48em){ .dashboard-access .dashboard-access-tabs button{flex-direction: column; text-align: center;} .dashboard-access .dashboard-access-tabs button .dashboard-access-tab__count{margin: 10px 0 0 0;} .widget--dashboard-access .dashboard-access section .grid.grid-cols-12.gap-4.items-center{grid-template-columns: 1fr; grid-template-rows: repeat(3, auto);} .widget--dashboard-access .dashboard-access section .grid.grid-cols-12.gap-4.items-center .col-span-4 button .dashboard-access-list-item-expander__title{margin:0;} .widget--dashboard-access .dashboard-access section .grid.grid-cols-12.gap-4.items-center .col-start-11.col-span-2.text-right{grid-area: 3/1/4/2; margin: 12px 0 0 26px;} .widget--dashboard-access .dashboard-access section .grid.grid-cols-12.gap-4.items-center .col-start-11.col-span-2.text-right br{display: none;} .dashboard-access-list-item .dashboard-access-list-item-expansion .row .medium-8.columns{grid-template-columns: 1fr; grid-template-rows: repeat(3, auto);} .dashboard-access-list-item .dashboard-access-list-item-expansion .row .medium-8.columns .ember-view{grid-area: 3/1/4/2; margin-bottom: 16px;} .dashboard-access-list-item .dashboard-access-list-item-expansion .row .medium-8.columns .small-12{grid-area: 2/1/3/2; margin:0 0 16px 0; text-align: center;} .dashboard-access-list-item .dashboard-access-list-item-expansion .row .medium-8.columns .ember-view .ember-view{flex-direction: column;} .dashboard-access-list-item .dashboard-access-list-item-expansion .row .medium-8.columns .user-engagement-stats, .dashboard-access-list-item .dashboard-access-list-item-expansion .row .medium-8.columns .user-engagement-progress-bar, .dashboard-access-list-item .dashboard-access-list-item-expansion .row .medium-8.columns .user-engagement-stats .small-block-grid-2.medium-block-grid-4 li{width: 100%;} .dashboard-access-list-item .dashboard-access-list-item-expansion .row .medium-8.columns .user-engagement-stats .small-block-grid-2.medium-block-grid-4{display: flex;} .dashboard-access-list-item .dashboard-access-list-item-expansion .row .medium-8.columns .user-engagement-stats .small-block-grid-2.medium-block-grid-3 li, .dashboard-access-list-item .dashboard-access-list-item-expansion .row .medium-8.columns .user-engagement-stats .small-block-grid-2.medium-block-grid-4 li{flex-direction: row; gap:8px;} .dashboard-access-list-item .dashboard-access-list-item-expansion .row .medium-8.columns .user-engagement-progress-bar .nice.round.progress.colorized{align-items: flex-start;} .dashboard-access-list-item .dashboard-access-list-item-expansion li .user-engagement-stat__value-container.user-engagement-stat__value-container--huge, .dashboard-access-list-item .dashboard-access-list-item-expansion li .user-engagement-stat__value-container.user-engagement-stat__value-container--huge{margin:unset;} } /* --- END my activity --- */ /* --------------- END PLATFORM CONTENT --------------- */ /* --------------- COURSE CONTENT --------------- */ /* --- TI NATIVE (snippets) ENHANCEMENTS --- */ /* LIST ITEM */ .topic__list .topic__list__item{ display:flex; align-content:center; padding:unset; transition:none; -webkit-transition:none; border:1px solid #767676; background-color:#E5E5E5; margin-bottom: 8px!important; } .topic__list__thumb{ width: 94px; padding: 5px 0 5px 30px!important; } .topic__list__thumb .show{background-color:transparent;} .topic__list__info.topic__list__info--column, .topic__list__info.topic__list__info--full-width{ width: 100%; padding: 0; display:grid; grid-template-columns: 1fr .1fr; justify-content:space-between; align-items:center; } .topic__list__info .topic__list__title .h3, .topic__list__info.topic__list__info--full-width .topic__list__title .h3{ font-size:20px!important; } .topic__list__info.topic__list__info--column .topic__list__title{ margin:unset; padding:10px 0 10px 20px; } .topic__list__info.topic__list__info--full-width .topic__list__title{ margin:unset; padding:10px 0 10px 30px; } .topic__list__info.topic__list__info--column button, .topic__list__info.topic__list__info--full-width button{grid-area:1/2/2/3;} .topic__list__info .topic__list__description{ grid-column:1/3; padding: 24px 30px 5px 30px; background-color:#ffffff; } .topic__list__info.topic__list__info--column button, .topic__list__info.topic__list__info--full-width button:not(#webhook_get), .topic__list__item.topic__list__item--expanded .topic__list__info.topic__list__info--column button, .topic__list__item.topic__list__item--expanded .topic__list__info.topic__list__info--full-width button:not(#webhook_get){ text-align:right; margin: 0 30px 0 0; } .topic__list__info.topic__list__info--column button span:nth-child(3), .topic__list__info.topic__list__info--full-width button span:nth-child(3), .topic__list__item.topic__list__item--expanded .topic__list__info.topic__list__info--column button span, .topic__list__item.topic__list__item--expanded .topic__list__info.topic__list__info--full-width button span{display:none;} .topic__list__info.topic__list__info--column button .icon-navigatedown, .topic__list__info.topic__list__info--full-width button .icon-navigatedown{color: #000000; padding-right: unset;} .topic__list__info.topic__list__info--column button .icon-navigatedown, .topic__list__info.topic__list__info--full-width button .icon-navigatedown, .topic__list__item.topic__list__item--expanded .topic__list__info.topic__list__info--column button .icon-navigateup, .topic__list__item.topic__list__item--expanded .topic__list__info.topic__list__info--full-width button .icon-navigateup{ font-size: 24px; font-weight: 600; } .topic__list .topic__list__item .topic__list__item.topic__list__item--expanded{ align-content:flex-start; } .topic__list__item.topic__list__item--expanded{ align-items:flex-start; cursor:auto; border: 1px solid #767676; background-color: #ffffff; } .topic__list__item.topic__list__item--expanded .topic__list__thumb{ width:30%; transition: none; -webkit-transtition: none; padding: 0 10px 0 0!important; } .topic__list__item.topic__list__item--expanded .topic__list__info.topic__list__info--column{ width:70%; transition: none; -webkit-transtition: none; } .topic__list__item.topic__list__item--expanded .topic__list__info, .topic__list__item:not(.topic__list__item.topic__list__item--expanded):hover{ background-color:#0029ff;} .topic__list__item.topic__list__item--expanded .topic__list__info .topic__list__title, .topic__list__item.topic__list__item--expanded .topic__list__info button .icon-navigateup, .topic__list__item:not(.topic__list__item.topic__list__item--expanded):hover .topic__list__info .topic__list__title, .topic__list__item:not(.topic__list__item.topic__list__item--expanded):hover .topic__list__info button .icon-navigatedown, .topic__list__item:not(.topic__list__item.topic__list__item--expanded):hover .topic__list__info button i{color:#ffffff;} .list-roll__content .topic__list .topic__list__info{padding-left: 0!important;} /* SNK - topic list */ .image__zone .popup__caption_title,.topic__list__title,.topic__text__body { color: #000 } /* SLIDESHOW */ .topic__contained__wrapper.topic__contained__wrapper--slideshow{ display: flex; position: unset; height: 500px; margin-bottom: 0; border: none; } .topic__contained__wrapper.topic__contained__wrapper--slideshow .topic__contained__content{ position: unset; z-index: 0; display: flex; justify-content: center; align-items: center; float: unset; width: 60%; } .topic__contained__wrapper.topic__contained__wrapper--slideshow .topic__contained__content.topic__contained__content--no-sidebar{width: 100%;} .topic__contained__wrapper.topic__contained__wrapper--slideshow .topic__contained__content picture{ display: inline-flex; justify-content: center; align-items: center; height: 100%; } .topic__contained__wrapper.topic__contained__wrapper--slideshow .topic__contained__content picture img{ max-width: 100%; max-height: 100%; } .topic__contained__wrapper.topic__contained__wrapper--slideshow .topic__contained__sidebar{ float: unset; width: 40%; overflow-y: unset; position: unset; } .topic__contained__wrapper.topic__contained__wrapper--slideshow .topic__contained__content img{max-height: -webkit-fill-available;} .topic__contained__wrapper.topic__contained__wrapper--slideshow .topic__contained__sidebar .slide__detail{ padding: 25px; } .slide-show__controls{ display: flex; justify-content:space-between; align-items: center; margin: 4px 0; } .slide-show__controls .slide-show__count{ padding: 10px; text-align: center; line-height: normal; } .slide-show__controls .btn.btn--primary.btn--no-margin.slide-show__button{ display: flex; align-items: center; padding: 10px 30px; } .slide-show__controls .btn.btn--primary.btn--no-margin.slide-show__button i{ padding-right: 0; } .slide-show__controls .btn.btn--primary.btn--no-margin.slide-show__button span{ padding: 0 6px; line-height: normal; } @media only screen and (min-width: 64.063em){ .topic__contained__wrapper.topic__contained__wrapper--slideshow .topic__contained__sidebar .slide__detail .topic__sidebar__title { padding-right: 0; } } @media only screen and (min-width: 48.063em){ .topic__contained__wrapper.topic__contained__wrapper--slideshow .topic__contained__sidebar .slide__detail{ position: unset; overflow: scroll!important; } .topic__contained__wrapper.topic__contained__wrapper--slideshow .topic__contained__sidebar .slide__detail::-webkit-scrollbar{ width: 6px; height: 6px; } .topic__contained__wrapper.topic__contained__wrapper--slideshow .topic__contained__sidebar .slide__detail .topic__sidebar__caption { padding-bottom: 0; } } @media only screen and (max-width: 48.063em){ .topic__contained__wrapper.topic__contained__wrapper--slideshow{ flex-direction: column; height: 600px; overflow: scroll } .topic__contained__wrapper.topic__contained__wrapper--slideshow::-webkit-scrollbar{ width: 6px; height: 6px; } .topic__contained__wrapper.topic__contained__wrapper--slideshow .topic__contained__content{ width: 100%; } .topic__contained__wrapper.topic__contained__wrapper--slideshow .topic__contained__content picture{ height: 350px; } .topic__contained__wrapper.topic__contained__wrapper--slideshow .topic__contained__sidebar{ width: 100%; } } @media only screen and (max-width: 600px){ .topic__contained__wrapper.topic__contained__wrapper--slideshow .topic__contained__content picture{ height: 250px; } .slide-show__controls .btn.btn--primary.btn--no-margin.slide-show__button{ padding: 10px 4%; } } /* NATIVE TABLES */ table:not(.tw-override) td:not(.tw-override){border: 1px solid #000000; align-content: baseline;} .editor-content table thead th, .editor-content table thead td{background-color: #000000; border: 1px solid #ffffff!important;} .editor-content table tbody th{background-color: #E5E5E5; border: 1px solid #000000;} .editor-content table thead th:not(:last-child){border-right: 1px solid #ffffff;} /* backend */ .redactor-styles table thead th{background-color: #000000; color: #ffffff; text-transform: uppercase;} .redactor-styles table tbody th{background-color: #E5E5E5; border: 1px solid #000000;} /*.redactor-styles table th:not(:last-child){border-right: 1px solid #ffffff;}*/ /* --- END TI native (snippets) enhancements --- */ /* --- CUSTOM SNIPPETS --- */ /* Common styling -- IMPORTANT */ .infobox-container, .different-color{margin:45px 0;} /* INFOBOX */ .infobox-container{ width: 100%; display: flex; justify-content: center;} .infobox-note{ display: flex; border: 1px solid #0029FF; border-radius: 10px; background-color: #E5E9FF; width: 75%; padding: 30px 40px 16px 30px;} .infobox-iconContainer{padding: 0 20px 16px 0;} .infobox-iconContainer .icon-info{color: #0029FF; font-size: 3rem; } .infobox-text{margin-top:8px;} @media screen and (max-width:600px){ .infobox-note{ display: flex; flex-direction: column; padding: 20px 30px; } .infobox-iconContainer .icon-info{ margin-right: 0; margin-bottom: 20px; display:flex; justify-content:center; } } .infobox-title, .infobox-title h5{margin: 8px 0 16px 0; font-size: 22px; font-weight: 700;} /* warning version */ .infobox-note.infobox-warning{background-color:#ffdDdD; color:#8e0000; border:1px solid #8e0000;} .infobox-warning .icon-info:before{color:#8e0000;} /*.infobox-warning .infobox-text{color: #8e0000;}*/ /* TITLE + DESCRIPTION */ .tdContainer{margin: 10px 0; display: grid; grid-template-columns: 25% 0 75%; align-items:center; justify-items: center; -webkit-box-shadow:none; box-shadow:none;} .tdTitle{ padding: 2% 20px; text-align: right; } .tdTitle p{ font-weight: 700; margin: 0; } .line{ height: 100%; border: 1px solid #e5e5e5; } .tdDescription{ padding: 20px 50px; width: 100%;} @media screen and (max-width:1000px){ .tdContainer{ align-items: start; } .tdTitle{ padding: 20px; } } @media screen and (max-width:600px){ .tdContainer{ grid-template-columns: 15% 0 85%; } .tdTitle{ writing-mode: vertical-rl; transform: rotate(180deg); } .tdDescription{ padding: 20px 30px; } } /* ACCORDION (Accessibility compliant) */ .accordion-wrapper2 /* -> */, .accordionSnippet2, details.accordion{margin-bottom: 10px!important;} .accordion-wrapper2:first-child{padding-top:20px;} .accordion-label2 /* -> */, .accordion summary{width: 100%; margin: 0px!important; padding: 10px 30px; display: flex!important; align-items: center; justify-content: space-between; background: #E5E5E5; border:1px solid #767676; color:#000000; font-family: Poppins; font-size: 20px; font-weight: bold; cursor: pointer; } .accordion-label2:hover, .accordion-label2.open /* -> */, .accordion-label2:hover h3.courseTitle, .accordion-label2.open h3.courseTitle, details[open].accordion summary, details[open].accordion summary h3, .accordion summary:hover, .accordion summary:hover h3, .accordion summary:hover .icon-navigateright{background: #0029FF;color: #FFFFFF;} .accordion-label2 span.accordion-title /* -> */, .accordion-label2 h3.courseTitle, .accordion summary h3{margin:4px 10px 4px 0!important; width:100%; text-align: left; font-size:24px!important; line-height: 30px!important;white-space: nowrap; overflow: hidden; text-overflow: ellipsis; padding: 0!important;} .accordion-label2.open span.accordion-title{white-space: revert;} .accordion-label2 .icon-navigateright, /* -> */ .accordion summary .icon-navigateright{font-size:24px; font-weight: 800;} .accordion-label2.open .icon-navigateright, /* -> */ div.accordion-arrow2{transform: rotate(90deg); transition: all 0.3s; } .accordion-content:not(.accordion-wrapper .accordion .accordion-content, .accordion .accordion-content){display: none; padding: 20px 30px 10px 30px!important; max-height: unset!important; color: #000000; background-color: #ffffff; border: 1px solid #767676; border-top:none;} .accordion-content.show, .redactor-box .redactor-styles .accordion-content{display: block!important; max-height: unset!important; /* -> */white-space: unset;} .accordion-content.show p{display: block!important; margin: 0 0 16px 0;} /*to delete eventually*/ .redactor-box .redactor-styles .accordion-label2{background: #0029FF;color: #FFFFFF;} /* SNK - ACCORDION */ .accordion-wrapper { box-shadow: 0 4px 4px -2px rgba(0,0,0,.5); margin: 0 auto; max-width: 1000px; overflow: hidden } .accordion { color: #fff; margin-bottom: 8px; overflow: hidden; width: 100% } .accordion input { margin-left: 0!important; opacity: 0; position: absolute; z-index: -1 } .accordion input:checked+.accordion-label { background: #0029ff; color: #fff } .accordion input:checked+.accordion-label:after { right: 10px; top: 20px; transform: rotate(90deg) } .accordion input:checked~.accordion-content { max-height: 100vh; padding: 16px } .accordion:last-child { margin-bottom: 0 } .accordion-label { background: #e2e2e2; color: #000; cursor: pointer; font-size: 20px; font-weight: 700; margin-left: 0!important; padding: 16px; position: relative; width: 100% } .accordion-label:hover { background: #0029ff; color: #fff } .accordion-label:after { content: "❯"; height: 16px; position: absolute; right: 10px; top: 15px; transition: all .3s; width: 16px } .accordion-content { background: #fff; color: #000; max-height: 0; padding: 0 16px; transition: all .3s } .accordion-content p { color: #000; font-size: 18px; margin: 0 } /* TABS snippet v1 (OLD) */ .tabSnippet{ margin: 0; padding: 0; width: 100%; max-width: unset; display: flex; flex-direction: column; flex-wrap: nowrap; border: none; box-shadow: none; } .tabsSnippet-container{ display: flex; width: 100%; border: none; cursor: pointer; margin-bottom: 10px; } .tabsSnippet-tab{ padding: 20px 5%; width: 100%; background-color: #E2E2E2; color: #606060; text-align: center; font-weight: 700; display: flex; justify-content:center; align-items:center; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; } .tabsSnippet-tab:nth-child(2){ margin: 0 10px; } .tabSnippet .show{ background-color:#0029FF; color: #FFFFFF; overflow: unset; text-overflow: unset; white-space: break-spaces; } .tabsSnippet-title{ white-space: nowrap; overflow: hidden; text-overflow: ellipsis; } .tabsSnippet-text{ display:none; padding: 15px 25px; border: 1px solid #0029FF30; border-radius: 10px; } .showText{ display: block; } @media screen and (min-width:48.063em){ .tabsSnippet-tab{ border-bottom: 0; } } @media screen and (max-width:600px){ .tabSnippet .show{ width: 80rem; } .show .tabsSnippet-title{ width: 100%; white-space: unset; overflow: unset; } } /* TABS snippet v2 (NEW) */ .tabSnippet-1{ display: grid; padding: 20px 0; column-gap: 5px; row-gap: 10px; } .tabSnippet-1 label{ padding: 15px; background-color: #e2e2e2; color: #606060; text-align: center; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; font-weight:500; margin:0!important; align-content:center; } .tabSnippet-1 label:nth-child(2){grid-column: 1/2;} .tabSnippet-1 label:nth-child(5){grid-column: 2/3;} .tabSnippet-1 label:nth-child(8){grid-column: 3/4;} .tabSnippet-1 label:nth-child(11){grid-column: 4/5;} .tabSnippet-1 label:nth-child(14){grid-column: 5/6;} .tabSnippet-1 label:nth-child(17){grid-column: 6/7;} .tabSnippet-1 input{display: none;} .tabSnippet-1 input:checked + label{ font-weight: 900; background-color: #0029ff; color: #ffffff; white-space: normal; } .tabSnippet-1 .tabSnippet-1-tab{ display: none; grid-row: 2/3; padding: 16px 24px 8px 24px; background-color: #ffffff; border: 1px solid #0029FF30; border-radius: 7px; grid-column: 1/4; } .tabSnippet-1.twotabs .tabSnippet-1-tab{grid-column: 1/3;} .tabSnippet-1.threetabs .tabSnippet-1-tab{grid-column: 1/4;} .tabSnippet-1.fourtabs .tabSnippet-1-tab{grid-column: 1/5;} .tabSnippet-1.fivetabs .tabSnippet-1-tab{grid-column: 1/6;} .tabSnippet-1.sixtabs .tabSnippet-1-tab{grid-column: 1/7;} .tabSnippet-1 input:checked + label + .tabSnippet-1-tab{display: block;} /* IMAGE NEXT TO TEXT (intt) */ body.learn.course.lesson .inttSnippet{ padding: 10px 0; width: 100%; } body.learn.course.lesson .inttImageContainer:not(.center){max-width:40%;} body.learn.course.lesson .inttImageContainer.left{ float:left; margin-right:3%; } body.learn.course.lesson .inttImageContainer.right{ float:right; margin-left:3%; } body.learn.course.lesson .inttImageContainer.center{ width: 100%!important; display:flex; justify-content:center; } body.learn.course.lesson .inttImageContainer img{ width: auto; cursor: pointer; } body.learn.course.lesson .inttGallery{ position: fixed!important; right:0; top:60px; z-index:1; display: flex; flex-direction: column; align-items: center; justify-content: center; background-color: rgba(255, 255, 255, 88%); width: 100%; height: calc(100vh - 60px); cursor: auto!important; } body.learn.course.lesson .inttGallery p{ position: sticky; top: 10vh; width: 100%; font-size: 1.4em; font-weight: 600; color: #000000; text-align: right; } /*body.learn.course.lesson .inttGallery p:not(.inttGallery div p){top: 68px; width: 100%; margin-right:55px; z-index:1; position:absolute;}*/ body.learn.course.lesson .inttGallery div{/*position:sticky; top:14vh;height:80vh;*/ height: 100%;} body.learn.course.lesson .inttGallery div p{ height: 100%; display:flex; align-items:center; justify-content:center; } body.learn.course.lesson .inttGallery div img{ max-height: 90%!important; max-width:98%; height: unset!important;} body.learn.course.lesson .hide{ display: none; } body.learn.course.lesson .inttGallery img{ height: 100%;} @media only screen and (max-width: 900px){ body.learn.course.lesson .inttSnippet{ display: flex!important; flex-direction: column; align-items: center; } body.learn.course.lesson .inttImageContainer{ width: 100%; margin-bottom: 18px; display: flex; justify-content: center; } body.learn.course.lesson .inttImageContainer.left{ margin-right: 0; } body.learn.course.lesson .inttImageContainer.right{ margin-left: 0; } body.learn.course.lesson .inttGallery{ display:none; } } /* Gallery button */ body.learn.course.lesson .inttGallery .galleryCloseButton{ position: absolute; z-index: 2; top: 70px; right: 4%; background-color: var(--color-brand-blue); color: var(--color-brand-white); border-radius: 4px; border: 1px solid #0029ff; font-size: 17px; font-family: var(--typography-font-family); } body.learn.course.lesson .inttGallery .galleryCloseButton:hover{ background-color: var(--color-brand-white); color:var(--color-brand-blue); } /* Image zoom */ body.learn.course.lesson .inttGallery .imgZoom{ width: 85%; height: 90%; display: flex; justify-content: center; align-items: center; } body.learn.course.lesson .inttGallery .imgZoom img{ object-fit: contain; } body.learn.course.lesson .inttGallery .imgZoom:before{ display:var(--display); position: absolute; content: ''; width: 85%; height: 90%; background-color: #ffffff!important; background-image: var(--url); background-size: 150%; background-position: var(--zoom-x) var(--zoom-y); background-repeat: no-repeat; cursor: zoom-in; } /* Img settings to fit with new snippets*/ figure, body.learn.course.lesson li:not(.topic__list__item img) img{margin: 0 0 26px 0;} figcaption{margin-top: 6px;} body.learn.course.lesson p img{margin-bottom: 10px; max-height: 400px;} /* EXTERNAL SOURCE --- DELETE IMPORTANTS */ .extSource{ align-items:center; gap:unset; /*New ->*/ display:flex; justify-content: center; margin: 60px 0;} .extSource-wrap{max-width: 750px; width:100%; display:flex; align-items:center; justify-content:space-between;} .extSource-title{font-size: 22px; font-weight:700; line-height: 33px; margin-bottom: 16px!important;} .extSource-text{margin-right:40px} .extSource-text h4.courseTitle, .extSource-text h4{margin-top:unset!important;} .extSource a{ font-family:poppins; font-size: 17px; padding:12px 34px!important; font-weight:600; color:#ffffff!important; background-color:#0029FF; text-decoration:unset!important; text-wrap:nowrap; border:1px solid #0029ff; border-radius:50px; } .extSource a:hover{ background-color:#ffffff; color: #0029FF!important; text-decoration:unset!important; } @media only screen and (max-width: 64em){ .extSource{ flex-direction:column; gap:0; padding:10px 30px 30px; } .extSource .extSource-wrap{flex-direction:column; align-items:stretch;} .extSource a{text-align: center;} /*delete->*/.extSource-text, .extSource-btn{width:100%; margin-right:unset;} } /*delete from here once all extsource have been updated*/ .extSource-text{width: 100%;} .extSource-btn{display:flex; justify-content:center; width: 200px;} /* CODE LINE */ body.course .editor-content pre, .redactor-styles pre:not(pre.code-format), pre.code-format {color:#0029FF; background:#e9e9e9; font-family: monospace, monospace; font-size: 1rem; text-wrap: wrap; padding: 20px;} /* CHECKBOXES */ .manager input:not([type=checkbox]):not([type=file]):not(.prefix-input input){flex:unset;} .radio-checkbox, .checkbox{display:flex; align-items:flex-start;} .radio-checkbox input, .checkbox input{margin:7px 10px 0 0; height: 16px; width:18px;} .radio-checkbox label, .checkbox label{width: 100%; color: #000000; font-size: 16px;} /* TEXT ON IMAGE */ /* CONTENEDOR PRINCIPAL */ .textonimage { position: relative; margin: 0 clamp(12px, 4vw, 50px); display: flex; justify-content: center; align-items: center; overflow: hidden; } /* IMAGEN */ .textonimage .image { width: 100%; height: 100%; } .textonimage .image img { width: 100%; height: auto; max-height: 600px; object-fit: cover; display: block; } /* TEXTO SOBRE LA IMAGEN */ .textonimage .text { position: absolute; inset: 0; display: flex; flex-direction: column; justify-content: center; align-items: flex-start; padding: clamp(8px, 5vw, 70px); box-sizing: border-box; font-size: clamp(12px, 3.5vw, 60px); line-height: 1.1; width: 100%; height: 100%; max-height: 100%; overflow: hidden; word-break: break-word; overflow-wrap: break-word; } /* DECORATIVO */ .textonimage .text::before { content: ""; width: clamp(30px, 6vw, 70px); height: clamp(2px, 4px, 4px); margin-bottom: clamp(4px, 1.5vw, 10px); background-color: #fff; filter: drop-shadow(2px 2px 4px #000); } /* PÁRRAFO INTERNO */ .textonimage .text p { margin: 0 0 0.3em 0; font-size: clamp(10px, 3vw, 34px); line-height: 1.3; color: #fff; filter: drop-shadow(2px 2px 4px #000); width: 100%; max-height: 100%; word-break: break-word; overflow-wrap: break-word; } /* FULL WIDTH */ .textonimage.full { margin: 0; } .textonimage.full .image img { max-height: unset; } .textonimage.full .image, .textonimage.full .image p img { width: 100%; } /* MÓVILES PEQUEÑOS: PANTALLAS <481px */ @media (max-width: 480px) { .textonimage .text { font-size: 16px; /* mantener letra pequeña fija */ padding: 6px 12px; justify-content: center; } .textonimage .text p { font-size: 12px; /* letra pequeña fija */ line-height: 1.2; } .textonimage .image img { max-height: 300px; } } /* ON PAGE QUIZ */ .onpagequizz{margin: 40px 30px!important; padding: 20px 40px; border:2px solid #0029ff; border-radius: 10px;} .onpagequizz .question{font-size:20px; font-weight:800; margin-top:8px;} .onpagequizz ul.answers{margin-left:0;} .onpagequizz .answers{display: flex; flex-direction: column; align-items: flex-start; gap:10px;} .onpagequizz ul.answers li{display:inline-block;} /* answers styling */ .onpagequizz .answers div:not(.result, #result){display: flex; flex-direction: column; align-items: flex-start;} .onpagequizz .answers button{padding: 10px 20px; background-color: transparent; border: none; margin:0; font-size:17px; line-height:30px; text-align:left;} .onpagequizz .result{display: none; padding: 10px 20px;} .redactor-styles.redactor-in .onpagequizz .answers .result, .redactor-styles.redactor-in .onpagequizz .answers #result{display: block;} .onpagequizz ul.answers li #result{display:none; padding-top: 12px;} .onpagequizz .answers button:not(button.answer):focus + .result{display: inline-block;} .onpagequizz .answers .result{font-weight: 600;} .onpagequizz .answers .result.correct{color: #0029ff;} .onpagequizz .answers .icon-check, .onpagequizz .answers .icon-delete{margin-right:10px; margin-top: 6px;} /* interactions */ .onpagequizz button:hover, .onpagequizz button:focus{background-color: var(--color-grey-background-hover)!important; box-shadow: none!important;} .onpagequizz li button.answer:active, .onpagequizz li button:not(button.correct).answer[aria-expanded=true]{background-color: var(--color-text-red)!important; color: #ffffff; box-shadow: unset;} /*.onpagequizz .answers li button:focus{background-color: #000000; color: #ffffff;}*/ .onpagequizz li button.answer.correct:active, .onpagequizz li button.answer.correct[aria-expanded=true]{background-color: #0029ff!important; color:#ffffff; box-shadow: unset;} .answers button:not(.answers li button):focus.correct{background-color: #0029ff; color:#ffffff;} .onpagequizz .answers li div.correct{color: #0029ff;} /* DIFFERENT BACKGROUND-COLOR */ .different-color{padding: 30px 30px 14px 30px!important; background-color: #E5E9FF!important;} /* Statement quote */ .block-statement__quote{margin:45px 0;} .block-statement__quote p, .block-statement__quote{font-size: 32px; font-weight: 400; font-family: Poppins; line-height: 1.5; text-align: center;} .block-statement__quote.top:before, .block-statement__quote.bottom:after {content: ""; width: 40%; height: .3rem; display:flex; background: #0029FF;} .block-statement__quote.top:before{margin: auto auto 35px;} .block-statement__quote.bottom:after {margin: 35px auto auto;} /* QUOTE */ div.quote-cont {margin: 60px 6% 76px; padding: 3rem 5rem; color: #000000; background: #ffffff; border: 1px solid #000000; } .quote-cont p {font-size: 19px; color: #000000;} .quote-cont cite, .quote-cont .quote-person p{font-size: 16px; font-style: italic; color: #767676;} .quote-cont .quote-person p{margin-bottom:0;} .quote-person { display:inline-flex; align-items:center;} .quote-person img {height: 50px; width: 50px; margin-right: 30px; border-radius: 50%;} /* LIST - FORMATTED NUMBERED BULLETS AND SUB-BULLETS */ /* first level */ .redactor-styles ol.list-circles, .list-circles{margin: 50px 0 70px;} .list-circles li::before{content: counter(li); width: 2.5rem; height: 2.5rem; top: -0.25em; font-size: 20px; background-color: #0029FF;} .list-circles li:not(:last-child){padding-bottom: 30px;} /* second level */ .list-circles ol{margin: 20px 0!important; margin-left: 0;} .list-circles ol li::before{content: counter(li, lower-alpha); width: 2rem; height: 2rem; top: 0; font-size: 17px; background-color: #000000;} .list-circles ol li:not(:last-child){padding-bottom: 20px;} /* both */ .list-circles, .list-circles ol{counter-reset: li; padding: 0; list-style:none;} .list-circles li, .list-circles ol li {list-style: none; padding-left: 4rem!important; position: relative;} .list-circles li::before, .list-circles ol li::before{counter-increment: li; position: absolute; left: 0; display: flex; align-items: center; justify-content: center; font-weight: 800; color: #ffffff; border-radius: 50%;} ol.list-circles ol li {list-style-type: none !important;} .list-circles li::after, .list-circles ol li::after{counter-increment:unset!important; content: unset!important;} /* LIST STEPS - STEP PROGRESSS */ .vertical-stepper-wrapper {margin: 50px 0!important;} .StepProgress {position: relative; list-style: none; margin-left: 44px!important;} /*delete*/.StepProgress::before {display: none;} .StepProgress-item {position: relative; counter-increment: list; padding-left: 30px;} .StepProgress-item:not(:last-child) {padding-bottom: 40px;} li.StepProgress-item::before { content: ''; display: flex!important; align-items: center; justify-content: center; position: absolute; top: -6px; left: -40px!important; z-index: 1; width: 48px!important; height: 48px!important; border: 4px solid #767676!important; border-radius: 50%; background-color: #ffffff; color: #ffffff; text-align: center; font-size: 20px; } li.StepProgress-item.is-done::before {content: "✔";} li.StepProgress-item.current::before {content: counter(list);} li.StepProgress-item.is-done::before, li.StepProgress-item.current::before{border-color: #0029FF!important; background-color: #0029FF!important;} li.StepProgress-item::after { display: inline-block; content: ''!important; position: absolute; left: -19px!important; height: 100%!important; width: 6px!important; background-color: #767676!important; /**/ top: 0!important; border: unset; border-radius: unset; } li.StepProgress-item.is-done::after, li.StepProgress-item.current::after{background-color: #0029FF!important; border:unset;} li.StepProgress-item:last-child::after, li.StepProgress-item.is-done:last-child::after, li.StepProgress-item.current:last-child::after {background-color: transparent!important;} /* BLUE LINE SEPARATOR */ hr.blue-line-separator { height:1px; background:#0029FF; margin: 60px auto 75px; width:75%; background-image: linear-gradient(90deg, #e5e9ff 0%, #0029FF 10%, #0029FF 90%, #e5e9ff 100%);} .redactor-in figure[data-redactor-type=line] hr.blue-line-separator { height:1px; background:#0029FF; margin:45px auto; width:75%; background-image: linear-gradient(90deg, #e5e9ff 0%, #0029FF 10%, #0029FF 90%, #e5e9ff 100%);} /* DIVIDER WITH NUMBER */ .divider-wrapper{margin: 60px 0;} .divider-line { width: 100%; height: 2px; margin: 50px auto; display: flex; align-items:center; justify-content: center; background-image: linear-gradient(90deg, #e5e9ff 0%, #0029FF 10%, #0029FF 90%, #e5e9ff 100%) } .divider-number { width: 40px; line-height: 40px; border-radius: 50%; font-size: 20px; text-align: center; color: #ffffff; background-color: #0029ff; } /* BIGGER TEXT (NO TITLES) */ .textXXL{ font-family:Poppins!important; font-size:32px; font-weight:800; margin:50px 0 !important} /* ITEMS TITLES */ .itemTitle{ font-size:24px; font-weight:700; line-height: 39px; margin:28px 0 16px 0; } /* PAGE TRANSITION */ .page-transi{background: #f5f5f5; padding-bottom: 3rem; padding-top: 3rem; padding-left: 15%; padding-right: 10%;} .page-transi p{margin-top:1.5rem; font-size: 1.5rem;} .page-transi:before {content: ""; display: block; height: .25rem; width: 15%; background: #0029FF;} /* TABS ACCESSIBLE -- Test */ .snippet--tabs-wrapper{padding: var(--snippets-spacing-M-vertical);} .snippet--tabs-top-wrapper{position: relative;} .snippet--tabs-buttons-wrapper{ display: flex; overflow: auto hidden; scrollbar-width: none;} .snippet--tabs-buttons-wrapper button{ padding: 1rem; margin: 0; max-width: 25%; color: var(--color-grey-paragraph-text); background-color: var(--color-brand-white); border: none; border-top-left-radius: var(--buttons-border-radius); border-top-right-radius: var(--buttons-border-radius); text-align: center; cursor: pointer;} .snippet--tabs-buttons-wrapper button:hover{ background-color: var(--color-grey-background-hover);} .snippet--tabs-buttons-wrapper button .tab-title{ font-size: var(--typography-paragraph-font-size); font-weight: var(--typography-font-weight);} .snippet--tabs-buttons-wrapper button.tab-selected{ color: var(--color-brand-white); background-color: var(--color-brand-blue); border-color: var(--color-brand-blue); font-weight: 900;} .snippet--tabs-content{ display: none; padding: 26px 1rem 8px; background-color: var(--color-brand-white); border-top: 1px solid var(--color-brand-blue); border-bottom: 1px solid var(--color-brand-blue); } .snippet--tabs-content.tab-content-show, .redactor-styles .snippet--tabs-content{display: block;} @media only screen and (max-width: 48.063em){ .snippet--tabs-buttons-wrapper button{ min-width: 40%;} .snippet--tabs-buttons-wrapper{scrollbar-width: unset; padding-bottom: 3px;} .snippet--tabs-buttons-wrapper::-webkit-scrollbar{height: 4px;} .snippet--tabs-buttons-wrapper::-webkit-scrollbar-thumb{background: var(--color-brand-blue);} } /* PROCESS SNIPPET */ .processSnippet { display: grid; grid-template-columns: repeat(auto-fit, minmax(171px, 1fr)); margin: 50px 0 50px 40px; } .processSnippet .processSnippet-wrapper { display: flex; align-items: center; justify-content: space-between; margin:10px 0; } .processSnippet .processSnippet-wrapper:last-child {margin-right: 50px;} .processSnippet .processSnippet-wrapper span{ margin: 10px; font-size: 30px; background-color: transparent; } .processSnippet .processSnippet-item { height:100%; width:100%; background-color: var(--color-grey-background-default); padding: 1rem 1rem 0 1rem; text-align: left; border-radius: var(--card-border-radius); } .processSnippet .card-title { font-size: var(--card-title-XS-size); font-weight: var(--typography-font-weight); font-family: var(--typography-font-family); } @media (max-width: 900px) { .processSnippet, .processSnippet .processSnippet-wrapper { margin:50px 0; display:flex; flex-direction: column; justify-content: center; } .processSnippet .processSnippet-item {min-width: 140px; width: 100%;} .processSnippet .processSnippet-wrapper{margin:0;} .processSnippet .processSnippet-wrapper:last-child{margin:unset;} .processSnippet .processSnippet-wrapper span{transform: rotate(90deg);} } /* --- END custom snippets --- */ /* --- LEGACY snippets - TO BE DELETED once all are updated --- */ .accordion input:checked~.accordion-content {max-height: unset!important;} /* LEGACYAccordion */ .accordionSnippet{ width: 100%; } .accordionSnippet-tile{ margin-bottom: 20px; } .accordionSnippet-title{ padding: 20px; display: flex; justify-content: space-between; align-items: center; font-size: 1.4em; font-weight: 800; background-color: #e2e2e2; color: #000000; cursor: pointer; } .accordion-titleExpand{ white-space: nowrap; overflow: hidden; text-overflow: ellipsis; } .accordionSnippet-title:hover{ background-color: #0029ff; color: #ffffff; } .accordionSnippet-arrow{ transform: rotate(0); margin-left: 20px; } .accordionSnippet-arrow::after{ content: "\276F"; } .accordionSnippet-animation{ transform: rotate(90deg); } .accordionSnippet-text{ } .accordionSnippet-text{ padding: 20px; display: block; border: 1px solid #CCCCCC; border-top: none; background-color: #FFFFFF; color: #000000; } .accordionSnippet-text p{ color: #000000; } .hide{ display: none; } /* LEGACYAccordion */ /*.accordion-wrap {display: flex;flex-direction: column;}*/ input.accordion-check {position: absolute;opacity: 0;z-index: -1;margin-left: 0px !important;display: flex;} .accordion-label2 h3{margin-bottom: 0;} input:checked + .accordion-label2, input:checked + .accordion-label2 h3.courseTitle{background: #0029FF;color: white;} input:checked + .accordion-label2 h3.courseTitle{white-space: normal;} input:checked + .accordion-label2 div.accordion-arrow2 {transform: rotate(90deg);} .accordion-arrow2::after{content: "\276F";} input:checked ~ .accordion-content{display: block!important; max-height: 9999vh;padding: 20px 30px;}*/ input:checked ~ .accordion-content p{display: inline;} .accordionWrapper{padding: 10px 0 30px;} .accordion summary::-webkit-details-marker{display:none;} details[open].accordion summary h3{white-space:unset;} details[open].accordion summary .icon-navigateright{rotate:90deg; color:#ffffff;} .accordion .dropdown-content{padding:20px 30px 10px 30px; border:1px solid #767676; border-top:none; background-color:#ffffff; color:#000000;} /* --- END legacy snippets --- */ /* --- CENTRAL ASSETS --- */ /* INTRO - OUTRO */ .centralasset.textonimage{min-width:277px;} .centralasset.textonimage.intro{margin-bottom:70px;} .centralasset.textonimage.outro{margin-top: 70px;} .centralasset.textonimage .image{height:400px; width:100%; background: url("https://d3i9g4671ronu3.cloudfront.net/course-uploads/1cc62825-20df-4077-8216-a9df1132a5ad/bqb11bf6kuqh-Bannerunification_March25_03.png") no-repeat 75%; background-size:cover; background-position-y:35%;} .centralasset.textonimage .text:before{display: none;} .centralasset.textonimage .text{padding: 0 0 0 8.5%; width: 74%; z-index:1;} .centralasset.textonimage .text p{font-size:24px; line-height:35px; font-weight: 400;} .centralasset.textonimage .text p.text-bolder{font-weight: 900;} .centralasset.textonimage .text p.text-italic{font-style: italic;} .centralasset.textonimage .text p.signature{margin-bottom: 0; margin-top: 16px;} .centralasset.textonimage .text p.welcome{font-size: 50px; font-weight: 800;} @media only screen and (min-width: 60em) and (max-width: 90em) { .centralasset.textonimage .image{background: url("https://d3i9g4671ronu3.cloudfront.net/course-uploads/1cc62825-20df-4077-8216-a9df1132a5ad/bqb11bf6kuqh-Bannerunification_March25_03.png") no-repeat 85%;background-size:cover; filter:brightness(60%);} .centralasset.textonimage .text{width: 71%;} .centralasset.textonimage .text p{font-size:20px; line-height:30px;} .centralasset.textonimage .text p.welcome{font-size: 44px;} } @media only screen and (max-width: 60em) { .centralasset.textonimage .image{height:450px; background: url("https://d3i9g4671ronu3.cloudfront.net/course-uploads/1cc62825-20df-4077-8216-a9df1132a5ad/pqe1oxe0ivsb-Bannerunification_March25_03.png") no-repeat; background-size:cover;background-position-x:right;} .centralasset.textonimage .text{padding: 0 8.5% 0 8.5%; width: 100%;} .centralasset.textonimage .text p{font-size:20px; line-height:30px;} } /* --- END central assets --- */ /* --------------- END course content --------------- */ /* Give feedback button - Language */ button#QSIFeedbackButton-btn div div{rotate:180deg;} /* Search Unify SU CSS */ .su__list-item-desc .highlight{border-bottom: none!important;} h2.su__text-truncate.su__my-0.su__font-14.su__line-height-n{text-transform: unset!important;} /* ----- always in the end ----- */ /* EVENTS design */ .aspect-\[2\/1\] {aspect-ratio: unset; height: 190px;} .learn .in-person-event .event-sidebar__container .event-sidebar{margin-top: -120px;} .event-sidebar__container .event-sidebar__header {padding: 30px 30px 0;} .event-sidebar__container .event-sidebar__content {padding: 0 30px 30px;} .event-sidebar__meeting__date span {line-height: 22px;} .learn.in-person-event .medium-8.large-9.columns.event-content {padding-left: 24px!important; padding-right: 24px!important;} @media only screen and (min-width: 64.063em) { a.learning-content__back-button {padding: 26px 100px 13px!important;} } /* SNK - learning-content__back-button */ .learning-content-hero { background-color: #000 } @media only screen and (max-width: 48em) { .learning-content-hero .learning-content__back-button,.learning-content-hero picture { position:relative!important } } .learning-content-hero .picturefill img { -o-object-fit: cover; object-fit: cover } @media only screen and (max-width: 48em) { .learning-content-hero .picturefill img { height:100% } } @media only screen and (min-width: 48.063em) { .learning-content-hero .picturefill img { max-height:646px } } @media only screen and (max-width: 48em) { .learning-content-hero--no-asset { height:auto } .learning-content-hero--no-asset .learning-content-hero__caption { padding-top: 24px } } .learning-content__back-button { border: none; color: #fff!important; padding: 26px 24px!important } @media only screen and (max-width: 48em) { .learning-content__back-button { margin-bottom:0!important; padding-bottom: 8px!important } } @media only screen and (min-width: 48.063em) and (max-width:64em) { .learning-content__back-button { padding:26px 32px!important } } @media only screen and (min-width: 64.063em) { .learning-content__back-button { padding:72px 100px 13px!important } } .learning-content__back-button i { margin-right: 8px } .learning-content__back-button i:before { background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg width='17' height='12' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath fill-rule='evenodd' clip-rule='evenodd' d='M.25 5.973c0-.145.034-.253.103-.326.035-.036 1.41-1.628 4.125-4.776.069-.073.172-.109.31-.109.137 0 .24.036.309.109.206.217.206.434 0 .651L1.642 5.539h14.695c.276 0 .413.145.413.434 0 .29-.137.434-.413.434H1.642l3.455 4.017c.206.217.206.434 0 .651-.206.218-.413.218-.619 0L.353 6.3C.284 6.226.25 6.118.25 5.973Z' fill='%23fff'/%3E%3C/svg%3E"); background-position-y: 1px; background-repeat: no-repeat; color: transparent; height: 12px; width: 17px } .learning-content-hero .w-full.py-0.px-10.absolute.left-0,.learning-content-hero__caption { padding: 0 24px; top: 76px } @media only screen and (max-width: 48em) { .learning-content-hero .w-full.py-0.px-10.absolute.left-0,.learning-content-hero__caption { height:auto; padding-bottom: 32px; padding-top: 0; position: relative; top: auto } } @media only screen and (min-width: 48.063em) and (max-width:64em) { .learning-content-hero .w-full.py-0.px-10.absolute.left-0,.learning-content-hero__caption { padding:0 32px } } @media only screen and (min-width: 64.063em) { .learning-content-hero .w-full.py-0.px-10.absolute.left-0,.learning-content-hero__caption { padding:45px 100px 0 } } .learning-content-hero .w-full.py-0.px-10.absolute.left-0 h1,.learning-content-hero__caption h1 { margin-bottom: 24px } .learning-content-hero .w-full.py-0.px-10.absolute.left-0 h4,.learning-content-hero__caption h4 { font-family: Inter; font-weight: 300 } .learning-content-hero__overlay { display: none } @media only screen and (max-width: 48em) { .learning-content-hero--no-asset {height: 190px!important;} } /* SNK - hero*/ /* REMOVE repeated code .h2,.hero .hero__caption .hero__title,.learning-content-hero .w-full.py-0.px-10.absolute.left-0 h1,.learning-content-hero__caption h1,h2 { font-weight: 800 }*/ @media only screen and (max-width: 48em) { .h2,.hero .hero__caption .hero__title,.learning-content-hero .w-full.py-0.px-10.absolute.left-0 h1,.learning-content-hero__caption h1,h2 { font-size:32px; line-height: 42px } } /* REMOVE hero @media only screen and (min-width: 48.063em) { .h2,.hero .hero__caption .hero__title,.learning-content-hero .w-full.py-0.px-10.absolute.left-0 h1,.learning-content-hero__caption h1,h2 { font-size:54px; line-height: 72px } }*/ /* KEEP widget title */ .h2.widget__title,.hero .hero__caption .widget__title.hero__title,.widget__alt-title__container h3 { /* margin: 20px 0 64px;*/ text-align: left } @media only screen and (max-width: 48em) { .h2.widget__title,.hero .hero__caption .widget__title.hero__title,.widget__alt-title__container h3 { margin:32px 0 24px } } /* KEEP hero */ .hero { background: #000; display: grid } /* KEEP hero */ .hero,.hero picture { height: auto } @media only screen and (min-width: 1290px) { .hero,.hero picture { height:318px } } /* KEEP hero */ .hero .hero__caption,.hero picture { grid-area: 1/-1 } @media only screen and (max-width: 48em) { .hero picture { grid-row:1/2 } } /* KEEP hero */ .hero picture img { height: 100%; -o-object-fit: contain; object-fit: contain; -o-object-position: right; object-position: right } /* KEEP hero */ @media only screen and (min-width: 64.063em) { .hero picture img { padding-right:100px } } /* KEEP hero */ .hero .hero__caption { align-items: flex-start; background: transparent; display: flex; flex-direction: column; justify-content: center; padding-left: 24px; padding-right: 24px; position: static } /* KEEP hero */ @media only screen and (max-width: 48em) { .hero .hero__caption { grid-row:2/3 } } /* KEEP hero */ @media only screen and (min-width: 48.063em) and (max-width:64em) { .hero .hero__caption { max-width:60%; padding-left: 32px; padding-right: 32px } } /* KEEP hero */ @media only screen and (min-width: 64.063em) { .hero .hero__caption { max-width:70%; padding-left: 100px; padding-right: 100px } } /* KEEP hero */ .hero .hero__caption .hero__title,.hero .hero__caption span { color: #fff } /* KEEP hero */ .hero .hero__caption .hero__title { margin-bottom: 24px } .hero .hero__caption span { font-size: 17px; line-height: 30px } .hero .hero__caption .btn--primary { margin-bottom: 0!important; margin-top: 24px } .widget--hero-imageinsideContainer .hero .hero__caption .btn--primary { margin-top: 0 } .hero+br { display: none } .widget--hero-image:not(.widget--hero-imageinsideContainer) { padding: 0!important } /* REMOVE hero .layout__content .hero { margin-bottom: 80px } */ /* SNK - .dashboard-stat / .dashboard-stats*/ .widget--dashboard-stats { padding-top: 64px!important } .dashboard-stats__container { box-shadow: none; padding: 0 } .dashboard-stats { display: flex } @media (max-width: 1149px) { .dashboard-stats { flex-wrap:wrap } } @media only screen and (min-width: 48.063em) and (max-width:1149px) { .dashboard-stats>li { padding-bottom:.5em; width: 25% } } @media only screen and (min-width: 1150px) { .dashboard-stats>li { padding-bottom:0; width: 219px } } @media only screen and (min-width: 48.063em) { .dashboard-stats>li.dashboard-views__container { flex:1; margin-left: 4px; width: auto!important } } @media only screen and (max-width: 48em) { .dashboard-stats>li.dashboard-views__container { margin-left:.25em; margin-right: .25em } } @media only screen and (min-width: 48.063em) and (max-width:991px) { .dashboard-stats>li.dashboard-views__container { margin-right:4px } } .dashboard-stat { border-color: #000; height: 156px; padding: 1em .875em 1em 1em } .dashboard-stat__label,.dashboard-views__header { color: #000; font-weight: 300 } @media only screen and (max-width: 48em) { .dashboard-stat__label,.dashboard-views__header { font-size:14px } } @media only screen and (min-width: 48.063em) { .dashboard-stat__label,.dashboard-views__header { font-size:15px } } .dashboard-stat__label { text-align: left } @media only screen and (max-width: 48em) { .dashboard-stat__label { line-height:24px } } @media only screen and (min-width: 48.063em) { .dashboard-stat__label { line-height:26px } } .dashboard-stat__icon { display: inline-block; font-size: 1.563rem; margin-right: 6px; vertical-align: -6px } .dashboard-stat__icon:before { background-repeat: no-repeat; background-size: contain; content: ""; display: block } .dashboard-stat__icon.icon-notebook:before { background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg width='22' height='28' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M18.5.5h-15a2.996 2.996 0 0 0-2.985 3L.5 27.5 11 23l10.5 4.5v-24c0-1.65-1.35-3-3-3Zm0 22.5L11 19.73 3.5 23V3.5h15V23Z' fill='%23000'/%3E%3C/svg%3E"); height: 28px; width: 22px } .dashboard-stat__icon.icon-index:before { background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg width='28' height='28' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M24.581.5h-21c-1.65 0-3 1.35-3 3V14c0 1.65 1.35 3 3 3h21c1.65 0 3-1.35 3-3V3.5c0-1.65-1.35-3-3-3Zm0 9h-6c0 2.43-2.07 4.5-4.5 4.5s-4.5-2.07-4.5-4.5h-6v-6h21v6Zm-6 10.5h9v4.5c0 1.65-1.35 3-3 3h-21c-1.65 0-3-1.35-3-3V20h9c0 2.49 2.01 4.5 4.5 4.5s4.5-2.01 4.5-4.5Z' fill='%23000'/%3E%3C/svg%3E"); height: 28px; width: 28px } .dashboard-stat__icon.icon-check:before { background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg width='30' height='23' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath fill-rule='evenodd' clip-rule='evenodd' d='M9.945 22.5 29.413 3.046 27.116.75 9.945 17.948l-6.775-6.77-2.258 2.295L9.945 22.5Z' fill='%23000'/%3E%3C/svg%3E"); height: 23px; width: 30px } .dashboard-stat__icon.icon-users:before { background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg width='34' height='22' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M23.994 12.5c-1.8 0-4.605.51-6.75 1.5-2.145-1.005-4.95-1.5-6.75-1.5-3.255 0-9.75 1.62-9.75 4.875V21.5h33v-4.125c0-3.255-6.495-4.875-9.75-4.875Zm-6 6.75h-15v-1.875c0-.81 3.84-2.625 7.5-2.625s7.5 1.815 7.5 2.625v1.875Zm13.5 0h-11.25v-1.875c0-.69-.3-1.29-.78-1.83 1.32-.45 2.94-.795 4.53-.795 3.66 0 7.5 1.815 7.5 2.625v1.875Zm-21-8.25a5.256 5.256 0 0 0 5.25-5.25A5.256 5.256 0 0 0 10.494.5a5.256 5.256 0 0 0-5.25 5.25 5.256 5.256 0 0 0 5.25 5.25Zm0-8.25c1.65 0 3 1.35 3 3s-1.35 3-3 3-3-1.35-3-3 1.35-3 3-3Zm13.5 8.25a5.256 5.256 0 0 0 5.25-5.25A5.256 5.256 0 0 0 23.994.5a5.256 5.256 0 0 0-5.25 5.25 5.256 5.256 0 0 0 5.25 5.25Zm0-8.25c1.65 0 3 1.35 3 3s-1.35 3-3 3-3-1.35-3-3 1.35-3 3-3Z' fill='%23000'/%3E%3C/svg%3E"); height: 22px; width: 34px } .dashboard-stat__value { bottom: 16px; font-family: Poppins; font-weight: 700; position: absolute } .dashboard-stat--available .dashboard-stat__value { color: var(--accent-color) } /* SNK - .dashboard-views */ .dashboard-views__line { height: 110px } .dashboard-views__container { border: 1px solid #000; padding: .5em!important } .dashboard-views__line__bar { background: var(--accent-color) } /* SNK - .ce-kpi*/ @media only screen and (max-width: 48em) { .ce-kpi-list h3,.dashboard-stat__value { font-size:55px; line-height: 72px } } @media only screen and (min-width: 48.063em) { .ce-kpi-list h3,.dashboard-stat__value { font-size:62px; line-height: 80px } } .ce-kpi-list .h2.widget__title,.ce-kpi-list .hero .hero__caption .widget__title.hero__title,.hero .hero__caption .ce-kpi-list .widget__title.hero__title { padding-top: 38px } @media only screen and (max-width: 64em) { .ce-kpi-list .h2.widget__title,.ce-kpi-list .hero .hero__caption .widget__title.hero__title,.hero .hero__caption .ce-kpi-list .widget__title.hero__title { padding-top:8px } } @media only screen and (min-width: 64.063em) { .ce-kpi-list { margin-top:-200px; overflow: hidden } .ce-kpi-list .columns { padding-left: 2rem; padding-right: 2rem } } .ce-kpi-list h3 { color: var(--accent-color)!important; font-weight: 700; margin-bottom: 8px; margin-top: 2rem } .ce-kpi-list h4 { font-weight: 700; margin-bottom: 24px } .ce-kpi-list p { font-weight: 300; margin-bottom: 2rem } @media only screen and (min-width: 48.063em) { .ce-kpi-list .medium-4.columns:nth-child(2) { border-left:1px solid #000; border-right: 1px solid #000 } } /* SNK - .mytabs*/ .mytabs { border: 1px solid #ddd; box-shadow: 0 .4rem 1.2rem .2rem rgba(0,0,0,.05); -moz-column-gap: 15px; column-gap: 15px; display: flex; flex-wrap: wrap; justify-content: space-between; margin: 50px auto; max-width: 1200px; padding: 25px; row-gap: 10px } .mytabs input[type=radio] { display: none } .mytabs input[type=radio]+label { margin-left: 0; margin-right: 0 } .mytabs input[type=radio]:checked+label { background: #0029ff; color: #fff } .mytabs input[type=radio]:checked+label+.tab { border: 1px solid rgba(0,41,255,.2); border-radius: 5px; box-shadow: 0 .4rem 1.2rem .2rem rgba(0,0,0,.05); display: block } .mytabs label { background: #e2e2e2; flex: 1 1 auto; font-weight: 700; padding: 15px; text-align: center } .mytabs .tab { background: #fff; display: none; order: 1; padding: 10px 20px; width: 100% } /* SNK - .enroll*/ .enroll.bundle { margin-bottom: 0 } /* KEEP .enroll*/ .enroll--learning-path p,.enroll__price,.enroll__session__select,.enroll__title { margin-bottom: 24px; } .enroll__title { text-transform: none } /* KEEP Milestones */ .center-ruled-title>span { color: #000; /* font-size: 15px; font-weight: 600 comment */ } .enroll--learning-path hr { display: none } .enroll__buy { display: flex; flex-direction: column } @media only screen and (min-width: 48.063em) { .enroll__buy .btn { margin-bottom:24px!important; margin-top: 0 } } .enroll__price { font-family: Poppins } .enroll .contains,.enroll .interval,.enroll .srp { font-family: Inter; font-weight: 300; margin-top: 8px } .course__includes__title,.enroll .contains,.enroll .interval,.enroll .srp,.enroll__price,.enroll__secondary-actions>.btn,.enroll__title { color: #000 } .enroll .contains,.enroll .srp { display: inline } .enroll .srp:before { content: ""; display: block; margin-top: 8px } .enroll .srp:after { content: ", " } .enroll__bundle-gift,.enroll__secondary-actions .icon-gift,.enroll__secondary-actions>.btn { display: none } .layout__content--sidebar .widget--course-purchase .enroll .email-capture input { margin-bottom: 16px } /* SNK - SIZES */ @charset "UTF-8";body { -webkit-font-smoothing: antialiased } @media only screen and (max-width: 48em) { .h1,h1 { font-size:46px; line-height: 56px } } /* KEEP role main */ div[role=main] { padding: 0 0 26px; } select#sort-options:focus-visible { outline: 0 auto -webkit-focus-ring-color } hr { border-color: #e5e5e5 } /* REMOVE WIDGET CONTENT [class*=block-grid-] { margin: 0 -.75rem } [class*=block-grid-]>li { padding-bottom: 16px; padding-left: .75rem; padding-right: .75rem }*/ #learner { min-height: calc(100vh - 94px) } @media only screen and (min-width: 48.063em) { .h1,h1 { font-size:70px; line-height: 80px } } /* REVIEW role main div[role=main] { font-size: 17px; line-height: 1.77 }*/ /* REMOVE title h1,h2,h3,h4,h5,h6 { margin-bottom: 24px } */ /* REMOVE .widget__subtitle .widget__subtitle,.widget__title,h1,h2,h3,h4,h5,h6 { color: #000 } */ p { font-size: 17px; line-height: 30px; margin-bottom: 16px } .layout__content .widget--title .widget__subtitle { margin-bottom: 0; text-align: left } /* SNK - REST */ .company__school-name,.company__school-name__divider { display: none } .carousel-header { color: #000; font-weight: 700; padding: 20px; text-align: left } @media only screen and (min-width: 48.063em) { .user-engagement-stat:before { background-color:#e5e5e5 } } .user-engagement-stat--collaborations,.user-engagement-stat--hours,.user-engagement-stat--percent-complete,.user-engagement-stat--percent-viewed { color: var(--accent-color) } .card__label__button { background-color: var(--accent-color); border-color: var(--accent-color); border-radius: 23px; color: #fff; font-family: Inter; font-size: 15px; font-weight: 600; line-height: 20px; padding: 11px 32px } .image__zone .icon-info { font-size: 34px } .image__zone .icon-info:before { background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg width='34' height='34' viewBox='0 0 24 24' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Ccircle cx='11.76' cy='11.76' r='11.76' fill='%230029FF'/%3E%3Cpath d='M10.631 17h1.928V8.818h-1.928V17Zm.97-9.343c.612 0 1.113-.469 1.113-1.044 0-.58-.5-1.05-1.114-1.05-.617 0-1.118.47-1.118 1.05 0 .575.5 1.044 1.119 1.044Z' fill='%23fff'/%3E%3C/svg%3E"); background-repeat: no-repeat; color: transparent; height: 34px; width: 34px } .field__input[type=color],.field__input[type=date],.field__input[type=datetime-local],.field__input[type=datetime],.field__input[type=email],.field__input[type=month],.field__input[type=number],.field__input[type=password],.field__input[type=search],.field__input[type=tel],.field__input[type=text],.field__input[type=time],.field__input[type=url],.field__input[type=week],.form-control[type=password] { font-size: 17px; height: 56px } form input[type=password],form input[type=text],form textarea { border-radius: 4px; box-shadow: none; color: #767575; font-family: Inter; font-weight: 300; line-height: 30px; margin-bottom: 24px; padding: 13px 16px } form input[type=password],form input[type=password]:focus,form input[type=text],form input[type=text]:focus,form textarea,form textarea:focus { background: #f5f6f6; border: none; box-shadow: none } form input[type=password]:-moz-read-only,form input[type=text]:-moz-read-only,form textarea:-moz-read-only { background: #e5e5e5 } form input[type=password]:read-only,form input[type=text]:read-only,form textarea:read-only { background: #e5e5e5 } form input[type=submit] { height: 56px } /*REVIEW form label { color: #000; font-weight: 700 } */ form label>input,form label>textarea { margin-top: 4px } .field__label { font-size: 15px; font-weight: 700; margin: 0 0 4px; opacity: 1; padding: 0; position: relative; transform: none } .field__label,.field__label span.red-asterisk { color: #767575 } .field__label span.red-asterisk { font-size: 15px; vertical-align: baseline } .field--show-floating-label .field__input { padding: 13px 16px!important } .field__input-wrapper--select:after,.field__input-wrapper--select:before { top: auto } .field__input-wrapper--select:before { bottom: 25.5px } .field__input-wrapper--select:after { bottom: 0; height: 56px } .field__input-wrapper--select .red-asterisk { right: auto } /* KEEP select */ select { background: #fff; background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg width='13' height='8' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath fill-rule='evenodd' clip-rule='evenodd' d='M6.5 8 13 1.528 11.466 0 6.5 4.97 1.534 0 0 1.528 6.5 8Z' fill='%23000'/%3E%3C/svg%3E"); background-position: right 16px center; background-repeat: no-repeat; border: 1px solid #000; color: #000; font-size: 17px; height: 56px; line-height: 30px; padding-bottom: 8px; padding-top: 8px; } form ::-webkit-input-placeholder { color: #767575; font-family: Inter; font-size: 17px; font-style: normal; font-weight: 300; line-height: 30px } form ::-moz-placeholder { color: #767575; font-family: Inter; font-size: 17px; font-style: normal; font-weight: 300; line-height: 30px } form :-ms-input-placeholder { color: #767575; font-family: Inter; font-size: 17px; font-style: normal; font-weight: 300; line-height: 30px } form :-moz-placeholder { color: #767575; font-family: Inter; font-size: 17px; font-style: normal; font-weight: 300; line-height: 30px } .video__container { padding: 0 } .video__container .w-vulcan-overlays--center .w-bpb-wrapper.w-css-reset.w-css-reset-tree { margin-left: -46px!important; margin-top: -29px!important } .video__container .w-vulcan-overlays--center .w-big-play-button,.video__container .w-vulcan-overlays--center .w-big-play-button>div,.video__container .w-vulcan-overlays--center .w-big-play-button>svg { border-radius: 50%; height: 80px!important; width: 80px!important } .video__container .w-vulcan-overlays--center .w-big-play-button>div { background: var(--accent-color)!important; background-clip: padding-box!important; border: 18px solid #cacfeb; opacity: .8 } .video__container .w-vulcan-overlays--center .w-big-play-button>svg { left: 14px!important; width: 53px!important } .video__container .video__frame .w-bottom-bar-lower>div>div { background-color: #000!important } .header.header--checkout { position: relative!important } .header.header--checkout .header__title { margin-top: 64px } .checkout__order { margin-top: 138px; padding-left: 24px; padding-right: 24px } @media only screen and (min-width: 48.063em) and (max-width:64em) { .checkout__order { padding-left:32px; padding-right: 32px } } @media only screen and (min-width: 64.063em) { .checkout__order { padding-left:100px; padding-right: 100px } } .cart-items.cart-items--order { background-color: #f5f6f6 } @media only screen and (min-width: 48.063em) and (max-width:89.938em) { .cart-item__content .cart-item__price,.cart-item__content .large-4.medium-6.columns,.cart-item__content .large-8.medium-6.columns,.cart-item__content .order__item__row--bottom { width:100% } } .cart-item__content .cart-item__title { font-family: Inter; font-weight: 300 } .cart-item__content .cart-item__price .btn.btn--tiny.btn--link { height: 20px; vertical-align: middle; width: 20px } .cart-item__content .cart-item__price .icon-delete { padding: 0 } .cart-item__content .cart-item__price .icon-delete,.cart-item__content .cart-item__price .icon-delete:before { display: block } .cart-item__content .cart-item__price .icon-delete:before { background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg width='20' height='20' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath fill-rule='evenodd' clip-rule='evenodd' d='m10 11 6.5-6.472L14.966 3 10 7.97 5.034 3 3.5 4.528 10 11Z' fill='%23000'/%3E%3Cpath fill-rule='evenodd' clip-rule='evenodd' d='m10 8-6.5 6.473L5.034 16 10 11.03 14.966 16l1.534-1.527L10 8Z' fill='%23000'/%3E%3C/svg%3E"); background-repeat: no-repeat; color: transparent; height: 20px; width: 20px } .cart-item__total.cart-item__total--order { background-color: transparent } .coupon-entry .field__label { display: none } .coupon-entry .field__input { margin-bottom: 0 } .coupon-entry .btn--submit { height: 56px } .order__total .order__label--total span { color: #000; font-size: 17px; font-weight: 300; line-height: 30px } .order__total .order__value--total { font-family: Poppins; font-size: 30px; line-height: 38px } @media only screen and (max-width: 64em) { .continue-to-checkout { margin-top:16px } } .grid-container_2 { align-items: center; display: grid; gap: 25px 20px; grid-template-columns: 1fr 2fr; justify-items: center } .blabla2 p { border-left: 1px dotted rgba(0,41,255,.4); margin-bottom: 0; padding-left: 15px } /* NEW CUSTOMECODE */ /* ================ SEARCH UNIFY SU CSS ================ */ .su__back-to-top.su__position-fixed.su__rtlright-auto.su__cursor.su__zindex{ display: none; } /* Padding */ @media only screen and (min-width: 64.063em) { .su__app.su__wrapper.su_autocomplete-block, .su__search-sort-container{ padding: 1.5rem 100px;} .su__app.su__wrapper.su_autocomplete-block{ background-color: var(--color-brand-black); } .su__w-100.su__py-4.su__search_section.su__bg-blue-grd{ padding-top: 0; padding-bottom: 0; } section.su__results-section{ padding: 0 100px; } } @media only screen and (min-width: 48.063em) and (max-width: 64em) { .su__search-sort-container{ padding: 30px 32px;} section.su__results-section{padding: 0 32px;} } @media only screen and (max-width: 48.063em){ .su__search-sort-container{ padding: 24px;} section.su__results-section{padding: 0 24px;} } .su__list-item-desc .highlight{ border-bottom: none!important; } h2.su__text-truncate.su__my-0.su__font-14.su__line-height-n{ text-transform: unset!important; } /* ================ END search unify su css ================ */ /* --- Basket menu --- */ .cart-item__content-inner{ margin: unset; } .cart-item__price { display: flex; flex-direction: column; align-items: flex-end; } .cart-item__content .cart-item__price .btn.btn--tiny.btn--link{ height: unset!important; width: unset!important; display: flex; } .cart-item__price .btn.btn--tiny{ font-size: var(--typography-paragraph-font-size-M); } /* ================ NEW HEADER TEST - NAVIGATION BAR ================ */ .header:not(.header--tools):not(.header--secondary-manager):not(.header--subtitle){ background-color: var(--color-brand-white)!important; } @media only screen and (min-width: 64.063em) { .header:not(.header--tools):not(.header--secondary-manager):not(.header--subtitle) { padding: 0 100px!important; } } header.header.header--microsite .header__inner{ height: 100%; } nav.new-navbar-wrap{ display: flex; background-color: var(--color-brand-white); } .material-symbols-outlined{ font-family: 'Material Symbols Outlined'!important; } /* --- NAVIGATION BAR TEST --- */ .global-nav__container{ border-bottom: 1px solid #D9D9D9; } header.header:not(.header--tools):not(.header--secondary-manager):not(.header--subtitle), .header.header--student.header--learner{ background: var(--color-brand-white)!important; border-bottom: 1px solid #D9D9D9!important; box-shadow: unset!important; } nav.new-navbar-wrap{ font-family: var(--typography-font-family); } /* General */ .new-navbar-wrap{ display: flex; justify-content: space-between; color: var(--color-brand-black); height: 100%; } .new-navbar-wrap .image-navbar-group{ display: flex; } .new-navbar-wrap ul{ list-style: none; padding: 0; margin: 0; } .new-navbar-wrap a{ text-decoration: none; color: unset; } .new-navbar-wrap li a{display: flex;} /* Logo */ .new-navbar-wrap .navbar-logo{ margin-right: 30px; display: flex; align-items: center; } .new-navbar-wrap .navbar-logo img{ max-width: 226px;} .item-hover-main{ border-bottom: 2px solid var(--color-brand-black); } .item-hover-firstlevel{ background-color: var(--color-brand-black); } /* Main navbar */ .navbar-items-main{ margin: 0; display: flex; align-items: center; color: var(--color-brand-black); } .new-navbar-wrap span.material-symbols-outlined{ margin-left: 8px; } .navbar-items-main li button{ color: unset; } .navbar-items-main li.navbar-item-wrap{ height: 100%; } .navbar-items-main li.navbar-item-wrap button.navbar-item{ padding: 0 12px; margin:0; display: flex; align-items: center; font-size: var(--typography-paragraph-font-size-M); background-color: var(--color-brand-white); border: none; border-radius: unset; } .navbar-items-main li.navbar-item-wrap button.navbar-item span.material-symbols-outlined{ background-color: var(--color-background-default-grey); } /* navbar - microlearnings */ .header.header--article .header__inner, .header.header--article .header__inner .row, .header.header--article .header__inner .row .columns.medium-6{ height: 100%; } .header.header--article .header__inner .row .columns.medium-6{ padding-right: 0; width: 100%; } .header.header--article .header__inner .row .columns.medium-6 .company__beta-logo{ display: flex; align-items: center; } .header.header--article .header__inner .company-logo__container{ margin-left: 0; } .header.header--article .header__inner .company-logo__container img{ max-width: 226px; } .header--article .header__inner .columns.medium-6 { justify-content: space-between; } /* END navbar - microlearnings */ /* First level - Open dropdown */ ul.navbar-item-dropdown{ display: none; } ul.navbar-item-dropdown li{ background-color: var(--color-brand-white); } /* Second level - Catalog > By topic, process, exams */ ul.navbar-item-dropdown.dropdown-open{ display: block; position: absolute; } ul.navbar-item-dropdown li.item-sidelevel{ position: relative; } ul.navbar-item-dropdown li.item-sidelevel button{ display: flex; justify-content: space-between; background-color: transparent; margin: unset; border: none; font-size: 16px; -webkit-transition-duration: unset; } /* Language button */ .new-navbar-wrap .language-wrap { position: relative; display: flex; align-items: center; } button.language-btn{ margin: 0; padding: 8px 16px; display: flex; align-items: center; border: 1px solid var(--color-background-hover-grey-darker); border-radius: var(--buttons-border-radius)!important; color: var(--color-brand-black); background-color: var(--color-brand-white); font-size: 15px; } button.language-btn:hover, button.language-btn:focus-within{ background-color: var(--color-background-default-grey); } button.language-btn span.material-symbols-outlined{ color: var(--color-background-hover-grey-darker); } button.language-btn span.material-symbols-outlined:first-child{ margin-left: 0; margin-right: 8px; } /* navbar - buttons on the right (cart, login, manager) */ nav.nav--top:not(#mobil-nav-top) { height: 100%; display: flex; align-items: center; } #mobil-nav-top { display: flex; width: 100%; justify-content: center; } #mobil-nav-top ul li a, #mobil-nav-top ul li button { width: 100%; display: block; text-align: center; border: 1px solid var(--color-brand-black) !important; border-radius: var(--buttons-border-radius) !important; background-color: var(--color-brand-black) !important; font-size: var(--typography-paragraph-font-size-S); font-weight: var(--typography-font-weight); color: var(--color-brand-white); padding: 8px; margin-bottom: 5px; margin-top: 5px; } .nav--top ul { justify-content: center; width: 100%; } /* Ocultar cuando la pantalla sea menor a 1200px */ @media (max-width: 1200px) { nav.nav--top:not(#mobil-nav-top) { display: none; } #mobil-nav-top { display: flex; width: 100%; justify-content: center; } #mobil-nav-top ul { width: 100%; } } /* KEEP nav--top */ nav.nav--top ul{ height: auto; } /* KEEP nav--top button */ nav.nav--top ul li a, nav.nav--top ul li button{ margin-left: 8px; border: 1px solid var(--color-brand-black); border-radius: var(--buttons-border-radius); padding-left: 16px; padding-right: 16px; background-color: var(--color-brand-black); } nav.nav--top ul li button{ margin-right: 0; line-height: 1; height: 100%; } nav.nav--top ul li a span, nav.nav--top ul li button span{ font-size: var(--typography-paragraph-font-size-S); font-weight: var(--typography-font-weight); color: var(--color-brand-white); } /* nav.nav--top ul li a span{ color: var(--color-brand-white); } nav.nav--top ul li button span{ color: var(--color-brand-black)!important; }*/ nav.nav--top ul li a:hover, nav.nav--top ul li button:hover{ border-color: var(--color-brand-black); } nav.nav--top ul li a:hover span, nav.nav--top ul li button:hover span{ color: var(--color-brand-black)!important; } /* Hover + keyboard styling interactions */ /* - Getting started + Catalog dropdown */ ul.navbar-item-dropdown.item-firstlevel li:hover:not(.item-role-dropdown li), ul.navbar-item-dropdown.item-firstlevel li:focus-within:not(.item-role-dropdown li){ background-color: var(--color-brand-black); color: var(--color-brand-white); } ul.navbar-item-dropdown.item-firstlevel li:hover:not(.item-role-dropdown li) ul, ul.navbar-item-dropdown.item-firstlevel li:focus-within:not(.item-role-dropdown li) ul{ color: var(--color-brand-black) } ul.navbar-item-dropdown.item-firstlevel li:hover a:not(ul.navbar-item-dropdown.item-secondlevel li a, .item-role li a){ color: var(--color-brand-white); } /* - Roles dropdown */ ul.navbar-item-dropdown.item-firstlevel.item-role-dropdown li:last-child:hover, ul.navbar-item-dropdown.item-firstlevel.item-role-dropdown li ul.item-role li:hover, ul.navbar-item-dropdown.item-firstlevel.item-role-dropdown li ul.item-role li:focus-within{ background-color: var(--color-brand-black); } ul.navbar-item-dropdown.item-firstlevel.item-role-dropdown li ul.item-role li:hover a, ul.navbar-item-dropdown.item-firstlevel.item-role-dropdown li ul.item-role li:focus-within{ color: var(--color-brand-white); } /* Responsive */ /* -- Desktop view -- */ @media only screen and (min-width: 1200px){ #mobil-nav-top{display: none;} /* Logo */ header .header__inner .navbar-logo:not(header .header__inner .new-navbar-wrap .image-navbar-group .navbar-logo){display: none;} /* Main nav bar */ .navbar-items-main li.navbar-item-wrap button.navbar-item{ height: 100%; border-bottom: 2px solid var(--color-brand-white); } .navbar-items-main li.navbar-item-wrap button.navbar-item:hover, .navbar-items-main li.navbar-item-wrap button.navbar-item:focus-within{ border-bottom-color: var(--color-brand-black); } button:focus:not(.tw-override){ -webkit-box-shadow: unset; box-shadow: unset; outline: unset; } .mobile-menu-wrap, button.mobile-menu{display: none;} /* Language button */ .new-navbar-wrap .language-wrap #language-selector-header { top: 68px; } /* Language button - In courses */ .header--student .header__right { width: 100%; } /* Quick links */ ul.navbar-items-main .navbar-item-wrap.mobile-view{ display: none; } /* All dropdown first level */ ul.navbar-item-dropdown.item-firstlevel{ border: 1px solid #BEBEBE; } ul.navbar-item-dropdown.item-firstlevel:not(.item-role-dropdown) li{ width: 240px; /* Elements size */ } .new-navbar-wrap li a /* all links */, ul.navbar-item-dropdown li.item-sidelevel button /* buttons */, ul.navbar-item-dropdown li .menu-title /* role titles*/{ padding: 14px 16px; line-height: 1.5; } /* CATALOG dropdown */ /* - First level */ ul.navbar-item-dropdown li.item-sidelevel{ display: flex; } ul.navbar-item-dropdown li.item-sidelevel button{ width: 240px; } ul.navbar-item-dropdown li.item-sidelevel button:hover, ul.navbar-item-dropdown li.item-sidelevel button:hover span.material-symbols-outlined{ color: var(--color-brand-white); } /* - Second level */ ul.navbar-item-dropdown.item-secondlevel{ position: absolute; left: 240px; height: 521.5px; border: 1px solid #BEBEBE; background-color: var(--color-brand-white); } ul.navbar-item-dropdown.item-firstlevel li.item-sidelevel ul.navbar-item-dropdown.item-secondlevel li:hover a{ color: var(--color-brand-white); } .item-sidelevel:nth-child(1) .navbar-item-dropdown.item-secondlevel{ top: -1px; } .item-sidelevel:nth-child(2) .navbar-item-dropdown.item-secondlevel{ top: -53px; } .item-sidelevel:nth-child(3) .navbar-item-dropdown.item-secondlevel{ top: -105px; } /* ROLE dropdown */ /* - Titles */ .navbar-item-dropdown.item-firstlevel .menu-title{ text-transform: uppercase; border-bottom: 1px solid #BEBEBE; } /* - Layout */ ul.navbar-item-dropdown.item-firstlevel.item-role-dropdown.dropdown-open{ display: grid; grid-template-columns: repeat(2, 240px); } ul.navbar-item-dropdown.item-firstlevel.item-role-dropdown li:nth-child(3):not(ul.item-role li){ grid-column: 1/3; border-top: 1px solid #BEBEBE; } ul.navbar-item-dropdown.item-firstlevel.item-role-dropdown li:first-child .menu-title, ul.navbar-item-dropdown.item-firstlevel.item-role-dropdown li:first-child ul.item-role{ border-right: 1px solid #BEBEBE; } ul.item-role li.mobile-version{ display: none; } } /* -- Tablet view -- */ @media only screen and (max-width: 1200px) and (min-width: 1024px){ nav.new-navbar-wrap{ padding-left: 80px; padding-right: 80px; } } /* -- Mobile view -- */ @media only screen and (max-width: 1200px){ .nav nav--top{display: none!important;} /* Logo */ .navbar-logo{ margin-right: auto; display: flex; align-items: center; } .header__inner a.navbar-logo img{max-width: 170px;} /* Quick links */ .global-nav__container{display: none!important;} /* Navbar*/ header.header.header.header--microsite .header__inner{ display: flex; justify-content: flex-end; } .new-navbar-wrap .navbar-logo{ display: none; /* Hiding logo */ } /* Cart & Login menu */ nav.nav--top ul{ display: flex; } /* Manager button */ nav.nav--top ul li a{ height: 44px; padding: 10px; display: flex; align-items: center; justify-content: center; text-align: center; } /* Menu button */ .mobile-menu-wrap{ height: 100%; display: flex; align-items: center; justify-content: flex-start!important; } button.mobile-menu{ margin: 0; margin-left: 8px; padding: 10px; border: none; background-color: unset; color: var(--color-paragraph-dark-grey); background-color: var(--color-background-default-grey); } button.mobile-menu:hover{ background-color: var(--color-background-hover-grey-lighter); } button.mobile-menu span{ display: none; } button.mobile-menu span.menu-visible{ display: block; } /* Navigation bar */ nav.new-navbar-wrap{ position: absolute; top: 80px; left: 0; width: 100%; height: calc(100vh - 80px); padding-bottom: 24px; display: none; flex-direction: column; justify-content: space-between; background-color: var(--color-brand-white); overflow: scroll; } nav.new-navbar-wrap::-webkit-scrollbar{width: 8px;} nav.new-navbar-wrap.menu-visible{ display: flex;} .navbar-items-main{ width: 100%; flex-direction: column; align-items: flex-start; } nav.new-navbar-wrap ul.navbar-items-main li.navbar-item-wrap ul.item-firstlevel li.item-sidelevel button span.material-symbols-outlined{ margin-right: 4px; padding: 2px; } .navbar-items-main li.navbar-item-wrap{ width:100%; } .navbar-items-main li.navbar-item-wrap button.navbar-item{ padding: 16px 20px; width: 100%; justify-content: space-between; font-size: var(--typography-platform-heading-S-size); } /* First level dropdown */ ul.navbar-item-dropdown.dropdown-open { position: relative; } ul.navbar-item-dropdown li, ul.navbar-item-dropdown li.item-sidelevel button{ width: 100%; font-size: var(--typography-paragraph-font-size-XL); } .new-navbar-wrap li a /* all links */, ul.navbar-item-dropdown li.item-sidelevel button /* buttons */{ padding: 12px 16px 12px 52px; } ul.navbar-item-dropdown li.item-sidelevel:hover button.sidelevel-trigger span, ul.navbar-item-dropdown li.item-sidelevel:focus-within button.sidelevel-trigger span{ transform: rotate(90deg); transition-duration: .25s; transition-timing-function: ease-in-out; } ul.navbar-item-dropdown li .menu-title /* role titles*/{ padding: 20px 16px 20px 52px; text-transform: uppercase; } /* ROLE dropdown */ /* - Titles */ .navbar-item-dropdown.item-firstlevel .menu-title{ font-size: var(--typography-paragraph-font-size-M); color: var(--color-brand-black); } .navbar-item-dropdown.item-secondlevel li /*catalog*/, .navbar-item-dropdown.item-firstlevel ul.item-role li /* role */{ padding-left: 30px; } ul.navbar-item-dropdown.item-firstlevel li.desktop-version{ display: none; } /* Language button */ .language-wrap{ padding: unset!important; /* padding: 50px 24px 0;*/ justify-content: center; flex-direction: column-reverse; } .language-wrap #language-selector-header{ position: relative; top: 0!important; /*quitar*/ width: 100%; } .language-wrap #language-selector-header li button{ width: 100%; } button.language-btn{ width: 100%; justify-content: center; } } /* Language button - Inside courses */ @media only screen and (min-width: 48.063em){ .header--student .header__right{ width: 100%; } } @media only screen and (max-width: 48.063em){ .header.header--student.header--learner .language-wrap button.language-btn{ padding-top: 4px; padding-bottom: 4px; } } /* --- DASHBOARDS NAVIGATION BAR + VIDEO NAVIGATION BAR --- */ .header.header--dashboard .header__inner, .header.header--dashboard .header__inner .row, .header.header--dashboard .header__inner .column.small-6, .header.header--dashboard .header__inner nav.custom-navbar{ height:100%; } .header.header--dashboard .header__inner .row, .header.header--dashboard .header__inner .column.small-6, .header.header--dashboard .header__inner .column.small-6 .company__beta-logo{ display:flex; align-items:center; } .header.header--dashboard .header__inner .column.small-6{ width: unset; } .header.header--dashboard .header__inner nav.custom-navbar{ width:100%; } /* --- Academy logo --- */ .header.header--dashboard .header__inner .column.small-6 .company__beta-logo{ width: 226px; margin-right: 30px; } .header.header--dashboard .header__inner .column.small-6 .company__beta-logo .company-logo__container{ margin-left: 0; } .header.header--dashboard .header__inner .column.small-6 .company__beta-logo .company-logo__container img{ max-width: unset; } /* --- User icon --- */ .header.header--dashboard .header__inner .column.small-6:last-child{ margin-left: 20px; } .header.header--dashboard .header__inner .column.small-6 a.dashboard-header-dropdown__link .dashboard-header__avatar{ margin-bottom: 0; } .header.header--dashboard .header__inner .column.small-6 a.dashboard-header-dropdown__link .dashboard-header__avatar .avatar{ color: var(--color-brand-black); border: 1px solid var(--color-brand-black); } .header.header--dashboard .header__inner .column.small-6 a.dashboard-header-dropdown__link .dashboard-header__avatar .avatar:hover, .header.header--dashboard .header__inner .column.small-6 a.dashboard-header-dropdown__link .dashboard-header__avatar .avatar:focus-within{ background-color: var(--color-brand-black)!important; } /* --- Responsive --- */ @media only screen and (max-width: 1200px){ .header.header--dashboard .header__inner .custom-navbar .mobile-menu-wrap{ justify-content: flex-end; } } /* ========= FOOTER ========= */ /* REVIEW FOOTER footer[role=contentinfo] { display: block !important; }*/ /*.footer_company_info { display: none !important; }*/ footer.footer { padding: 0 !important; margin: 0 !important; } /* Custom footer wrapper */ .custom-footer { background-color: var(--color-brand-black); display: block !important; width: 100%; padding: 0 100px; margin: 0; box-sizing: border-box; padding-top: 20px; } .custom-footer *, .custom-footer *::before, .custom-footer *::after { box-sizing: inherit; } /* newsletter + columns */ .custom-footer .footer-container { display: flex; flex-wrap: nowrap; align-items: flex-start; justify-content: space-between; gap: 80px; margin: 0 auto; width: 100%; box-sizing: border-box; } /* locale + legal links */ .custom-footer .footer-bottom { border-top: 2px solid var(--color-paragraph-dark-grey); margin-top: 10px; padding-left: 0; padding-right: 0; margin-bottom: 30px; display: flex; flex-wrap: wrap; justify-content: space-between; align-items: center; width: 100%; box-sizing: border-box; } /* Newsletter */ .custom-footer .footer-newsletter { flex: 0 0 50%; max-width: 50%; min-width: 0; } .custom-footer .footer-newsletter h2 { font-size: 36px; font-weight: var(--typography-font-weight); margin-bottom: 0; color: var(--color-brand-white); padding-bottom: 0; } .custom-footer .footer-newsletter p.subtitle { font-size: 32px; color: var(--color-paragraph-dark-grey); font-weight: var(--typography-font-weight); margin-top: 0; max-width: 600px; } .footer-newsletter p.subtitle{ line-height: 48px; } .custom-footer .footer-newsletter form { display: flex; border: 1px solid var(--color-paragraph-dark-grey); border-radius: 8px; overflow: hidden; margin-bottom: 12px; margin-top: 55px; max-width: 600px; width: 100%; box-sizing: border-box; } .custom-footer .footer-newsletter #subscribeForm #emailInput{ flex: 1; padding: 12px 16px !important; border: none; font-size: 16px; background-color: transparent !important; color: var(--color-brand-white); transform: translateY(10px); } .custom-footer .footer-newsletter #subscribeForm #emailInput { background-color: transparent !important; color: var(--color-brand-white) !important; border: none !important; } .custom-footer .footer-newsletter input:focus { outline: none; box-shadow: none; } .custom-footer .footer-newsletter button { display: inline-flex; align-items: center; padding: 0 10px; background: transparent; border: none; font-size: 20px; color: var(--color-paragraph-dark-grey); cursor: pointer; } .custom-footer .footer-newsletter button svg { display: block; transform: translateY(10px); } .custom-footer .footer-newsletter button svg:focus { outline: none !important ; box-shadow: none !important; } /* Privacy notice */ .custom-footer .footer-newsletter .privacy-note { font-size: 14px; color: var(--color-background-hover-grey-lighter); line-height: 1.6; max-width: 600px; width: 100%; box-sizing: border-box; } .custom-footer .footer-newsletter .privacy-note a { color: var(--color-brand-white); text-decoration: underline; } .custom-footer .footer-newsletter .privacy-note a:hover { text-decoration: none; } /* Columns / links */ .custom-footer .footer-links { flex: 0 0 50%; max-width: 50%; display: flex; flex-direction: row; justify-content: space-between; gap: 30px; align-items: flex-start; min-width: 0; box-sizing: border-box; } .custom-footer .footer-links > div { flex: 1 1 0; min-width: 0; } .custom-footer .footer-links h4 { font-size: var(--typography-paragraph-font-size-M); color: var(--color-background-hover-grey-darker); font-weight: var(--typography-font-weight); text-transform: uppercase; margin-bottom: 4px; } .custom-footer .footer-links ul { list-style: none; padding: 0; margin: 0; line-height: 2; } .rrss ul{ padding-left: 30px; } .custom-footer .footer-links a { font-size: var(--typography-paragraph-font-size-M); color: var(--color-brand-white); cursor: pointer; text-decoration: none; } .custom-footer .footer-links a:hover { text-decoration: underline; } /* Bottom row */ .custom-footer .footer-locale { display: flex; align-items: center; gap: 8px; } .custom-footer .footer-locale button { display: inline-flex; align-items: center; gap: 8px; background-color: #1D1D1D; color: var(--color-brand-white); padding: 12px 20px; font-weight: var(--typography-font-weight); border: none; cursor: pointer; transition: background-color 0.2s ease-in-out; margin-bottom: 0; margin-top: 30px; } .custom-footer .footer-locale button:hover { background-color: var(--color-background-hover-grey-lighter); color: var(--color-brand-black); } /* iconos blancos dentro de los botones */ .custom-footer .footer-locale button svg, .custom-footer .footer-locale button .material-symbols-outlined { color: var(--color-brand-white) !important; fill: var(--color-brand-white) !important; stroke: var(--color-brand-white) !important; } .custom-footer .footer-locale button:hover svg, .custom-footer .footer-locale button:hover .material-symbols-outlined { color: var(--color-brand-black) !important; fill: var(--color-brand-black) !important; stroke: var(--color-brand-black) !important; } .term{ max-width: 150px; } .custom-footer .footer-strings { display: flex; gap: 20px; color: var(--color-paragraph-dark-grey); flex-wrap: wrap; justify-content: flex-end; transform: translateY(12px); } .custom-footer .footer-strings a { text-decoration: none; color: var(--color-brand-white); font-size: var(--typography-paragraph-font-size-S); } .custom-footer .footer-strings a:hover { text-decoration: underline; } /* Responsive */ @media (max-width: 1284px) { .custom-footer { padding: 0 32px; } .custom-footer .footer-newsletter p.subtitle { max-width: 900px; } .custom-footer .footer-links ul li a { white-space: nowrap; } .custom-footer .footer-newsletter form { max-width: 900px; } .custom-footer .footer-newsletter .privacy-note { max-width: 900px; } .custom-footer .footer-links h4 { margin-top: 20px; } .custom-footer .footer-container { flex-direction: column; gap: 24px; } .custom-footer .footer-newsletter { max-width: 100%; flex: 0 0 100%; } .custom-footer .footer-links { flex-direction: row; width: 100%; max-width: 100%; gap: 220px; } .custom-footer .footer-links > div { flex: 1 1 200px; } .custom-footer .footer-bottom { flex-direction: column; align-items: flex-start; gap: 12px; padding-bottom: 0; } .custom-footer .footer-strings { justify-content: flex-start; transform: translateY(0); } } @media (max-width: 768px) { .custom-footer { padding: 0 24px; } .custom-footer .footer-links { flex-direction: column; flex-wrap: nowrap; gap: 12px; width: 100%; } .custom-footer .footer-links > div { flex: 1 1 100%; width: 100%; } } @media (max-width: 1450px) { .custom-footer .footer-container { gap: 40px;} } @media (max-width: 1700px) { .custom-footer .footer-links .term a { white-space: normal; display: inline-block; line-height: 1.4; word-break: break-word; } } .custom-footer .footer-links a { display: inline-flex; align-items: center; gap: 4px; white-space: nowrap; text-decoration: none; color: var(--color-brand-white); } .custom-footer .footer-links a:hover { text-decoration: underline; } .custom-footer .footer-links .material-symbols-outlined { display: inline-block; transform: none; position: relative; top: 1px; color: var(--color-background-hover-grey-darker) !important; font-variation-settings: 'FILL' 1; } .custom-footer .footer-links li { display: flex; align-items: center; } /* Legacy hidden */ .footer__company__info { display: none; } /* Footer locale container */ .footer-locale { position: relative; display:inline-block; } #transpicker:hover{ background: #F9F9F9; border-color: #ccc; } #language-current, #language-current-header { text-wrap: nowrap; } .language-list { position: absolute; top: 100%; left: 0; display: block; /* siempre block para tab */ opacity: 0; pointer-events: none; /* no interactuable mientras no está abierto */ transform: translateY(-10px); transition: opacity 0.2s, transform 0.2s; } .language-list.open { opacity: 1; pointer-events: auto; /* interactuable */ transform: translateY(0); } /* footer dropwdown up */ .footer-locale { position: relative; } #language-selector { bottom: 32px; } ul#language-selector{ margin-left: unset; } /* UNIFIED LANGUAGE DROPDOWNS - HEADER & FOOTER */ #language-selector, #language-selector-header { position: absolute; z-index: 100; margin: 0; color: var(--color-brand-black); background-color: var(--color-brand-white); border: 1px solid #ddd; border-radius: var(--buttons-border-radius)!important; list-style: none; overflow: hidden; min-width: unset!important; } #language-selector li, #language-selector-header li, #language-selector li button, #language-selector-header li button { all: unset; display: block; font-size: var(--typography-paragraph-font-size-M); line-height: 1.5; text-align: left; color: var(--color-brand-black); cursor: pointer; transition: background 0.2s ease, color 0.2s ease; } #language-selector li button, #language-selector-header li button{ padding: 8px 14px; width: 100%!important; } #language-selector-header li{ padding: unset!important; } #language-selector-header li button:hover, #language-selector li button:hover, #language-selector li button:focus-within{ color: var(--color-brand-white)!important; background-color: var(--color-brand-black); outline: none; } /* Footer: abrir hacia arriba */ .footer-locale #language-selector { bottom: 100%; margin-bottom: 8px; } /* Header: abrir hacia abajo */ .language-wrap #language-selector-header { top: 100%; margin-top: 0!important; } /* Animación uniforme */ .language-list { opacity: 0; pointer-events: none; transform: translateY(-10px); transition: opacity 0.2s, transform 0.2s; } .language-list.open { opacity: 1; pointer-events: auto; transform: translateY(0); } /* Ocultar footer por defecto */ #footer {/*display: none !important;*/ } /* Mostrar si la página tiene la clase .dashboard .dashboard #footer, .dashboard .custom-footer { display: block !important; }*/ .dashboard #footer, .dashboard .footer__inner { display: none !important; } /* Footer courses */ .course.section.lesson footer .footer__inner, .learn.video.index footer .footer__inner, .learn.article.index footer .footer__inner{ padding: 24px 100px; justify-content: flex-end; flex-direction: row; font-size: var(--typography-paragraph-font-size-S); } .course.section.lesson footer .footer__inner div a:hover, .course.section.lesson footer .footer__inner div a:focus-within{ text-decoration: underline; } /* REVIEW FOOTER INNER .footer__inner{ padding: 24px 100px; justify-content: flex-end; flex-direction: row; font-size: var(--typography-paragraph-font-size-S); }*/ .course.section.lesson footer .footer__inner div a:hover, .course.section.lesson footer .footer__inner div a:focus-within, .learn.video.index footer .footer__inner div a:hover, .learn.video.index footer .footer__inner div a:focus-within, .learn.article.index footer .footer__inner div a:hover, .learn.article.index footer .footer__inner div a:focus-within{ text-decoration: underline; } @media only screen and (min-width: 48.063em){ .course.section.lesson footer .footer__inner div, .learn.video.index footer .footer__inner div, .learn.article.index footer .footer__inner div{ margin-left: 30px; } } @media only screen and (max-width: 48.063em){ .course.section.lesson footer .footer__inner, .learn.video.index footer .footer__inner, .learn.article.index footer .footer__inner { padding: 20px 32px 12px; flex-direction: column; align-items: flex-start; text-align: left; } .course.section.lesson footer .footer__inner div, .learn.video.index footer .footer__inner div, .learn.article.index footer .footer__inner div{ margin-bottom: 10px; } } /* Mostrar si existe un contenedor con clase .course__container .course__container #footer, .course__container .custom-footer { display: block !important; }*/ /*.course__container #footer, .course__container .footer__inner { justify-content: space-around; }*/ /* Force show footer when dashboard or course container exists */ body.dashboard #footer, body.dashboard .custom-footer, .course__container #footer, .course__container .custom-footer, .course__container ~ #footer, .course__container ~ .custom-footer { display: block !important; } /* NEW TO ADD (FOOTER) */ .footer__inner { border-top: none; padding: 0; } /* ========= TEST - REVAMPED PERSONA PAGE STYLING ========= */ /* --------- TABS --------- */ .persona-tabs{ width:100%; /*padding: 40px 100px 0;*/ display:flex; justify-content:center; } .persona-tabs button{ margin: 0 10px; padding: 10px 20px 20px; width: 300px; color: #666666; background-color: unset; border: none; font-size: var(--typography-platform-heading-S-size); line-height: var(--typography-platform-heading-S-line-height); } .persona-tabs button:hover{ color: var(--color-brand-black); } .persona-tabs button.tab-active{ color: var(--color-brand-black); border-bottom: 2px solid var(--color-brand-black); } .academyJourney.active{ display:block; } .academyJourney{ display:none; } .manager .academyJourney{ display:block; } /* --------- PROCESS LINE --------- */ .academyJourney .process-wrap{ margin: 0; position: relative; display: flex; justify-content: center; } .process-wrap li{ list-style: none; z-index:1; } .process-wrap .process{ display: flex; flex-direction: column; align-items: center; background-color: unset; border: none; color: var(--color-paragraph-dark-grey); } .process-wrap li:first-child{ margin-left:0; } .process-wrap li:last-child:not(.transformation-lead li){ margin-right:0; } .process-wrap .process:hover div, .process-wrap .process:focus-within div, .process-wrap .process:hover p, .process-wrap .process:focus-within p{ background-color: var(--color-brand-black); color: var(--color-brand-white); } .process-wrap .process div{ height: 60px; width: 60px; display: flex; align-items: center; justify-content: center; margin-bottom: 15px; color: var(--color-brand-black); background-color: var(--color-background-hover-grey-darker); border-radius: 100px; } .process-wrap .process div{ font-size: var(--typography-platform-heading-S-size); } .process-wrap .process p, .persona-mobile-menu p{ font-size: var(--typography-paragraph-font-size-XL); line-height: var(--typography-paragraph-line-height); margin: 0!important; } /* --- PROCESS NAVBAR - SHORT VERSION --- */ .academyJourney.process-nav-short{ background-color: var(--color-brand-white); border-bottom: 1px solid #D9D9D9; } .academyJourney.process-nav-short .process-wrap{ justify-content: space-between; } .academyJourney.process-nav-short .process-wrap li{ display:flex; } .process-nav-short .process{ padding-left: 10px; flex-direction:row; background-color: var(--color-brand-white); border: 1px solid var(--color-background-hover-grey-darker); border-radius: var(--buttons-border-radius); } .process-nav-short .process:hover, .process-nav-short .process:focus-within{ background-color: var(--color-brand-black); } .process-nav-short .process div{ height: 25px; width: 25px; font-size: var(--typography-paragraph-font-size-XL); } .process-nav-short .process p{ padding: 10px; background-color: var(--color-brand-white); font-size: var(--typography-paragraph-font-size-M); } .process-nav-short .process div, .process-nav-short .process p{ margin: 0!important; } /* --- TRANSFORMATION LEAD VARIANT --- */ .academyJourney.variant-1 ul{ display:grid; } .transformation-lead{ margin:0; position: relative; display:flex; border: 2px solid var(--color-background-hover-grey-darker); border-radius: var(--card-border-radius); } .transformation-lead div.title{ padding: 0 10px; position:absolute; top: -14px; text-align:center; color: var(--color-paragraph-dark-grey); background-color: var(--color-brand-white); } /* --- TRANSFORMATION LEAD VARIANT - SHORT VERSION --- */ .academyJourney.variant-1.process-nav-short ul{ display: grid; } .academyJourney.variant-1.process-nav-short .process-wrap{ align-items: center; } .academyJourney.variant-1.process-nav-short .transformation-lead, .academyJourney.variant-1.process-nav-short .transformation-lead li, .academyJourney.variant-1.process-nav-short .transformation-lead li .process{ width: 100%; } /* --- IDs --- */ .widget.widget--html.widget--html_standard{ position:relative; } #started, #trained, #qualified, #experience, #goodtoknow, #mustdo, #purchase, #onboard, #deploy, #adopt, #grow{ position:absolute; bottom:0; height:130px; z-index: -1; } #started p, #trained p, #qualified p, #experience p, #goodtoknow p, #mustdo p, #purchase p, #onboard p, #deploy p, #adopt p, #grow p{ display:none; } /* --- IDs Backend view --- */ .manager #started p, .manager #trained p, .manager #qualified p, .manager #experience p, .manager #goodtoknow p, .manager #mustdo p, .manager #purchase p, .manager #onboard p, .manager #deploy p, .manager #adopt p, .manager #grow p{ display:block; } .manager #started, .manager #trained, .manager #qualified, .manager #experience, .manager #goodtoknow, .manager #mustdo, .manager #purchase, .manager #onboard, .manager #deploy, .manager #adopt, .manager #grow{ position: relative; height: unset; z-index: 0; } /* --- RESPONSIVE --- */ @media only screen and (min-width: 48.063em){ .persona-tabs{ padding: 40px 100px 0; } .academyJourney .process-wrap{ margin: 0; padding: 0 100px; } .process-nav .process-wrap li{ width: 100%; margin: 0 20px; } .academyJourney .process-wrap:before{ content: ""; position: absolute; background-color: var(--color-background-hover-grey-darker); border: none; } .academyJourney .process-wrap::before{ height: 6px; top: 27px; } .academyJourney .process-wrap::before{ width: 66vw; left: 18vw; } .academyJourney.variant-1.process-nav .process-wrap::before{ top: 55px; left: 15vw; width: 70vw; } .process-wrap .process div, .process-wrap .process p{ text-align: center; } /* --- TRANSFORMATION LEAD VARIANT --- */ .process-nav{ padding-top: 40px; } .academyJourney.variant-1 ul{ justify-items:center; } .academyJourney.variant-1.process-nav .process-wrap{ grid-template-columns: 1fr 2fr 1fr 1fr; } .academyJourney.variant-1.process-nav li:not(.academyJourney.variant-1 li:nth-child(2):not(.academyJourney.variant-1 .transformation-lead li:nth-child(2))){ padding-top: 25px; padding-bottom: 25px; } .academyJourney.variant-1 .process-wrap .transformation-lead{ grid-template-columns: repeat(2, 1fr); } /* --- TRANSFORMATION LEAD VARIANT - SHORT VERSION --- */ .academyJourney.variant-1.process-nav-short .process-wrap{ grid-template-columns: repeat(4, auto); } /* --- SHORT VERSION --- */ .academyJourney.process-nav-short{ padding: 10px 0; } .academyJourney.variant-1.process-nav-short{ padding: 12px 0 10px; } .academyJourney.process-nav-short .process-wrap::before{ top: 21px; left: 10vw; width: 79vw; } .academyJourney.variant-1.process-nav-short .process-wrap::before{ top: 32px; width: 78vw; } .academyJourney.process-nav-short .process-wrap li{ justify-content:center; } .process-nav-short .process{ justify-content:center; } .academyJourney.variant-1.process-nav-short .transformation-lead li{ padding: 10px; } .academyJourney.variant-1.process-nav-short .transformation-lead li:nth-child(2){ padding-right: 0; } button.persona-mobile-menu{ display: none!important; } #started, #trained, #qualified, #experience, #goodtoknow, #mustdo, #purchase, #onboard, #deploy, #adopt, #grow{ height:130px; } } @media only screen and (min-width: 48.063em) and (max-width: 64em){ .academyJourney .process-wrap{ padding: 0 32px; } } @media only screen and (max-width: 48.063em){ .persona-tabs{ padding: 40px 24px 0; } .academyJourney.process-nav.active{ display: flex; } .academyJourney.process-nav, .academyJourney.process-nav-short{ background-color: var(--color-brand-white); border: 1px solid #D9D9D9; } .academyJourney.process-nav-short .process-wrap li, .academyJourney.process-nav-short .process-wrap li .process, .academyJourney.process-nav .process-wrap li, .academyJourney.variant-1 .transformation-lead li{ width: 100%; } .academyJourney .process-wrap li{ padding: 10px 10px 0; } .academyJourney.variant-1 .process-wrap li:first-child:not(.academyJourney.variant-1 .process-wrap .transformation-lead li:first-child), .academyJourney .process-wrap li:last-child{ padding-bottom: 10px; } .process-nav .process{ padding-left: 10px; background-color: var(--color-brand-white); border: 1px solid var(--color-background-hover-grey-darker); border-radius: var(--buttons-border-radius); } .process-nav .process div{ height: 25px; width: 25px; font-size: var(--typography-paragraph-font-size-XL); } .process-nav .process p{ padding: 10px; background-color: var(--color-brand-white); font-size: var(--typography-paragraph-font-size-M); } .process-nav .process div{ margin:0; } .process-nav .process:hover, .process-nav .process:focus-within{ background-color: var(--color-brand-black); } .academyJourney.process-nav.active{ display: flex; justify-content:center; } .academyJourney .process-wrap{ flex-direction: column; } .academyJourney .process-wrap::before{ width: 6px; top: 27px; left: 72px; } .academyJourney .process-wrap::before{ height: 27vh; } .process-wrap .process{ flex-direction: row; } .process-wrap .process p{ margin-left: 10px; } .academyJourney.persona-mobile-menu.active, .academyJourney.persona-mobile-menu.active p.active{ display: block; } .academyJourney.persona-mobile-menu.active p:not(p.active){ display: none; } /* --- TRANSFORMATION LEAD VARIANT - mobile --- */ .academyJourney.variant-1.process-nav ul, .academyJourney.variant-1.process-nav-short ul{ display: flex; flex-direction: column; align-items: center; } .academyJourney.variant-1 .process-wrap::before{ top: 70px; height: 40vh; } button.persona-mobile-menu{ margin:0; color: var(--color-brand-white); background-color: var(--color-brand-black); border: 1px solid var(--color-brand-white); border-radius: var(--buttons-border-radius); padding: 7px 7px 0; } .academyJourney.process-nav, .academyJourney.process-nav-short, .academyJourney.variant-1.process-nav, .academyJourney.variant-1.process-nav-short, button.persona-mobile-menu{ position: fixed; right: 14px; } .academyJourney.process-nav, .academyJourney.process-nav-short, .academyJourney.variant-1.process-nav, .academyJourney.variant-1.process-nav-short{ bottom: 104px; } button.persona-mobile-menu{ bottom: 65px; } #started, #trained, #qualified, #experience, #goodtoknow, #mustdo, #purchase, #onboard, #deploy, #adopt, #grow{ height: 60px; } } /* ========= END - REVAMPED PERSONA PAGE STYLING ========= */ /* ========= SLIDESHOW SNIPPET ========= */ .carousel-snippet .carousel-container { padding: 10px; border-radius: var(--card-border-radius); background-color: var(--color-background-default-grey); } .carousel-snippet .carousel-image-area { width: 100%; border-radius: var(--card-border-radius); height: 35rem; /* (28rem for image + 7rem for text) */ } .carousel-snippet .carousel-item { display: none; width: 100%; height: 100%; } .carousel-snippet .carousel-item.active { display: flex; } .carousel-snippet .carousel-image-wrapper { width: 100%; display: flex; justify-content: center; align-items: center; background-color: var(--color-brand-white); } .carousel-snippet .carousel-image-wrapper p, .carousel-snippet .carousel-image-wrapper figure{ margin: 0!important; height: 100%; } .carousel-snippet .carousel-item img { width: 100%; height: 100%; object-fit: contain; } .carousel-snippet .carousel-text-wrapper { padding: 20px; color: #000000; background-color: #ffffff; overflow-y: auto; } .carousel-snippet .carousel-container, .carousel-snippet .carousel-image-wrapper, .carousel-snippet .carousel-text-wrapper{ border: 1px solid var(--color-background-hover-grey-darker); } /* 2. CONTROLS BAR */ .carousel-snippet .carousel-controls { padding: 20px 0 10px; display: flex; justify-content: space-between; align-items: center; } .carousel-snippet .button-wrapper { display: flex; align-items: center; } .carousel-snippet .carousel-button { margin: 0; width: 190px; display: flex; align-items: center; font-size: 17px; color: var(--color-brand-white); background-color: var(--color-brand-black); border: none; border-radius: var(--buttons-border-radius); -webkit-transition-duration: unset; transition-duration: unset; } .carousel-snippet .carousel-button p{ width: 100%; margin: 0!important; text-align: center; } .carousel-snippet .prev-button{ padding: 10px 24px 10px 16px; } .carousel-snippet .prev-button span{ margin-right: 10px; } .carousel-snippet .next-button{ padding: 10px 16px 10px 24px; } .carousel-snippet .next-button span{ margin-left: 10px; } .carousel-snippet .carousel-button:hover{ background-color: #000000cc; } .carousel-snippet .carousel-indicators { display: flex; } .carousel-snippet .carousel-indicators ul{ margin: 0; display:flex; list-style: none; } .carousel-snippet .carousel-indicators ul li{ display:flex; flex-direction: column; } .carousel-snippet .carousel-dot{ margin: 0 2px; padding: 0; width: 40px; height: 40px; font-family: Poppins; font-size: 17px; color: var(--color-brand-black); background-color: var(--color-background-hover-grey-lighter); border-radius: var(--buttons-border-radius); transition: all 0.3s ease-in-out; } .carousel-snippet .carousel-dot.active, .carousel-snippet .carousel-dot:hover, .carousel-snippet .carousel-dot:focus-within{ color: var(--color-brand-white); background-color: var(--color-brand-black); } @media only screen and (min-width: 40.063em){ .carousel-snippet .carousel-image-wrapper { border-top-left-radius: var(--card-border-radius); border-bottom-left-radius: var(--card-border-radius); } .carousel-snippet .carousel-text-wrapper { width: 30rem; margin-left: 5px; border-top-right-radius: var(--card-border-radius); border-bottom-right-radius: var(--card-border-radius); } } @media only screen and (max-width: 40.063em){ .carousel-snippet .carousel-image-wrapper { border-top-right-radius: var(--card-border-radius); border-top-left-radius: var(--card-border-radius); } .carousel-snippet .carousel-text-wrapper { border-top: none; } .carousel-snippet .carousel-item.active{ flex-direction: column; } .carousel-snippet .carousel-controls{ display:grid; grid-template-columns: repeat(2, 1fr); gap: 10px; } .carousel-snippet .carousel-button{ grid-row: 2/3; width: 100%; } .carousel-snippet .carousel-indicators{ grid-row: 1/2; grid-column: 1/3; justify-content: center; margin-bottom: 5px; } } /* --- 3. COURSE BACKEND STYLE --- */ .redactor-styles .carousel-item { margin: 0 0 30px; height: auto !important; display: flex !important; flex-direction: column !important; } .redactor-styles .carousel-image-wrapper{ border: 2px dashed var(--color-brand-blue); } .redactor-styles .carousel-text-wrapper { width: 100%; padding: 1rem; margin: 0; color: var(--color-brand-black) !important; background-color: var(--color-brand-white); } .redactor-styles .carousel-item:last-child .carousel-text-wrapper{ margin: 0; } .redactor-styles .carousel-image-area { height: auto !important; } .redactor-styles .carousel-controls { display: none !important; } /* snippet gallery view */ .modal-body ul.items__list li .row .carousel-snippet .carousel-image-area{ height: auto; } /* NEW ADD IT (17/12/2025) */ .su__featured-thumbnail.course-completed{ position: relative; } /* === HIDE PRICE TO NON-ELEGIBLES === */ /* QUALIFICATIONS */ div.widget--course-purchase div.enroll__buy{ display:none; } /* ECOMMERCE PRODUCTS */ div.enroll.discount-group{ display:none; } /* ========= always in the end ========= */ /* EVENTS design */ .aspect-\[2\/1\] {aspect-ratio: unset; height: 190px;} .learn .in-person-event .event-sidebar__container .event-sidebar{margin-top: -120px;} .event-sidebar__container .event-sidebar__header {padding: 30px 30px 0;} .event-sidebar__container .event-sidebar__content {padding: 0 30px 30px;} .event-sidebar__meeting__date span {line-height: 22px;} .learn.in-person-event .medium-8.large-9.columns.event-content {padding-left: 24px!important; padding-right: 24px!important;} @media only screen and (min-width: 64.063em) { a.learning-content__back-button {padding: 26px 100px 13px!important;} } @media only screen and (max-width: 48em) { .learning-content-hero--no-asset {height: 190px!important;} } /* --- Exams index --- */ .quiz-start__content.relative.z-\[60000\]{z-index: 0;} .featured-content-multi-carousel__nav-left, .featured-content-multi-carousel__nav-left i:before, .featured-content-multi-carousel__nav-right, .featured-content-multi-carousel__nav-right i:before { height: 64px; } /* WHAT I DIDNT FIND IN THE MERGED FILE (github) AND WE HAVE TO KEEP (widget content > li > a > div > img) */ .catalog-grid-item__asset-container img { padding: 0; } /* WHAT I DIDNT FIND IN THE MERGED FILE (github) AND WE HAVE TO REVIEW div.widget--featured-content_standard div.ember-view div.ember-view { margin-bottom: 0 !important; } .widget.widget--featured-content.widget--featured-content_standard a.catalog-item .catalog-grid-item, .featured-content-multi-carousel-item:hover { filter: unset !important; transform: unset !important; } div.widget--featured-content_standard div.ember-view div.ember-view { margin-bottom: 0 !important; } */