body, html { overflow: auto; overflow-x: hidden; } @font-face { font-family: Microtype; src: url("../fonts/microtype.ttf"); } @font-face { font-family: Innerspace; src: url("../fonts/innerspace.ttf"); } :root { --mainpage-orange-bg: #FFF0EA; --orange-theme-color: #C33700; --orange-theme-color-light: #FA652F; --orange-theme-color-dark: #8F2800; --blue-theme-color: #3060B8; --blue-theme-color-dark: #234585; --green-theme-color: #237B5B; --green-theme-color-dark: #17523D; --purple-theme-color: #4C3C7C; --purple-theme-color-light: #F7F7F8; --purple-theme-color-dark: #3B3064; --fuchsia-theme-color: #A63991; --fuchsia-theme-color-dark: #8C307B; --header-background-color-orange: #FA652F; --header-background-color-blue: #3060B8; --header-background-color-purple: #4C3C7C; --header-background-color-fuschia: #A63991; --header-background-color-green: #237B5B; /* transparent colors for more links widget */ --transparent-purple: #4F40861A; --transparent-green: #2684621A; --transparent-fuchsia: #F7F7F8; /* end transparent colors for more links widget */ --main-header-image-url: url('/Themes.Main/img/background-images/main-page-header.png'); --purple-header-image-url: url('/Themes.Main/img/background-images/header-managers.svg'); --green-header-image-url: url('/Themes.Main/img/background-images/header-parents.svg'); --fuchsia-header-image-url: url('/Themes.Main/img/background-images/header-students.svg'); --blue-header-image-url: url('/Themes.Main/img/background-images/header-business.svg'); --default-header-image-url: url('/Themes.Main/img/background-images/header-main.svg'); --small-logo-white-yellow: url('/Themes.Main/img/logos/white-yellow-logo.svg'); --small-logo-white-purple: url('/Themes.Main/img/logos/white-purple-logo.svg'); --yellow-search-icon: url('/Themes.Main/img/search-yellow.svg'); --purple-search-icon: url('/Themes.Main/img/search-purple.svg'); --yellow-dark-search-icon: url('/Themes.Main/img/search-yellow-dark.svg'); --purple-right-arrow: url('/Themes.Main/img/arrows/purple-right-arrow.svg'); --green-right-arrow: url('/Themes.Main/img/arrows/green-right-arrow.svg'); --fuchsia-right-arrow: url('/Themes.Main/img/arrows/fuchsia-right-arrow.svg'); --blue-right-arrow: url('/Themes.Main/img/arrows/blue-right-arrow.svg'); --purple-more-info-link: url('/Themes.Main/img/arrows/purple-more-info-link.svg'); --purple-external-link: url('/Themes.Main/img/arrows/purple-external-link.svg'); --orange-icon-facebook: url('/Themes.Main/img/icons/orange-icon-facebook.svg'); --purple-icon-facebook: url('/Themes.Main/img/icons/purple-icon-facebook.svg'); --green-icon-facebook: url('/Themes.Main/img/icons/green-icon-facebook.svg'); --fuchsia-icon-facebook: url('/Themes.Main/img/icons/fuchsia-icon-facebook.svg'); --blue-icon-facebook: url('/Themes.Main/img/icons/blue-icon-facebook.svg'); --orange-icon-viber: url('/Themes.Main/img/icons/orange-icon-viber.svg'); --purple-icon-viber: url('/Themes.Main/img/icons/purple-icon-viber.svg'); --green-icon-viber: url('/Themes.Main/img/icons/green-icon-viber.svg'); --fuchsia-icon-viber: url('/Themes.Main/img/icons/fuchsia-icon-viber.svg'); --blue-icon-viber: url('/Themes.Main/img/icons/blue-icon-viber.svg'); --orange-icon-telegram: url('/Themes.Main/img/icons/orange-icon-telegram.svg'); --purple-icon-telegram: url('/Themes.Main/img/icons/purple-icon-telegram.svg'); --green-icon-telegram: url('/Themes.Main/img/icons/green-icon-telegram.svg'); --fuchsia-icon-telegram: url('/Themes.Main/img/icons/fuchsia-icon-telegram.svg'); --blue-icon-telegram: url('/Themes.Main/img/icons/blue-icon-telegram.svg'); --orange-icon-copy: url('/Themes.Main/img/icons/orange-icon-copy.svg'); --purple-icon-copy: url('/Themes.Main/img/icons/purple-icon-copy.svg'); --green-icon-copy: url('/Themes.Main/img/icons/green-icon-copy.svg'); --fuchsia-icon-copy: url('/Themes.Main/img/icons/fuchsia-icon-copy.svg'); --blue-icon-copy: url('/Themes.Main/img/icons/blue-icon-copy.svg'); --orange-icon-external-link: url('/Themes.Main/img/icons/orange-icon-external-link.svg'); --purple-icon-external-link: url('/Themes.Main/img/icons/purple-icon-external-link.svg'); --green-icon-external-link: url('/Themes.Main/img/icons/green-icon-external-link.svg'); --fuchsia-icon-external-link: url('/Themes.Main/img/icons/fuchsia-icon-external-link.svg'); --blue-icon-external-link: url('/Themes.Main/img/icons/blue-icon-external-link.svg'); --external-link-icon-visited: url('/Themes.Main/img/icons/icon-external-link-visited.svg'); --orange-next-page-icon: url('/Themes.Main/icons/next_page-orange.svg'); --purple-next-page-icon: url('/Themes.Main/icons/next_page-purple.svg'); --green-next-page-icon: url('/Themes.Main/icons/next_page-green.svg'); --fuchsia-next-page-icon: url('/Themes.Main/icons/next_page-fuchsia.svg'); --blue-next-page-icon: url('/Themes.Main/icons/next_page-blue.svg'); --orange-last-page-icon: url('/Themes.Main/icons/last_page-orange.svg'); --purple-last-page-icon: url('/Themes.Main/icons/last_page-purple.svg'); --green-last-page-icon: url('/Themes.Main/icons/last_page-green.svg'); --fuchsia-last-page-icon: url('/Themes.Main/icons/last_page-fuchsia.svg'); --blue-last-page-icon: url('/Themes.Main/icons/last_page-blue.svg'); --blockquote-purple-border: rgba(79, 64, 134, 0.3); --blockquote-green-border: rgba(38, 132, 98, 0.3); --blockquote-orange-border: rgba(238, 111, 62, 0.3); --blockquote-fuchsia-border: rgba(166, 57, 145, 0.3); --blockquote-blue-border: rgba(148, 96, 184, 0.3); --gray03:#F7F7F8; --gray05:#F2F2F2; --gray10:#E6E6E6; --gray20:#CCCCCC; --gray40:#999999; --gray55:#737373; --gray60:#666666; --gray70:#4D4D4D; --gray80:#333333; --gray90:#1A1A1A; --purple-shadow: 0px 12px 17px rgba(88, 57, 136, 0.14), 0px 5px 22px rgba(88, 57, 136, 0.12), 0px 7px 8px rgba(88, 57, 136, 0.2); --green-shadow: 0px 12px 17px rgba(38, 132, 98, 0.14), 0px 5px 22px rgba(38, 132, 98, 0.12), 0px 7px 8px rgba(38, 132, 98, 0.2); --orange-shadow: 0px 12px 17px rgba(238, 111, 62, 0.14), 0px 5px 22px rgba(238, 111, 62, 0.12), 0px 7px 8px rgba(238, 111, 62, 0.2); --fuchsia-shadow: 0px 12px 17px rgba(166, 57, 145, 0.14), 0px 5px 22px rgba(166, 57, 145, 0.12), 0px 7px 8px rgba(166, 57, 145, 0.2); --blue-shadow: 0px 12px 17px rgba(48, 96, 184, 0.14), 0px 5px 22px rgba(48, 96, 184, 0.12), 0px 7px 8px rgba(48, 96, 184, 0.2); --purple-card-shadow: 0px 8px 16px rgba(88, 57, 136, 0.25); --green-card-shadow: 0px 8px 16px rgba(38, 132, 98, 0.25); --fuchsia-card-shadow: 0px 8px 16px rgba(166, 57, 145, 0.25); --blue-card-shadow: 0px 8px 16px rgba(48, 96, 184, 0.25); --default-card-shadow: 0px 8px 16px rgba(238, 111, 62, 0.25); --purple-card-hover-shadow: 0px 16px 40px rgba(88, 57, 136, 0.25); --green-card-hover-shadow: 0px 16px 40px rgba(38, 132, 98, 0.25); --fuchsia-card-hover-shadow: 0px 16px 40px rgba(166, 57, 145, 0.25); --blue-card-hover-shadow: 0px 16px 40px rgba(48, 96, 184, 0.25); --default-card-hover-shadow: 0px 16px 40px rgba(238, 111, 62, 0.25); --custom-input-purple-background: #EDEBF2; } body { background-color: #fff; font-family: 'Innerspace'; min-height: 100vh; color: #000; } /* Themes backgrounds */ body.Purple-Theme { --header-image: var(--purple-header-image-url); --header-background-color: var(--header-background-color-purple); --color: var(--purple-theme-color); --color-light: var(--purple-theme-color-light); --color-dark: var(--purple-theme-color-dark); --small-logo: var(--small-logo-white-yellow); --shadow: var(--purple-shadow); --blockquote-border: var(--blockquote-purple-border); --tranparent-background: var(--transparent-purple); --search-icon: var(--yellow-search-icon); --right-arrow: var(--purple-right-arrow); --social-icon-facebook: var(--purple-icon-facebook); --social-icon-viber: var(--purple-icon-viber); --social-icon-telegram: var(--purple-icon-telegram); --social-icon-copy: var(--purple-icon-copy); --card-shadow: var(--purple-card-shadow); --card-hover-shadow: var(--purple-card-hover-shadow); --external-link-icon: var(--purple-icon-external-link); --page-last-icon: var(--purple-last-page-icon); --page-next-icon: var(--purple-next-page-icon); } body.Green-Theme { --header-image: var(--green-header-image-url); --header-background-color: var(--header-background-color-green); --color: var(--green-theme-color); --color-dark: var(--green-theme-color-dark); --small-logo: var(--small-logo-white-yellow); --shadow: var(--green-shadow); --blockquote-border: var(--blockquote-green-border); --tranparent-background: var(--transparent-green); --search-icon: var(--yellow-search-icon); --right-arrow: var(--green-right-arrow); --social-icon-facebook: var(--green-icon-facebook); --social-icon-viber: var(--green-icon-viber); --social-icon-telegram: var(--green-icon-telegram); --social-icon-copy: var(--green-icon-copy); --card-shadow: var(--green-card-shadow); --card-hover-shadow: var(--green-card-hover-shadow); --external-link-icon: var(--green-icon-external-link); --page-last-icon: var(--green-last-page-icon); --page-next-icon: var(--green-next-page-icon); } body.Fuchsia-Theme { --header-image: var(--fuchsia-header-image-url); --header-background-color: var(--header-background-color-fuschia); --color: var(--fuchsia-theme-color); --color-dark: var(--fuchsia-theme-color-dark); --small-logo: var(--small-logo-white-yellow); --search-icon: var(--yellow-search-icon); --tranparent-background: var(--transparent-fuchsia); --right-arrow: var(--fuchsia-right-arrow); --social-icon-facebook: var(--fuchsia-icon-facebook); --social-icon-viber: var(--fuchsia-icon-viber); --social-icon-telegram: var(--fuchsia-icon-telegram); --social-icon-copy: var(--fuchsia-icon-copy); --card-shadow: var(--fuchsia-card-shadow); --card-hover-shadow: var(--fuchsia-card-hover-shadow); --external-link-icon: var(--fuchsia-icon-external-link); --blockquote-border: var(--blockquote-fuchsia-border); --shadow: var(--fuchsia-shadow); --page-last-icon: var(--fuchsia-last-page-icon); --page-next-icon: var(--fuchsia-next-page-icon); } body.Blue-Theme { --header-image: var(--blue-header-image-url); --header-background-color: var(--header-background-color-blue); --color: var(--blue-theme-color); --color-dark: var(--blue-theme-color-dark); --small-logo: var(--small-logo-white-yellow); --search-icon: var(--yellow-search-icon); --right-arrow: var(--blue-right-arrow); --card-shadow: 48, 96, 184; --social-icon-facebook: var(--blue-icon-facebook); --social-icon-viber: var(--blue-icon-viber); --social-icon-telegram: var(--blue-icon-telegram); --social-icon-copy: var(--blue-icon-copy); --card-shadow: var(--blue-card-shadow); --card-hover-shadow: var(--blue-card-hover-shadow); --external-link-icon: var(--blue-icon-external-link); --shadow: var(--blue-shadow); --blockquote-border: var(--blockquote-blue-border); --page-last-icon: var(--blue-last-page-icon); --page-next-icon: var(--blue-next-page-icon); } body.Default-Theme { --header-image: var(--default-header-image-url); --header-background-color: var(--header-background-color-orange); --color: var(--orange-theme-color); --color-dark: var(--orange-theme-color-dark); --small-logo: var(--small-logo-white-purple); --shadow: var(--orange-shadow); --tranparent-background: var(--transparent-purple); --search-icon: var(--purple-search-icon); --right-arrow: var(--fuchsia-right-arrow); --social-icon-facebook: var(--orange-icon-facebook); --social-icon-viber: var(--orange-icon-viber); --social-icon-telegram: var(--orange-icon-telegram); --social-icon-copy: var(--orange-icon-copy); --color-light: var(----orange-theme-color-light); --card-shadow: var(--default-card-shadow); --card-hover-shadow: var(--default-card-hover-shadow); --blockquote-border: var(--blockquote-orange-border); --external-link-icon: var(--orange-icon-external-link); --page-last-icon: var(--orange-last-page-icon); --page-next-icon: var(--orange-next-page-icon); } .mainpage-layout-body { background-image: var(--main-header-image-url); background-repeat: no-repeat; background-size: 100%; background-color: var(--orange-theme-color-light); --search-icon: var(--purple-search-icon); --color: var(--orange-theme-color); } .layout-header { background-image: var(--header-image); background-color: var(--header-background-color); font-family: 'Innerspace'; background-size: cover; font-family: Innerspace; font-style: normal; font-weight: bold; font-size: 19px; line-height: 25px; } /* Filled svg */ .filled-svg { fill: var(--color); } /* Themes colored svg */ .colored-svg path { stroke: var(--color); } /* Themes logos */ .small-logo { content: var(--small-logo); } /* General styles */ .search-icon { content: var(--search-icon) ; width: 24px; height: 24px; } a { color: var(--color); } a:hover { color: var(--color-dark); } .mainpage-layout-body a:visited { color: black; } body:not(.mainpage-layout-body) a:visited { color: #884488; } .breadcrumb-item a:visited { color: var(--color); } header { font-size: 15px; line-height: 25px; } body.low-vision { background-color: white !important; } body.low-vision * { color: black !important; border-color: black; } body.low-vision img { filter: grayscale(100); } body.low-vision img#imageForChangeVision { padding: 5px; border: 1px solid black; } body.low-vision footer { background-color: white !important; color: black !important; } body.low-vision footer img { filter: invert(1); } body.low-vision .dropdown-main-menu-link-item:hover { background-color: white !important; text-decoration: underline; } body.low-vision .dropdown-menu { background-color: white !important; } li.menuItem:not(:last-of-type) { margin-right: 2rem; } .bgDarkGreenP { background-color: #04b577; } .mainMenu .dropdown-toggle::after { display: none; } .subMenu { background-color: #FFFFFF; padding: 25px; text-transform: initial !important; border-radius: 8px; border-top-width:4px; border-top-color:var(--orange-theme-color); z-index: 1; width: intrinsic; /* Safari */ width: -moz-max-content; /* Firefox */ width: -webkit-max-content; /* Chrome / Edge */ width: max-content; max-width: 300px; outline: 1px solid #ffffff; box-shadow: 0px 8px 16px rgba(0, 0, 0, 0.12); } .purple-theme-menu .subMenu { border-top-color:var(--purple-theme-color); } .green-theme-menu .subMenu { border-top-color:var(--green-theme-color); } .fuchsia-theme-menu .subMenu { border-top-color:var(--fuchsia-theme-color); } .blue-theme-menu .subMenu { border-top-color:var(--blue-theme-color); } .dropdown-menu-center { right: auto; left: 50% !important; -webkit-transform: translateX(-50%) !important; -o-transform: translateX(-50%) !important; transform: translateX(-50%) !important; } .subMenu .submenuItem { color: var(--color); white-space: normal; overflow-wrap: break-word; -webkit-tap-highlight-color: transparent !important; outline: none !important; } .submenuItem:focus { background-color: var(--gray10); } .dropdown-item.active, .dropdown-item:active { background-color: unset; } .subMenu.show { padding-top: 0; padding-bottom: 0.5rem; box-shadow: -0.5px -0.5px 0px 1px #ffffff } .nav-item:not(.submenu-column-2) .subMenu.show li:first-of-type .submenuItem:not(.highlited-menu-item) { margin-top: 0.5rem; padding-top: 0.5rem; } .submenu-column-2 .subMenu.show li:nth-of-type(1) .submenuItem:not(.highlited-menu-item) { margin-top: 0.5rem; padding-top: 0.5rem; } .submenu-column-2 .subMenu.show li:nth-of-type(2) .submenuItem:not(.highlited-menu-item) { margin-top: 0.5rem; padding-top: 0.5rem; } .subMenu.show li:nth-of-type(1) .submenuItem.highlited-menu-item { border-top-left-radius: 8px; } .subMenu.show li:nth-of-type(2) .submenuItem.highlited-menu-item { border-top-right-radius: 8px; } .subMenu.show>li { --bs-gutter-y:0; --bs-gutter-x:0; } .subMenu.show .submenuItem { padding-left: 1.5em; padding-right: 1.5em; } .submenu-column-2 .subMenu.show { display: flex; } .submenu-column-2 .subMenu li:nth-of-type(odd) .submenuItem { padding-right: 1rem; } .submenu-column-2 .subMenu li:nth-of-type(even) .submenuItem { padding-left: 1rem; } .submenu-column-2 .subMenu.show { columns: 2; -webkit-columns: 2; -moz-columns: 2; max-width: 600px; } .submenu-column-2 .subMenu > li { width: 50%; } .submenuItem.highlited-menu-item { height: 60px; } .dropdown-arrow { align-self: center; margin-top: -3px; } .dropdown-menu-arrow { display: none; z-index: 1; position: absolute; width: 26px; left: calc(50% - 13px); fill: var(--orange-theme-color); top: 15px; stroke: #ffffff; } .dropdown-menu.show+.dropdown-menu-arrow { display: flex; } .purple-theme-menu .dropdown-menu-arrow { fill:var(--purple-theme-color); } .green-theme-menu .dropdown-menu-arrow { fill:var(--green-theme-color); } .fuchsia-theme-menu .dropdown-menu-arrow { fill:var(--fuchsia-theme-color); } .blue-theme-menu .dropdown-menu-arrow { fill:var(--blue-theme-color); } footer { min-height: 140px; font-family: 'Microtype'; background-color: black; } .footer-info { min-height: unset; padding-top: 20px; padding-bottom: 20px; } .all-rights-reserved-text { font-size: 12px; line-height: 16px; } .beta-text, .press-service { font-size: 12px; line-height: 12.3px; } .accessability-info { font-size: 12px; line-height: 14px; color: var(--gray40); } a.accessability-info, a.accessability-info:visited, a.contact-mail, a.contact-mail:visited { color: var(--gray40) !important; } .contact-mail::after { display: none; } .footer-info-border-bottom:after { content: " "; border-bottom: 1px solid var(--gray40); display:block; } .highlited-menu-item { background: var(--gray03); display: flex; align-items: center; } a.menuItem:hover { text-decoration-line: underline; text-decoration-thickness: 3px; text-underline-offset: 10%; } .mainMenu .menuItem { font-size: 19px; font-family: Innerspace; font-weight: 700; line-height: 25px; z-index: 2; } .mainMenu li:last-of-type { margin-right: 0 !important; } .mainMenu li:first-of-type a.menuItem.nav-link.content-menu-item { padding-left: 0; } .mainMenu li a.menuItem.nav-link.content-menu-item { padding-right: 0; } .mobile-navmenu-item { font-family: Innerspace; font-size: 15px !important; font-weight: 700; line-height: 25px !important; letter-spacing: 0.04em; } .mobile-nav-submenu-list li { line-height: 30px; } .first-lady { padding: 400px 5em 64px 5em; display: flex; justify-content: center; background-color: var(--mainpage-orange-bg); margin-top: -400px } .first-lady h2 { max-width: 638px; font-family: 'Innerspace'; letter-spacing: 0.05em; text-transform: uppercase; } .main-video { max-width: 500px; } .cards { margin-top: 24px; margin-bottom: -125px; } .cards > div:first-child { justify-self: start; } .cards > div:last-child { justify-self: start; } .cards .card-title { font-size: 18px !important; line-height: 22px !important; text-align: center; letter-spacing: 0.04em; text-transform: uppercase; font-family: 'Innerspace'; min-height: 44px; display: flex; align-items: center; justify-content: center; } .card { padding-top: 30px; box-shadow: 0px 8px 16px rgba(238, 111, 62, 0.25); border-radius: 8px; border: none; } .card:focus, .card:hover { top: -10px; box-shadow: 0px 16px 40px rgba(238, 111, 62, 0.5); border-radius: 8px; } @media (min-width: 1200px ) { .card { max-width: 256px; } } .card .card-body { padding: 15px 24px 17px; } .cards .card-text { /* Small 1 */ font-family: 'Microtype'; font-style: normal; font-weight: normal; font-size: 14px; line-height: 20px; /* or 146% */ text-align: center; /* Grey/Grey-900 */ color: var(--gray70); } /* Announces */ .announces { font-family: Innerspace; margin-bottom: 40px; } .img-icon { position: absolute; margin-top: 10px; } button.unstyled-button { all: unset; cursor: pointer; } button.unstyled-button:focus { outline: black 5px auto; } .announces-header { display: flex; flex-direction: row; justify-content: space-between; align-items: center; } .announces header button { font-size: 13px; line-height: 24px; padding: 5px 30px; border: 1px solid #686868; background-color: transparent; border-radius: 20px; cursor: pointer; font-family: 'Innerspace'; } .announces header h3 { text-transform: uppercase; font-weight: 700; } .announces-list { border: 2px solid var(--orange-theme-color-light); border-radius: 8px; display: flex; flex: 1; justify-content: space-between; } .announces-list a { display: block; font-family: 'Innerspace'; line-height: 50px; font-size: 40px; color: #000; text-decoration: none; color: initial; } @media (max-width: 767px) { .announces-list a { font-size: 25px; } } .announce { padding: 29px; } .announce header time { font-weight: bold; font-size: 16px; line-height: 24px; } .announce header time #day { font-size: 32px; } .announce header h5 { line-height: 1.5; letter-spacing: 1px; text-transform: uppercase; font-weight: 700; } .announce header h5 a { text-decoration: none; color: black; } p { font-size: 14px; line-height: 20px; font-family: 'Innerspace'; } .widget-body p { margin-top: 0; margin-bottom: 8px; } .widget-body { color: var(--gray80); } /* Techcard */ .tech-card { flex: 0 0 auto; width: 100% !important; } .tech-card-link { display: flex; text-decoration: none; } .tech-card-container { max-width: 100% !important; padding-top: 20px; width: 100% !important; } .tech-card-container p::after { content: ". \A"; white-space: pre-wrap; } .tech-card-body { min-height: 120px !important; } @media (max-width: 767px) { .tech-card-mobile { flex-direction: column; } } .tech-card-img { display: flex; justify-content: end; margin-left: 40px; } @media (max-width: 767px) { .tech-card-img { margin-left: 60px !important; } } .tech-card-text { margin-top: -10px; margin-bottom: 0; white-space: pre-line; } @media (max-width: 767px) { .tech-card-text { padding: 5px 24px 17px; text-align: center; } } .tech-card-text::after { content: "\A"; white-space: pre; } .tech-card-text::before { content: " "; } .tech-card-text:last-child::after { content: none; } @media (max-width: 767px) { .custom-card-header { padding-bottom: 0px; text-align: center !important; } } /* News */ .news .first-item h2 { margin-top: 1em; font-size: 1.5em; line-height: 36px; font-family: 'Innerspace'; } .news-list { font-family: 'Innerspace'; display: flex; flex-direction: row; padding-top: 25px; } @media (min-width: 1200px ) { .news-list .items-list { display: grid; grid-auto-rows: 1fr; } } .news-list .items-list .item { border-bottom: 2px solid #D6D6D6; padding-bottom: 40px; } .news-list .items-list > div:first-child { border-top: 2px solid #D6D6D6; } .news-list .items-list > div:only-child { border-bottom: none; } .item-title { font-size: 1em; line-height: 20px; font-weight: 799; font-family: 'Innerspace'; } .item a { text-decoration: none; color: black; } .first-item a { text-decoration: none; color: black; } .first-item img { max-height: 350px; } .item a:hover, .first-item a:hover { text-decoration: underline; } .date { color: var(--gray55); font-size: 12px; line-height: 16px; font-family: 'Microtype'; } .news-image { width: 100%; } .st-btn { display: inline-block !important; border-radius: 32px !important; height: 32px !important; width: 32px !important; padding: 3px !important; } #st-1 div.st-btn:hover { opacity: unset; border: 1px solid var(--color-dark) !important; } .st-btn[data-network='facebook'] { content: var(--social-icon-facebook); border: 1px solid var(--color) !important; } .st-btn[data-network='viber'] { content: var(--social-icon-viber); border: 1px solid var(--color) !important; } .st-btn[data-network='telegram'] { content: var(--social-icon-telegram); border: 1px solid var(--color) !important; } .st-btn[data-network='copy'] { border: 1px solid var(--color) !important; } .st-btn:not(.copied)[data-network='copy'] { content: var(--social-icon-copy); } .st-btn.copied[data-network='copy'] { width: auto !important; display: inline-flex !important; } .st-btn.copied[data-network='copy']::before { content: var(--social-icon-copy); height: 26px; transform: scale(1.2); padding: 3px; } .st-btn.copied[data-network='copy']::after { content: "Скопійовано"; align-self: center; color: var(--color); } .st-btn.st-last.st-remove-label.copied > img, .st-btn[data-network='copy'] .copy-notify { display: none !important; } /* Common styles */ .ghost-button { font-size: 13px; line-height: 24px; padding: 5px 30px; border: 1px solid #686868; background-color: transparent; border-radius: 20px; cursor: pointer; font-family: 'Innerspace'; transition: .2s ease-in-out; text-transform: uppercase; text-decoration: none; } .ghost-button:hover { background-color: var(--gray60); color: white !important; } .ghost-button:focus { background-color: #4D4D4D; color: white !important; } .colored-ghost-button { color: var(--color); border: 1px solid var(--color); } /* Breadcrumbs */ .breadcrumb { margin: 45px 0 28px 0; --bs-breadcrumb-divider: url('/Themes.Main/img/breadcrumbArrow.svg'); } .mainpage-layout-body .breadcrumb { display: none; } .breadcrumb:first-child { padding-left: 0; } .breadcrumb-item { font-size: 14px; font-family: 'Microtype'; line-height: 20px; color: var(--color) } .main-breadcrumb-item { font-size: 13px; font-family: 'Microtype'; line-height: 20px; color: var(--color) } .breadcrumb-item + .breadcrumb-item::before { padding-right: 15px; } .breadcrumb-item + .breadcrumb-item { padding-left: 15px; } #root-breadcrumb a { color: black; text-decoration: none; } /*Landing Page*/ .main-title { color: #fff; line-height: 50px; font-size: 40px !important; font-size: 2em; font-family: 'Innerspace'; letter-spacing: 0.05em; text-transform: uppercase; } .main-title-purple-part { color: var(--purple-theme-color); } .main-subtitle { font-family: 'Innerspace'; text-align: center; margin-top: 15px; margin-bottom: 0; font-size: 19px; line-height: 25px; color: white; max-width: 700px; font-weight: bold; } .description p { font-family: 'Microtype'; color: var(--gray90); } .news-announces { display:flex; justify-content: center; margin-bottom: 64px; margin-top: 64px; } .temp-wrapper { width: 1120px; max-width: 1120px; } .partners { display:flex; justify-content:center; } .headerTitle { line-height: 1.5; letter-spacing: 1px; font-weight: 700; text-transform: uppercase; } .partners-rows { filter: grayscale(1); display: grid; grid-template-columns: 1fr 1fr 1fr; margin-top: 60px; justify-items: center; } #first-row { grid-template-columns: repeat(4, 1fr); } #middle-row { margin-top: 65px; grid-template-columns: repeat(4, 1fr); } #last-row { margin-top: 65px; grid-template-columns: repeat(5, 1fr); grid-row-gap: 55px; } .mainPageFirstLadyImage { max-width: 448px; max-height: 298px; } @media (max-width: 991px ) { .partners-rows img { max-width: 70%; height: auto; } #first-row.partners-rows img { max-width: 90%; height: auto; } #middle-row.partners-rows img { max-width: 60%; height: auto; } } @media (max-width: 575px ) { .w-50 { width: 100% !important; } .blockquote-content p { font-size: 20px !important; line-height: 30px !important; } .article-title h1, h1.faq-question-title, .news-title h1 { font-size: 28px !important; line-height: 40px !important; } #first-row { margin-top: 2rem; grid-row-gap: 2rem; } #middle-row { margin-top: 2rem; grid-template-columns: repeat(2, 1fr); grid-row-gap: 2rem; } #middle-row.partners-rows img { max-width: 70%; } #last-row { margin-top: 2rem; grid-template-columns: repeat( 6, 1fr ); grid-row-gap: 2rem; } #last-row a { grid-column: span 2; } #last-row a:nth-last-child(1):nth-child(even) { grid-column: 3 / span 2; } .mainPageInfoCardsGroup { padding-left: 10px; padding-right: 10px; } .px-xs-1 { padding-right: .25rem ; padding-left: .25rem ; } } /* NEWS start */ .news, .article, .all-news { margin-bottom: 80px; } .news h1 { font-family: 'Innerspace'; font-size: 32px; line-height: 50px; text-transform: uppercase; } .news h2 { margin-top: 24px; margin-bottom: 0px; } .news p { font-family: 'Microtype'; font-size: 16px; line-height: 24px; color: var(--gray80); } .news>img, .news :not(td) > img, .news-widget :not(td) > img { width: 100%; margin-bottom: 16px; } .news .news-date, .article .news-date, .search-result-item .news-date, .news-item .news-date, .text-news-txt-gray.news-date, .chapter-page-container .news-date { background: url('../icons/clock.svg') no-repeat center left; color: var(--gray55); font-size: 13px; font-weight: 400; padding-left: 20px; font-family: Microtype; font-style: normal; font-weight: normal; line-height: 20px; margin: 6px 0; } .news .news-title { font-weight: 700; border-bottom: 1px solid #E6E6E6; margin-bottom: 24px; padding-bottom: 8px; } .news-item .news-title a { font-weight: 700; margin-bottom: 8px; } .news-item .news-title a::before { content: ''; position: absolute; top: 0; left: 0; right: 0; bottom: 0; } .news-content { font-size: 16px; line-height: 24px; color: var(--gray80); } .news .news-source{ font-family: 'Microtype'; font-size: 14px; color: var(--gray55); } .news .news-source a { text-decoration: none; color: var(--orange-theme-color-dark); } .news .news-source a:hover { text-decoration: underline; } .news .news-content p { font-size: 16px; line-height: 24px; } .news-item { padding: 24px 0 10px; border-bottom: 1px solid #E6E6E6; position: relative; } .add-three-dots { overflow: hidden; display: -webkit-box; -webkit-line-clamp: 4; -webkit-box-orient: vertical; word-wrap: break-word; text-overflow: ellipsis; } .all-news .news-item { display: flex; justify-content: space-between; } .all-news .news-item .news-title { line-height: 20px !important; } .all-news .news-item .news-content { margin: 8px 0; } .all-news .news-item:hover .news-content p { color: var(--gray60); } .all-news .pager { margin-top: 40px; margin-bottom: 20px; display: flex; justify-content: space-around; } .all-news .pager .previous, .all-news .pager .next { height: 32px; display: flex; align-items: center; } .all-news .pager .previous { padding-right: 9px; } .all-news .pager .next { padding-left: 9px; } .all-news .pager .next::after, .all-news .pager .previous::before { display: inline-block; content: url('/Themes.Main/icons/orange-next_page.svg'); margin: 0 9px; } .all-news .pager .previous::before { transform: rotate(180deg); } .all-news .pager .previous:hover, .all-news .pager .next:hover { background-color: rgba(195, 55, 0, 0.1); } .all-news .pager .previous a, .all-news .pager .next a { color: var(--color); } .all-news .pager .previous a:hover, .all-news .pager .next a:hover { color: var(--color-dark); } .news-item .news-content p { font-weight: 400; font-size: 14px; color: var(--gray70); font-family: 'Microtype'; } .news-item a { font-size: 14px; font-family: Innerspace; font-style: normal; font-weight: bold; line-height: 20px; color: #000000; text-decoration: none; } .news-item a:hover { text-decoration: underline; } .news-item .news-title:hover { color: var(--gray80); } .all-news .news-item .news-img img { width: 100%; } .all-news li { border: none; } .news-img-widget > img { height: 115px; } @media (max-width: 767px) { .news-item-mobile:nth-child(3) { display: none; } } @media (max-width: 992px) { .all-news .row .all-news-list, .ChapterPage .chapter-main-content { order: 1; } .all-news .row .recentAnounces-widget, .ChapterPage .chapter-sidebar { order: 0; margin-bottom: 40px; } .news-img-mobile { display: block; } .news-img-desktop { display: none; } .faqThemeTitle { background-repeat: no-repeat; background-image: url('/Themes.Main/img/arrows/arrow-down.svg'); background-position: right center; } .faqThemeTitle.active { background-image: url('/Themes.Main/img/arrows/arrow-up.svg'); } .faqQuestionsBlock { border-bottom-color: var(--color) !important; } .faq-category:not(:last-of-type) { margin-bottom: 1rem !important; } .faqThemeTitle:after { bottom: -16px !important; } } @media (min-width: 992px) { .news-img-mobile { display: none; } .news-img-desktop { display: block; } } .news-container { min-width: -moz-available; min-width: -webkit-fill-available; } /* NEWS end */ /* Announces start */ .recentAnounces-widget h3 { text-transform: uppercase; font-size: 32px; margin-bottom: 23px; line-height: 50px; } .recentAnounces-widget .announces-list-container { border: 2px solid var(--orange-theme-color-light); border-radius: 8px; padding: 24px 24px 40px; } .recentAnounces-widget .announce-time { font-size: 16px; font-family: 'Innerspace'; } .announces-list-container > .announce-time { border: none; } .announces-list-container > .announce-time ~ .announce-time { border-top: 2px solid #E6E6E6; margin-top: 24px; } .recentAnounces-widget .announce-time .day, .announce-date .day{ font-size: 32px; color: #000000; } .announces-list-container > .announce-card:not(:last-of-type) { padding-bottom: 24px; margin-bottom: 24px; border-bottom: 2px solid var(--gray10); } .announces-list-container > .announce-card { position: relative; } .recentAnounces-widget .announce-title a { font-size: 16px; text-transform: uppercase; margin: 12px 0 8px; font-family: 'Innerspace'; text-decoration: none; display: block; color: black; } .recentAnounces-widget .announce-title a:visited { color: black; } .recentAnounces-widget .announce-title a::before { content: ""; position: absolute; top: 0; bottom: 0; left: 0; right: 0; } .recentAnounces-widget .announce-title a:hover { text-decoration: underline; color: var(--gray80); } .recentAnounces-widget .announce-description { color: var(--gray70); font-size: 14px; line-height: 19px; font-family: 'Microtype'; margin-bottom: 0px; } .recentAnounces-widget .announce-card:hover .announce-description { color: var(--gray60); } /* Announces end */ .sidebar h3 { text-transform: uppercase; border-bottom: 4px solid var(--orange-theme-color-light); font-size: 15px; } .flow { display: flex; flex-wrap: wrap; } .flow .widget-container { width: 100%; padding-right: 15px; padding-left: 15px; margin-right: auto; margin-left: auto; } .widget-image-widget img { width: 100%; } .widget-align-left { margin-right: auto; } .widget-align-center { margin: 0 auto; } .widget-align-right { margin-left: auto; } .widget-align-justify { text-align: justify; } .widget-size-100, .widget-size-75, .widget .widget-size-75, .widget-size-66, .widget .widget-size-66, .widget-size-50, .widget .widget-size-50, .widget-size-33, .widget .widget-size-33, .widget-size-25, .widget .widget-size-25 { position: relative; width: 100%; padding-right: 15px; padding-left: 15px; flex: 0 0 100%; max-width: 100%; } @media (min-width: 576px) { .blockquote-content p { font-size: 20px !important; line-height: 30px !important; } .article-title h1, h1.faq-question-title, .news-title h1 { font-size: 28px !important; line-height: 40px !important; } .widget-size-25, .widget .widget-size-25 { flex: 0 0 25%; max-width: 25%; } .widget-size-33, .widget .widget-size-33 { flex: 0 0 33%; max-width: 33%; } .widget-size-50, .widget .widget-size-50 { flex: 0 0 50%; max-width: 50%; } .widget-size-66, .widget .widget-size-66 { flex: 0 0 66%; max-width: 66%; } .widget-size-75, .widget .widget-size-75 { flex: 0 0 75%; max-width: 75%; } .w-50 { width: 100% !important; } } @media (min-width: 768px) { .blockquote-content p { font-size: 24px !important; line-height: 36px !important; } .article-title h1, h1.faq-question-title, .news-title h1 { font-size: 32px !important; line-height: 50px !important; } .widget .widget-size-25 { flex: 0 0 25%; max-width: 25%; } .widget .widget-size-33 { flex: 0 0 33%; max-width: 33%; } .widget .widget-size-50 { flex: 0 0 50%; max-width: 50%; } .widget .widget-size-66 { flex: 0 0 66%; max-width: 66%; } .widget .widget-size-75 { flex: 0 0 75%; max-width: 75%; } .w-50 { width: 50% !important; } .widget-body .w-50:nth-of-type(even) .downloadFile-widget { margin-left: 12px; } .widget-body .w-50:nth-of-type(odd) .downloadFile-widget { margin-right: 12px; } } /* blockquote styles start*/ .blockquote { position:relative; margin:24px 0 32px; background: #fff; border-radius: 24px; border: 2px solid var(--blockquote-border); box-shadow: var(--shadow); } .blockquote-content * { font-family: Microtype; font-style: normal; font-weight: normal; font-size: 24px !important; line-height: 36px !important; text-align: left; } .blockquote a { color: var(--color); } .blockquote a:hover { color: var(--color-dark); } .blockquote-content { padding: 40px 0; } .blockquote-content strong * { font-family: Innerspace; font-style: normal; font-weight: bold; } .blockquote p, .blockquote ul, .blockquote ul { margin: 0; } .blockquote .left-arrow, .blockquote .right-arrow { line-height: 35px; font-size: 24px; height: 35px; width: 35px; } .blockquote .right-arrow { transform: rotate(180deg); } /* blockquote styles end*/ /* unordered list styles start */ .flow ul { list-style: none; } ul { padding-left: 1.5rem; padding-right: 2em; margin-top: 8px; } ul li { font-family: Microtype; font-style: normal; font-weight: normal; font-size: 16px; line-height: 24px; } ul li::marker { width: 8px; height: 8px; color: var(--color); font-size: 24px; } .field-name-paragraph-content ul li { list-style: disc; } /* unordered list styles end */ /* ordered list styles start */ ol { padding-left: 3.5rem; margin-top: 8px; } ol li { font-family: "Microtype"; font-size: 16px; line-height: 24px; margin: 0 0 0.5rem 0; position: relative; } ol li strong { font-family: "Microtype"; } ol li::marker { color: var(--color); font-style: normal; font-weight: bold; font-size: 24px; line-height: 27px; font-family: "Innerspace"; letter-spacing: 0.05em; text-transform: uppercase; } /* ordered list styles end */ .flow img { width: 100%; height: auto; } a.main-content-link { width: 170px; margin-left: 10px; outline: 2px solid white ; color: white !important; } a.main-content-link:not(:focus) { clip: rect(1px,1px,1px,1px); overflow: hidden; position: absolute; padding: 0; } /* More Info links */ p.more-info-link-title { font-family: Innerspace; font-size: 18px; font-style: normal; font-weight: bold; line-height: 22px; letter-spacing: 0.04em; text-align: left; text-transform: uppercase; } .more-info-links-block { border-radius: 7px; width: 100%; background: var(--tranparent-background); } .more-info-link-row { border-bottom: 1px solid var(--gray20); font-family: Microtype; font-size: 16px; font-style: normal; font-weight: 400; line-height: 24px; letter-spacing: 0em; text-align: left; } .more-info-link-icon { position: relative; float: right; width: 16px !important; height: 12px !important; content: var(--right-arrow); margin-bottom: 0; } a .materials_link_local, a .materials_link_external { content: var(--purple-more-info-link) !important; width: 14px !important; height: 14px !important; } a .materials_link_external { content: var(--purple-external-link) !important; } a.external-link::after { content: var(--external-link-icon); width: 14px; height: 14px; padding-left: 5px; } a.external-link:visited *::after { content: var(--external-link-icon-visited); } .more-info-link-row a.external-link::after, a#cardTastyAdventuresMap.external-link::after { display: none; } /* FAQ widget */ .faq { display: flex; justify-content: center; background-color: var(--mainpage-orange-bg); } .faq a { text-decoration: none; color: #000000; display: block; } .faq .question { font-size: 14px; line-height: 20px; } .faq .question:hover { text-decoration: underline; } @media (max-width: 767px) { .faq .card { min-height: 140px; min-width: 155px; } } .faq-card { padding: 16px; } @media (max-width: 767px) { .faq-icon { padding-bottom: 10px; } } .wide-topic-container a { text-decoration: none; } .questions_grid { margin-top: 55px; display: grid; grid-template-columns: repeat(4, 1fr); row-gap: 50px; column-gap: 32px; } @media (max-width: 575px ) { .questions_grid { grid-template-columns: 100%; row-gap: 28px; } } @media (max-width: 767px) { .questions_grid { grid-template-columns: repeat(2, 1fr); row-gap: 28px; } } @media (min-width: 576px ) and (max-width: 1199px ) { .questions_grid { grid-template-columns: repeat(2, 1fr); } } .faq-widget-theme-title { color: var(--gray60); font-size: 12px !important; line-height: 16px !important; font-weight: normal; padding-bottom: 8px; border-bottom: 2px solid #CCCCCC; font-family: 'Microtype'; } @media (max-width: 1200px) { .collapse:not(.show) { display: none; } } #icon-open { background-image: url("/Themes.Main/img/navbar_icon.svg"); } #icon-close { background-image: url("/Themes.Main/img/navbar_close_icon.svg"); } .hidden { display: none; } .navbar-light .navbar-toggler { border: none; } .navbar-collapse { border-radius: 8px; box-shadow: 0px 8px 16px 0px #9E9E9E40; z-index: 99991; } .navbar-nav ul li a { font-size: 15px; line-height: 15px; text-decoration: none; text-transform: none; } .navbar-nav h6 { font-family: Innerspace; font-size: 15px; font-style: normal; font-weight: 700; line-height: 25px; letter-spacing: 0.04em; } /* dropdown styles */ .navbar-collapse div li div a { color: black; } /* FAQ */ .faq-category:not(:last-of-type) { margin-bottom: 3rem; } @media (max-width: 575px) { .faq-category:not(:last-of-type){ margin-bottom: 24px; } } .faqThemeTitle { font-family: 'Microtype'; color: var(--gray70); position: relative; } .faqThemeTitle:after { position: absolute; content: ''; height: 2px; width: 100%; background-color: var(--color); left: 0; bottom: 0; } .FAQListPage h1 { margin-bottom: 28px; } .faqQuestionsBlock { border-bottom-style: solid; border-bottom-width: 2px; border-bottom-color: #000000; word-break: break-word; } @media (min-width: 576px) { .faqQuestionsBlock li:nth-of-type(odd) { padding-left: 0; padding-right: 30px; } .faqQuestionsBlock li:nth-of-type(even) { padding-right: 0; padding-left: 0; } } .faqQuestionsBlock a { text-decoration: none; color: #000000; font-family: 'Innerspace'; } .faqQuestionsBlock a:hover { text-decoration: underline; } .faq-question-title { font-size: 32px; } .faq-question-category { font-family: Microtype; color: var(--gray55); font-size: 12px; line-height: 16px; } .faq-question-answer *, .announce-content * { font-family: 'Microtype'; font-size: 16px; line-height: 24px; } .faq-question-subquestion { font-size: 14px !important; font-weight: 400 !important; line-height: 20px !important; } .related-issues h2 { margin: 0 4.5rem; } .related-issues-nav { border-radius: 8px; background-color: rgb(79, 64, 134, 0.1); font-size: 14px; line-height: 20px; } .related-issues-nav a:hover { text-decoration: underline; } .unstyled-link { color: #000000 !important; text-decoration: none; } .unstyled-links-section a { color: #000000 !important; text-decoration: none; } .hover-underline:hover { text-decoration: underline; } .field-name-image-media span { display: none; } .article-content .widget-size-50 { padding: 0; color: var(--gray80); } @media (min-width: 576px) { .article-content .widget-body .flow .widget-size-50:nth-child(2n) { padding-left: 15px; } .article-content .widget-body .flow .widget-size-33:nth-child(3n) { padding-left: 15px; } } .article-content .widget-body table { overflow-x: auto; display: block; } .article-content table { width: 100% !important; } .article-content td, .article-content td strong { font-family: Microtype; font-style: normal; font-weight: normal; font-size: 16px; line-height: 24px; color: var(--gray80); } .article-content td { border: 1px solid; width: fit-content; width: -moz-fit-content; } .article-content td strong { font-family: Innerspace; font-weight: bold; } .article-content td p { display: flex; margin-bottom: 0; } .article-content td p strong { margin-left: 18px; } .article-content td img { width: 32px !important; height: 32px !important; } /* Chapters and subChapters */ .wide-topic-header { font-family: Innerspace; font-size: 32px; font-style: normal; font-weight: 700; line-height: 50px; letter-spacing: 0.05em; text-align: left; text-transform: uppercase; margin-bottom: 24px; } .wide-topic-container { box-shadow: var(--card-shadow); border-radius: 8px; min-height: 134px; text-decoration: none; } .wide-topic-container:hover { box-shadow: var(--card-hover-shadow); } .wide-topic-container:hover .chapter-header { color: var(--gray80) !important; } .wide-topic-container a { text-decoration: none; } .wide-topic-container p, .short-topic-container p { color: var(--gray70); font-family: Microtype; } .wide-topic-icon-container { width: 84px; } .wide-topic-icon { height: 72px !important; width: 72px !important; margin-left: -10px; top: 1.5rem; position: relative; fill: var(--color); } .short-topic-container { box-shadow: var(--card-shadow); border-radius: 8px; height: fit-content; text-decoration: none; padding: 20px; margin-top: 24px; } .short-topic-container:hover { box-shadow: var(--card-hover-shadow); } .short-topic-container:hover .chapter-header { color: var(--gray80) !important; } .short-topic-container a { text-decoration: none; } .short-topic-icon { height: 48px !important; width: 54px !important; top: 50%; position: relative; fill: var(--color) } .chapter-list-container { margin: 24px 0; height: auto; font-family: Microtype; font-style: normal; font-weight: normal; font-size: 15px; line-height: 19px; } .chapter-list-container-link { font-size: 15px; line-height: 19px; } .chapter-list-container.primary-background { padding:16px; background: var(--gray03); margin-top: -16px; height: 100%; margin-right: 32px; } .chapter-list-container.primary-background ul li { font-size: 15px; line-height: 19px; } .chapter-list-container .row { padding-top: 18px; } .chapter-page-header { font-size: 24px; line-height: 30px; } .chapter-page-header a { text-decoration: none; color: black; font-family: Innerspace; font-style: normal; font-weight: bold; font-size: 24px; line-height: 30px; } .chapter-page-header:hover a { text-decoration: underline; color: var(--gray80); } .chapter-page-container:hover .chapter-page-header a::before { content: ""; position: absolute; top: 0; bottom: 0; left: 0; right: 0; } .chapter-page-container:hover p { color: var(--gray60); } .chapter-page-container { border-bottom: 1px solid var(--gray20); position: relative; } .chapter-page-container p { color: var(--gray70); font-family: Microtype; font-style: normal; font-weight: normal; font-size: 14px; line-height: 20px; margin-bottom: 8px; } .chapter-sub-header { color: var(--color); margin: 0; font-weight: bold; border-bottom: 4px solid var(--color); width: fit-content; } h2.chapter-sub-header { font-size: 16px !important; } .chapter-header, .custom-card-body .custom-card-header { font-family: Innerspace; font-size: 18px; font-style: normal; font-weight: 700; line-height: 22px; letter-spacing: 0.04em; text-align: left; text-transform: uppercase; color: black !important; } .custom-card-body .custom-card-text { font-family: 'Microtype'; font-size: 14px; line-height: 20px; } .chapter-header-line { border-bottom: 4px solid var(--color); margin-bottom: 4px; } .chapter-sub-header-line { border-bottom: 1px solid var(--gray20); } .chapter-header-mini-line { border-top: 4px solid var(--color); } .next-question { margin-left: 55px; } /* Pager */ .pager-section { display: flex; justify-content: center; } .pager-section .pager li { display: inline-block; font-size: 12px; line-height: 14px; color: var(--color); } .pager-section .pager li:not(.paging-spacer) { padding: 8px 12px; cursor: pointer; } .pager-section .pager li.paging-spacer { padding: 8px 0; cursor: default; } .pager-section .pager li.active { background-color: var(--color); color: white; } .pager-section .pager li:not(.active):not(.paging-spacer):hover { background-color: var(--custom-input-purple-background); } .pager-section .pager #first_page, .pager-section .pager #previous_page { transform: rotate(180deg); } .pager-section .pager #first_page img, .pager-section .pager #last_page img { width: 10.5px; height: 11px; } .pager-section .pager #first_page:not(.disabled) img, .pager-section .pager #last_page:not(.disabled) img { content: var(--page-last-icon); } .pager-section .pager #previous_page:not(.disabled) img, .pager-section .pager #next_page:not(.disabled) img { content: var(--page-next-icon); } .pager-section .pager #previous_page img, .pager-section .pager #next_page img { width: 5.5px; height: 11px; } @media (max-width: 500px) { .pager-section .pager { padding-left: 0; padding-right: 0; } .pager-section .pager li:not(.paging-spacer) { padding: 8px 10px; } .pager-section .pager li:not(.paging-spacer):first-child, .pager-section .pager li:not(.paging-spacer):last-child { padding: 8px 6px; } } /* Search*/ .search-form { margin-top: 20px; margin-bottom: 32px; padding: 13px; border: 1px solid var(--gray55); border-radius: 8px; background-color: white !important; } .search-form input[type=text] { width: 90%; font-family: Microtype; font-style: normal; font-weight: normal; font-size: 32px; line-height: 13px; color: #1A1A1A; position: relative; left: 0; outline: none; border: 0px solid #cdcdcd; border-color: rgba(0, 0, 0, .15); background-color: white !important; } @media (max-width: 400px) { .search-form input[type=text] { width: 85%; } } .search-form .btn-search { padding: 0px; color: var(--orange-theme-color); font-size: 24px; border: 0px solid var(--gray55); } .btn-search:focus { box-shadow: 0 0 0 0.25rem var(--orange-theme-color-dark); } .search-form .search-icon { content: var(--yellow-dark-search-icon); width: 32px; height: 32px; } .search-form button { padding-right: 16px; font-size: 24px; color: var(--orange-theme-color); padding: 0px; border: 0px solid var(--gray55); border-radius: 8px; float: right; padding-right: 16px; } .main-page-search { width: 75%; } .main-page-search .search-form { margin-top: 30px; } .main-page-search .search-form { padding: 14px 16px 10px 24px; border-radius: 8px; border: none; box-shadow: 0px 8px 16px rgba(0, 0, 0, 0.25); background-color: white !important; } .main-page-search .search-form input[type=text]::placeholder { color: var(--gray55); } .main-page-search .search-form input[type=text] { width: 90%; font-family: Microtype; font-style: normal; font-weight: normal; font-size: 16px; line-height: 24px; color: #1A1A1A; position: relative; left: 0; outline: none; border: 0px solid #cdcdcd; border-color: rgba(0, 0, 0, .15); background-color: white !important; } .main-page-search .search-form .search-icon { width: 24px; height: 24px; content: var(--purple-search-icon); margin-bottom: 4px; margin-right: 0 !important; } /* Search results */ .text-news-header a { /* H2 */ font-family: Innerspace; font-style: normal; font-weight: bold; font-size: 24px; line-height: 30px; /* identical to box height, or 125% */ letter-spacing: 0.04em; /* Main/Black */ color: #000000; /* Inside Auto Layout */ flex: none; order: 0; align-self: stretch; flex-grow: 0; margin: 8px 0px; text-decoration: none; } .text-news-txt-gray { /* Body 3 */ font-family: Microtype; font-style: normal; font-weight: normal; font-size: 12px; line-height: 16px; /* identical to box height, or 133% */ display: flex; align-items: center; /* Greys/Grey55 */ color: var(--gray55); margin-bottom: 4px; } .text-news-txt-body { /* Body 2 */ font-family: Microtype; font-style: normal; font-weight: normal; font-size: 14px; line-height: 20px; /* or 143% */ /* Greys/Grey70 */ color: var(--gray70); /* Inside Auto Layout */ order: 1; align-self: stretch; flex-grow: 0; margin: 8px 0px; } .search-result-item { display: flex; justify-content: space-between; padding-bottom: 16px; border-bottom: 1px solid #E6E6E6; margin-bottom: 0px; } .search-result-item p { color: var(--gray70); font-family: Microtype; font-style: normal; font-weight: normal; font-size: 14px; line-height: 20px; } .search-result-item img { width: 100%; } .search-result-item .search-img { margin-left: 16px; max-width: 260px; } @media (max-width: 768px) { .search-img-mobile { display: block; } .search-img-desktop { display: none; } } @media (min-width: 768px) { .search-img-mobile { display: none; } .search-img-desktop { display: block; } } .search-result-header { font-size: 24px; line-height: 30px; } .search-result-header a { text-decoration: none; color: black; font-family: Innerspace; font-style: normal; font-weight: bold; font-size: 24px; line-height: 30px; } .search-result-header:hover a { text-decoration: underline; color: var(--gray80); } .nav-link { /* String 29 */ font-family: Microtype; font-style: normal; font-weight: normal; font-size: 16px; line-height: 16px; letter-spacing: 0.05em; /* Greys/Grey40 */ color: var(--gray40); } .bbtm { /* Greys/Grey20 */ border-bottom: 1px solid #CCCCCC; } .search-results #container { width: 260px; } .search-results #container img { width: 100%; } .search-results .nav-tabs .nav-link { font-family: Microtype; font-style: normal; font-weight: normal; font-size: 16px; line-height: 16px; letter-spacing: 0.05em; /* Greys/Grey40 */ color: var(--gray55); } .search-results .nav-tabs .nav-item.show .nav-link, .nav-tabs .nav-link.active { font-family: Innerspace; font-style: normal; font-weight: bold; font-size: 16px; line-height: 18px; /* identical to box height */ letter-spacing: 0.05em; /* Main/Orange-Accessible */ color: var(--orange-theme-color); border-top:none; border-left: none; border-right: none; } .search-results .nav-tabs .nav-item.show .nav-link, .nav-tabs .nav-link.active div { border-bottom: 4px solid var(--orange-theme-color); } .search-results .text-news-txt-gray.news-date { margin-bottom: 16px !important; } .tab-content { margin-bottom: 200px; } /* End of search styles */ /* Article side widget */ p.article-topics-header { /* H4 */ font-family: Innerspace; font-style: normal; font-weight: bold; font-size: 14px; line-height: 18px; /* identical to box height, or 129% */ letter-spacing: 0.04em; text-transform: uppercase; /* Main/Black */ color: #000000; padding-bottom: 6px; border-bottom: solid 4px var(--color); } div.article-topics-container { background-color: var(--gray03) } li.article-topic a { color: var(--color); font-family: Microtype; font-style: normal; font-weight: normal; font-size: 13px; line-height: 20px; text-decoration-line: underline; } @media (min-width: 1200px) { .article-topics-container { position: absolute; right: -10px; top: 0; } } /* End article side widget */ .purple-theme-menu * { color: var(--purple-theme-color); } .green-theme-menu * { color: var(--green-theme-color); } .fuchsia-theme-menu * { color: var(--fuchsia-theme-color); } .blue-theme-menu * { color: var(--blue-theme-color); } #recomended-links-container{ min-width:100vw; } .recomended-links { background: #F4F5F7; left: 0; } .recomended-links-content{ bottom: 0; left: 0; right: 0; } .recomended-links-content a { border-radius: 8px; border: 1px solid var(--gray10); color: var(--gray70) !important; } .recomended-links-content a:hover { box-shadow: 0px 8px 16px rgba(102, 102, 102, 0.25); color: var(--gray60) !important; } .recomended-links-content a:hover .recomended-links-subheader { color: var(--gray80) !important; } .recomended-links * { font-family: Microtype; font-style: normal; font-weight: normal; font-size: 14px; line-height: 20px; } .recomended-links h4 { font-family: Innerspace; line-height: 18px !important; letter-spacing: 0.04em; text-transform: uppercase; font-style: normal !important; font-weight: bold !important; font-size: 14px !important; } .recomended-links .recomended-links-subheader { font-family: Innerspace; color: #000; } #navbarNav ul li ul { border-bottom: 1px solid #F2F2F2; } h1,.h1, h2,.h2, h3,.h3, h4,.h4 { font-weight: bold; } h1,.h1 { font-size: 32px !important; line-height: 50px !important; } h2,.h2 { font-size: 24px !important; line-height: 28px !important; } h3,.h3 { font-size: 18px !important; line-height: 22px !important; } h4,.h4 { font-size: 14px !important; line-height: 18px !important; } a.no-link, a.no-link:visited, a.no-link:hover, a.no-link:focus, a.no-link:active { text-decoration: none; color: #fff !important; } .highlited-menu-item { height: 40px; background: var(--gray03); display: flex; align-items: center; } @media (min-width: 576px) { .highlited-menu-item { height: 59px; } } .divider { border-bottom: 1px solid var(--gray10) ; } .widget-raw-html { padding: 0; } .widget-raw-html iframe { width: 100% !important; min-height: 500px !important; } .article-topic { margin-top: 12px; } p.chapter-date { font-family: Microtype; font-style: normal; font-weight: normal; font-size: 12px; line-height: 16px; color: var(--gray55); display: flex; align-items: center; } .searchResults .search-items > div { margin-top: 24px; } .searchResults .search-items.all-items > div { margin-top: 0px; } .searchResults .all-items .item-type { display: block; margin-top: 24px; margin-bottom: 0px; font-family: Microtype; font-style: normal; font-weight: normal; font-size: 12px; line-height: 16px; } .searchResults .news-item { padding-top: 0px; } .search-results .doc-title a, .searchResults .news-item .news-title a { text-decoration: none; color: black; font-family: Innerspace; font-style: normal; font-weight: bold; font-size: 24px; line-height: 30px; } .article { display: flex; justify-content: space-between; padding-bottom: 16px; border-bottom: 1px solid #E6E6E6; margin-bottom: 0px; } .article p { color: var(--gray70); font-family: Microtype; font-style: normal; font-weight: normal; font-size: 14px; line-height: 20px; } .article .article-img { margin-left: 16px; max-width: 260px; } .article .article-img img, .npa-list-item .techCard .article-img img { width: 100%; } .search-results .document { border-bottom: 1px solid #E6E6E6; padding-bottom: 16px; } .search-results .search-note { font-family: Microtype; font-style: normal; font-weight: normal; font-size: 12px; padding-bottom: 32px; } .search-results .doc-info-top { font-family: Microtype; font-style: normal; font-weight: normal; font-size: 12px; line-height: 12px; color: #aaaaaa; grid-column: 2; } .search-results .doc-title { color: black; grid-column: 2; } .search-results .doc-info-theme { font-family: Microtype; font-style: normal; font-size: 14px; line-height: 22px; color: rgb(102, 102, 102); grid-column: 2; } /* AnnouncePage */ .AnnouncePage .announceDate { background-color: var(--mainpage-orange-bg); padding: 30px; } .AnnouncePage .announceDay { font-size: 32px; line-height: 36px; } .AnnouncePage .announce-date { background: url('../icons/clock.svg') no-repeat center left; color: var(--gray55); font-size: 13px; font-weight: 400; padding-left: 20px; font-family: Microtype; font-style: normal; font-weight: normal; line-height: 20px; margin: 6px 0; } .AnnouncePage .announce-title-part { font-weight: 700; border-bottom: 1px solid #E6E6E6; margin-bottom: 24px; padding-bottom: 8px; } .AnnouncePage .announce-content { font-family: 'Microtype'; font-size: 16px; line-height: 24px; color: var(--gray80); } .announce-content img { max-width: 100%; } @media (max-width: 1199px) { .navbar-light .navbar-nav .nav-link { color: var(--gray80) !important; padding-left: 1rem; } } .ChapterPage, .AnnouncePage, .FAQListPage, .FAQPage { margin-bottom: 80px; } .nutrition-value-conatainer { margin-top: 24px; margin-bottom: 40px; } .nutrition-value-conatainer > .charts { padding-left: 40px; padding-right: 40px; } .single-chart { justify-content: space-around ; } .circular-chart { display: block; max-width: 80%; max-height: 250px; } .circle-bg { fill: #fff; stroke: #000; opacity: 0.2; stroke-width: .5px; } .circle { fill: none; stroke-width: 2; animation: progress 1s ease-out forwards; } @keyframes progress { 0% { stroke-dasharray: 0 100; } } .chart-text { fill: var(--gray80); font-family: Innerspace; font-style: normal; font-weight: bold; font-size: .3em; line-height: 30px; text-anchor: middle; } .chart-text-small { fill: var(--gray70); text-anchor: middle; font-family: Microtype; font-style: normal; font-weight: normal; font-size: .17em; line-height: 16px; } /* download widget */ .downloadFile-widget { background-image: url('/Themes.Main/icons/download-cyrcle-bg.svg'); background-repeat: no-repeat; background-position: 0 8px; background-color: var(--color); box-shadow: var(--card-shadow); border-radius: 8px; min-height: 98px; } .downloadFile-widget:hover { box-shadow: var(--card-hover-shadow); } .downloadFile-widget .icon-container { position: relative; width: 72px; } .downloadFile-widget img.icon { max-width: 42px; margin: 0; margin-left: 4px; } .downloadFile-widget img.icon-download { height: 29px; width: 29px; position: absolute; left: 33px; top: 31px; margin: 0; } .downloadFile-widget a, .downloadFile-widget span { font-family: 'Innerspace'; font-size: 18px; font-weight: bold; text-decoration: none; text-transform: uppercase; color: #fff; margin: 0 16px; } .downloadFile-widget a:visited { color: #fff !important; } .z-index-1 { z-index: 1; } .carousel-item { top: 0; bottom: 0; left: 0; right: 0; color: white; font-size: 24px; text-align: center; position: absolute; } .carousel { width: 100%; } .carousel-inner { position: relative; } .carousel-ratio-1-1 .carousel-inner { padding-bottom: 100%; } .carousel-ratio-16-9 .carousel-inner { padding-bottom: 56.25%; } .carousel-ratio-4-3 .carousel-inner { padding-bottom: 75%; } .carousel-ratio-3-2 .carousel-inner { padding-bottom: 66.66%; } .carousel-ratio-a4 .carousel-inner { padding-bottom: 141.43%; } .carousel-item img.carousel-img { width: auto; height: 100%; position: absolute; margin: auto; top: 0; left: 0; right: 0; bottom: 0; } .carousel-ratio-1-1 .carousel-item img.carousel-img, .carousel-ratio-a4 .carousel-item img.carousel-img { width: auto; height:auto; max-width: 100%; max-height: 100%; } button.carousel-download { background: none; color: inherit; border: none; padding: 0; font: inherit; cursor: pointer; outline: inherit; width: 100%; } .carousel-control-next { right: -15%; } .carousel-control-prev { left: -15%; } .carousel-indicators{ bottom: -23px; } @media (max-width: 991px) { .carousel-control-next { right: -7.5%; } .carousel-control-prev { left: -7.5%; } } @media (max-width: 575px) { .carousel-control-next { right: -5%; } .carousel-control-prev { left: -5%; } } .no-content { text-align: center; margin: 20px auto; width: 80%; } .no-content p { font-family: 'Innerspace'; font-weight: 700; font-size: 36px; line-height: 42px; text-align: center; color: var(--color); margin: 18px auto; } /* 404 page */ .page-not-found-container { text-align: center; margin: 20px auto; width: 80%; margin-bottom: 60px; } .page-not-found-container h1 { color: var(--color); font-size: 36px !important; font-family: 'Innerspace'; font-weight: 700; margin-bottom: 24px; } .page-not-found-container p { color: var(--gray80); font-size: 24px; font-family: 'Microtype'; font-weight: 400; line-height: 31px; margin: auto; } .page-not-found-container p.go-to { font-size: 16px; margin-top: 22px; } .page-not-found-container p.go-to a { color: var(--color); } .techCard { width: 100%; margin-left: 0px !important; margin-left: 0px !important; } .menus-list .article { width:100%; } .menus { margin-top: 40px; } .menus .select-selected { font-family: 'Microtype'; background-color: white; border-radius: 4px; padding: 7px 0 7px 10px; border: none; color: var(--color); } @media (min-width: 992px) { .mt-lg-n3 { margin-top: -1rem!important; } } .mb-32px { margin-bottom: 32px; } .mt-32px { margin-top: 32px; } @media (min-width: 1200px) { .card-xl-col { flex: 1 0 0% } } @media (min-width: 1200px) { .w-xl-auto { width: auto; } .g-xl-initial { --bs-gutter-x: initial; --bs-gutter-y: initial; } } /* new select */ .custom-select-new { border-bottom: 1px solid #9a9a9a; } select { width: 100%; font-size: 13px; line-height: 18px; text-align: left; border-radius: 0; border: none; background-color: rgba(196, 196, 196, 0.3); padding: 10px 16px; } article.content-item.taxonomy > header { display: none; } .mobile-search-type-dropdown { position: absolute; z-index: 1000; display: none; min-width: 10rem; padding: 0.5rem 0; margin: 0; font-size: 1rem; color: #212529; text-align: left; list-style: none; background-color: #fff; background-clip: padding-box; border: 1px solid rgba(0,0,0,.15); border-radius: 0.25rem; position: absolute; width: 14rem; box-shadow: 0px 8px 16px rgba(158, 158, 158, 0.25); border-radius: 8px; margin: 0px; } .mobile-search-type-dropdown.show { display: block; right: 0; } #mobile-search-news { top: 100%; } #mobile-search-npa { top: calc(100% + 48px); } #mobile-search-tech-cards { top: calc(100% + 96px); } #mobile-search-menu { top: calc(100% + 142px); } #mobile-search-faq { top: calc(100% + 188px); } @media (min-width: 576px) { #mobile-search-npa { top: 100%; } #mobile-search-tech-cards { top: calc(100% + 48px); } #mobile-search-menu { top: calc(100% + 96px); } #mobile-search-faq { top: calc(100% + 142px); } } @media (min-width: 768px) { #mobile-search-tech-cards{ top: 100%; } #mobile-search-menu { top: calc(100% + 48px); } #mobile-search-faq { top: calc(100% + 96px); } } #scroll-to-top-button { display: none; position: fixed; bottom: 15%; right: 5%; z-index: 99; font-size: 18px; border: 3px solid #fff; outline: none; background-color: var(--color); color: white; cursor: pointer; border-radius: 4px; width: 60px; height: 60px; } #scroll-to-top-button:focus { outline: 3px solid #000; } .scroll-to-top-arrow { display: flex; margin: auto; } /* Equipment calculator */ @media (max-width: 575px) { .cards-container { margin-bottom: 10px !important; } } .equipment-calculator-card { margin-bottom: 30px; min-height: 120px !important; } .equipment-calculator-button { background-image: url('/Themes.Main/icons/equipment-calculator-purple.svg'); background-color: #6b6092; background-size: cover; background-position: center; } .equipment-button-title { color: #ffffff !important; font-size: 18px; font-weight: 700; text-transform: uppercase } .equipment-button-text { color: #ffffff !important; } .calculate-button { background: #4F4086 !important; color: #ffffff; } .calculate-table { margin-top: 40px; } .calculate-table h2 { border-bottom: 1px solid #dee2e6; font-size: 18px; font-weight: 700; margin-bottom: 30px; padding-bottom: 10px; text-transform: uppercase; } .calculate-table h3 { background: rgba(76, 60, 124, 0.2); font-size: 16px !important; font-weight: 700; padding: 5px; margin-bottom: 10px; } .category-header { border-bottom: 1px solid #dee2e6 !important; color: #333333; font-size: 14px !important; font-weight: 700 !important; } @media (max-width: 575px) { .category-header { white-space: normal !important; } } .calculate-table td { border: none; font-size: 12px; padding-left: 0 !important; } @media (max-width: 575px) { .calculate-table table { table-layout: fixed; width: 100%; } .calculate-table td { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; } } .quantity-cell { color: #666666; text-align: end; white-space: nowrap; } .quantity-cell:empty::before { content: "*"; color: red; } @media (max-width: 575px) { #basicTable h2 { font-size: 20px !important; } } .card-category-items { display: grid; grid-template-columns: repeat(3, 1fr); grid-gap: 20px; justify-items: start; margin-bottom: 30px; margin-top: 10px; } @media (max-width: 575px) { .card-category-items { display: flex; height: 235px; flex-wrap: nowrap; flex-wrap: nowrap; margin-top: 0; overflow-x: scroll; overflow-y: hidden; -webkit-overflow-scrolling: touch; } } .equipment-card { border: 2px solid transparent; box-sizing: border-box; box-shadow: 0px 8px 16px rgba(88, 57, 136, 0.25); border-radius: 8px; display: flex; flex-direction: column; height: 200px !important; padding: 16px; width: 180px !important; } @media (max-width: 575px) { .equipment-card { margin: 15px 5px 10px 5px !important; min-width: 180px; } } .card-category-header { color: #333333; display: inline-block; font-size: 14px !important; font-weight: 700 !important; } .card-category-header-first { margin-top: 8px; } .card-category-header .category-title { background-color: transparent; } .card-quantity-cell { color: #666666; font-weight: 400; margin-bottom: 0; text-align: start; } .card-quantity-cell:empty::before { content: "*"; color: red; } .card-equipment-name { font-size: 12px; font-weight: 700; text-align: left; line-height: 16px; padding-top: 10px; } .card-equipment-name-dots { overflow: hidden; display: -webkit-box; text-overflow: ellipsis; -webkit-line-clamp: 2; -webkit-box-orient: vertical; word-wrap: break-word; } .card-equipment-img { height: 100px; width: 120px; } #results-view-buttons { display: none; } #results-view-buttons.show { align-items: end; display: flex; justify-content: flex-end; margin-bottom: -30px; } .view-button { border: 2px solid transparent; } .view-button-checked { border: 1px solid #4C3C7C; border-radius: 4px; padding: 2px; } .calculate-table #notification { display: none; } .calculate-table #notification.show { display: block; font-family: "Microtype"; font-size: 12px; margin-bottom: 30px; } .last-row { border-bottom: 1px solid #dee2e6 !important; } .special { font-weight: bold !important; color: #fff !important; background: #bc0000 !important; text-transform: uppercase; } .equipment-select-container select { border-bottom: none!important; border-radius: 4px !important; -webkit-appearance: none; -moz-appearance: none; } select.equipment-select { background-image: linear-gradient(45deg, transparent 50%, gray 50%), linear-gradient(135deg, gray 50%, transparent 50%); background-position: calc(100% - 20px) calc(1em + 2px), calc(100% - 15px) calc(1em + 2px); background-size: 5px 5px, 5px 5px; background-repeat: no-repeat; background-color: #EDEBF2 !important; } .equipment-select-option { background-color: #FFFFFF } /* Custom select */ /* browser select style */ select, .select-btn { width: 100%; font-size: 13px; line-height: 18px; text-align: left; border-radius: 0; border-bottom: 1px solid #9a9a9a; background-color: rgba(196, 196, 196, 0.3); } /*the container must be positioned relative:*/ .custom-select { position: relative; } .custom-select select { display: none; /*hide original SELECT element:*/ } /*style the arrow inside the select element:*/ .select-selected:after, .select-btn:after { position: absolute; content: ""; top: 14px; right: 10px; width: 0; height: 0; border: 6px solid transparent; border-color: var(--gray60) transparent transparent transparent; } /*point the arrow upwards when the select box is open (active):*/ .select-selected.select-arrow-active:after, .select-btn.show:after { border-color: transparent transparent var(--gray60) transparent; top: 8.5px; } /*style the items (options), including the selected item:*/ .select-items div, .select-selected, .custom-option, select option, .select-btn { color: black; padding: 8px 16px; border: 1px solid transparent; border-color: transparent transparent #c4c4c4 transparent; cursor: pointer; user-select: none; } .select-selected, .select-btn { position: relative; width: 100%; font-size: 13px; line-height: 18px; text-align: left; border-radius: 4px; border: 0; background-color: var(--custom-input-purple-background); white-space: normal; mix-blend-mode: normal; } /*style items (options):*/ .select-items, .custom-dropdown-menu { padding: 0 ; margin-top: -1px !important; width: calc(100% - 24px); background-color: white; position: absolute; box-shadow: 0px 7px 19px rgba(0, 0, 0, 0.11); border-radius: 10px; border-width: 0px; top: 100%; left: 0; right: 0; z-index: 99; } .dropdown-item.active, .dropdown-item:active { background-color: var(--gray70) !important; } .select-items div, select option, .custom-option { border: 0px; font-size: 14px; line-height: 21px; white-space: normal; } .select-items div:hover, select option:hover, .custom-option:hover { background-color: rgba(0, 0, 0, 0.04); } /*hide the items when the select box is closed:*/ .select-hide { display: none; } .same-as-selected { background-color: #f8f8f8; } /* End of custom select */ /* Equipment calculator */ .EquipmentCalculatorPage .spanDiv:after, .BmiCalculatorPage .spanDiv:after { content: ''; position: absolute; width: 0; height: 0; z-index: 99; right: 20px; border-left: 6px solid transparent; border-right: 6px solid transparent; border-top: 6px solid white; } .EquipmentCalculatorPage .dropdown-toggle.show .spanDiv:after, .BmiCalculatorPage .dropdown-toggle.show .spanDiv:after { border-top: none; border-left: 6px solid transparent; border-right: 6px solid transparent; border-bottom: 6px solid white; } .EquipmentCalculatorPage .spanDiv, .BmiCalculatorPage .spanDiv { margin-top: -6px; } .EquipmentCalculatorPage, .BmiCalculatorPage { border-top: 1px solid #e6e6e6; } .mp-results { display: none !important; } .kitchenButton { display: flex; flex-direction: column; border: 2px solid transparent; box-shadow: 0px 8px 16px rgba(88, 57, 136, 0.25); border-radius: 8px; padding: 1rem; cursor: pointer; } .kitchenButton.selected { border: 2px solid #4C3C7C; } .kitchenButton * { cursor: pointer; } .kitchenDescription, .radio-group-label, .EquipmentCalculatorPage p, .BmiCalculatorPage p, .branchDropdown label, .calculate-table td:not(.category-header) { font-family: "Microtype"; } .radio-custom-display { width: 14px; height: 14px; border-radius: 14px; top: 2px; left: -1px; position: relative; background-color: #FFF; content: ''; display: inline-block; visibility: visible; border: 2px solid #FFF; outline: 2px solid #CED2D6; } .kitchenButton.selected .radio-custom-display, .radio-custom-display.checked { background-color: var(--color); outline: 2px solid var(--color); } .EquipmentCalculatorPage .dropdown label, .BmiCalculatorPage .dropdown label { font-family: "Microtype"; font-size: 1rem; } .EquipmentCalculatorPage #downloadButtons .dropdown-toggle::after, .BmiCalculatorPage #downloadButtons .dropdown-toggle::after { display: none; } input[type="radio"].radio-custom-display { appearance: none; width: 14px; height: 14px; background-color: white; border-radius: 50%; position: relative; } input[type="radio"].radio-custom-display::after { content: ""; display: block; width: 10px; height: 10px; border-radius: 50%; position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%); background-color: #4c3c7c; opacity: 0; } input[type="radio"]:checked { background-color: #4c3c7c; } @media (max-width: 450px) { .EquipmentCalculatorPage .ghost-button, .BmiCalculatorPage .ghost-button { padding: 5px 15px; } } @media (max-width: 360px) { .EquipmentCalculatorPage .ghost-button, .BmiCalculatorPage .ghost-button { padding: 5px 10px; } } #downloadButtons .dropdown-item { white-space: initial; } #downloadButtons .downloadFile-widget span { margin: 0 30px; } .branch-remove-trash-icon{ max-height: 1rem; } .weight-height-container span, #results span, .error-message { font-family: "Microtype"; font-size: 12px; color: var(--gray80); } .radio-custom-display+label { font-family: "Microtype"; font-size: 13px; } .custom-styled-input { font-family: "Microtype"; background: var(--custom-input-purple-background); border-radius: 4px; position: relative; padding: 5px; outline: none; height: 32px; width: 100%; border: none; } .custom-styled-input.error { border: 1px solid #E8151D; } #results { display: none; background-color: #F9F9F9; } #results.show { display: block; } #score { font-size: 24px; color: var(--color); } .bmi-arrow-down { width: 0; height: 0; border-left: 17px solid transparent; border-right: 17px solid transparent; border-top: 20px solid var(--gray60);; } .error-message{ display: none; color: #E8151D !important; } .error-message.show{ display: block; } .bmi-calculator-button { background-image: url('/Themes.Main/icons/bmi-calculator-green.svg'); background-color: #4b8e76; background-size: cover; background-position: center; } #bmiTable th { text-align: center; padding-bottom: 5px; } #bmiTable td { font-size: 13px !important; font-weight: 400 !important; font-family: "Microtype"; } /* End of Equipment calculator */ .student-test-button { background-image: url('/Themes.Main/icons/student-test-fuchsia.svg'); background-color: #aa609c; background-size: cover; background-position: center; } .tasty-adventures-map-button { background-image: url('/Themes.Main/icons/tasty-adventures-map-fuchsia.svg'); background-color: #aa609c; background-size: cover; background-position: center; } .content-tags { margin-top: 8px; } .content-tags .tags-label { font-family: 'Microtype'; color: #737373; margin-right: 8px; } .content-tags .badge { color: var(--color); border: 1px solid var(--color); } .slick-prev:before, .slick-next:before{ color: black; } .slick-arrow{ color: black; font-size: 0; line-height: 0; position: absolute; top: 50%; display: block; width: 20px; } .slick-arrow:focus { outline: 2px black solid; border-radius: 8px; } .slick-dots button:focus{ outline: 2px black solid; border-radius: 8px; } .slick-arrow:before { content: ""; display:block; height:20px; width:20px; background-size: 20px 20px; background-repeat: no-repeat; } .slick-next:before{ background-image: var(--right-arrow); } .slick-prev:before { background-image: var(--right-arrow); transform: rotate(180deg); } .slick-dots li button:before { font-size: 30px; color: var(--color) !important; } .slick-dots li.slick-active button:before, .slick-prev:before, .slick-next:before { opacity: 1!important; } .slick-track { display: flex !important; } .slick-slide { height: inherit !important; } .slick-slide > div { display: flex; height: 100%; } .slick-dots li { margin: 0; width: 16px; } @media (min-width: 576px ) and (max-width: 991px ) { .slick-next { right: calc(-25px + 0.5rem); } .slick-prev { left: calc(-25px + 0.5rem); } } @media (max-width: 991px ) { .selected-article-item{ border-bottom: 2px solid var(--gray20); padding-left: 0; padding-right: 0; } } @media (min-width: 992px ) { .col-lg{ flex: 1 0 0%; } }