@charset "UTF-8";
@font-face {
  font-family: '72Condensed';
  src: url("fonts/72/72-Condensed.woff2") format("woff2"), url("fonts/72/72-Condensed.woff") format("woff"), url("fonts/72/72-Condensed.ttf") format("truetype");
  font-weight: normal;
  font-style: normal; }

@font-face {
  font-family: '72Condensed';
  src: url("fonts/72/72-CondensedBold.woff2") format("woff2"), url("fonts/72/72-CondensedBold.woff") format("woff"), url("fonts/72/72-CondensedBold.ttf") format("truetype");
  font-weight: 700;
  font-style: normal; }

@font-face {
  font-family: '72';
  src: url("fonts/72/72-Regular.woff2") format("woff2"), url("fonts/72/72-Regular.woff") format("woff"), url("fonts/72/72-Regular.ttf") format("truetype");
  font-weight: normal;
  font-style: normal; }

@font-face {
  font-family: '72';
  src: url("fonts/72/72-Italic.woff2") format("woff2"), url("fonts/72/72-Italic.woff") format("woff"), url("fonts/72/72-Italic.ttf") format("truetype");
  font-weight: normal;
  font-style: italic; }

@font-face {
  font-family: '72';
  src: url("fonts/72/72-Light.woff2") format("woff2"), url("fonts/72/72-Light.woff") format("woff"), url("fonts/72/72-Light.ttf") format("truetype");
  font-weight: 300;
  font-style: normal; }

@font-face {
  font-family: '72';
  src: url("fonts/72/72-Bold.woff2") format("woff2"), url("fonts/72/72-Bold.woff") format("woff"), url("fonts/72/72-Bold.ttf") format("truetype");
  font-weight: 700;
  font-style: normal; }

@font-face {
  font-family: '72';
  src: url("fonts/72/72-BoldItalic.woff2") format("woff2"), url("fonts/72/72-BoldItalic.woff") format("woff"), url("fonts/72/72-BoldItalic.ttf") format("truetype");
  font-weight: 700;
  font-style: italic; }

@font-face {
  font-family: "SAP-icons";
  src: url("SAP-icons.woff") format("woff");
  font-weight: normal;
  font-style: normal; }

/* data attributes for inserting icons
  <span data-sap-icon="\e001"> My Account</span>
*/
/* class per icon */
[class*="sap-icon"]::before {
  font-family: "SAP-icons";
  font-style: normal;
  font-weight: normal;
  text-align: center;
  display: inline-block;
  text-decoration: inherit;
  text-transform: none;
  text-rendering: optimizeLegibility;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
  speak: none; }

.sap-icon--s::before, .sap-icon--small::before {
  font-size: 0.85714rem;
  line-height: 1; }

.sap-icon--m::before, .sap-icon--medium::before {
  font-size: 1.14286rem;
  line-height: 1; }

.sap-icon--l::before, .sap-icon--large::before {
  font-size: 1.42857rem;
  line-height: 1; }

.sap-icon--xl::before, .sap-icon--xlarge::before {
  font-size: 1.71429rem;
  line-height: 1; }

.sap-icon--accidental-leave::before {
  content: ""; }

.sap-icon--account::before {
  content: ""; }

.sap-icon--wrench::before {
  content: ""; }

.sap-icon--windows-doors::before {
  content: ""; }

.sap-icon--washing-machine::before {
  content: ""; }

.sap-icon--visits::before {
  content: ""; }

.sap-icon--video::before {
  content: ""; }

.sap-icon--travel-expense::before {
  content: ""; }

.sap-icon--temperature::before {
  content: ""; }

.sap-icon--task::before {
  content: ""; }

.sap-icon--synchronize::before {
  content: ""; }

.sap-icon--survey::before {
  content: ""; }

.sap-icon--settings::before {
  content: ""; }

.sap-icon--search::before {
  content: ""; }

.sap-icon--sales-document::before {
  content: ""; }

.sap-icon--retail-store::before {
  content: ""; }

.sap-icon--refresh::before {
  content: ""; }

.sap-icon--product::before {
  content: ""; }

.sap-icon--present::before {
  content: ""; }

.sap-icon--ppt-attachment::before {
  content: ""; }

.sap-icon--pool::before {
  content: ""; }

.sap-icon--pie-chart::before {
  content: ""; }

.sap-icon--picture::before {
  content: ""; }

.sap-icon--photo-voltaic::before {
  content: ""; }

.sap-icon--phone::before {
  content: ""; }

.sap-icon--pending::before {
  content: ""; }

.sap-icon--pdf-attachment::before {
  content: ""; }

.sap-icon--past::before {
  content: ""; }

.sap-icon--outgoing-call::before {
  content: ""; }

.sap-icon--opportunity::before {
  content: ""; }

.sap-icon--opportunities::before {
  content: ""; }

.sap-icon--notes::before {
  content: ""; }

.sap-icon--money-bills::before {
  content: ""; }

.sap-icon--map::before {
  content: ""; }

.sap-icon--log::before {
  content: ""; }

.sap-icon--line-charts::before {
  content: ""; }

.sap-icon--lightbulb::before {
  content: ""; }

.sap-icon--leads::before {
  content: ""; }

.sap-icon--lead::before {
  content: ""; }

.sap-icon--laptop::before {
  content: ""; }

.sap-icon--kpi-managing-my-area::before {
  content: ""; }

.sap-icon--kpi-corporate-performance::before {
  content: ""; }

.sap-icon--incoming-call::before {
  content: ""; }

.sap-icon--inbox::before {
  content: ""; }

.sap-icon--horizontal-bar-chart::before {
  content: ""; }

.sap-icon--history::before {
  content: ""; }

.sap-icon--heating-cooling::before {
  content: ""; }

.sap-icon--gantt-bars::before {
  content: ""; }

.sap-icon--future::before {
  content: ""; }

.sap-icon--fridge::before {
  content: ""; }

.sap-icon--fallback::before {
  content: ""; }

.sap-icon--expense-report::before {
  content: ""; }

.sap-icon--excel-attachment::before {
  content: ""; }

.sap-icon--energy-saving-lightbulb::before {
  content: ""; }

.sap-icon--employee::before {
  content: ""; }

.sap-icon--email::before {
  content: ""; }

.sap-icon--edit::before {
  content: ""; }

.sap-icon--duplicate::before {
  content: ""; }

.sap-icon--download::before {
  content: ""; }

.sap-icon--doc-attachment::before {
  content: ""; }

.sap-icon--dishwasher::before {
  content: ""; }

.sap-icon--delete::before {
  content: ""; }

.sap-icon--decline::before {
  content: ""; }

.sap-icon--complete::before {
  content: ""; }

.sap-icon--competitor::before {
  content: ""; }

.sap-icon--collections-management::before {
  content: ""; }

.sap-icon--chalkboard::before {
  content: ""; }

.sap-icon--cart::before {
  content: ""; }

.sap-icon--card::before {
  content: ""; }

.sap-icon--camera::before {
  content: ""; }

.sap-icon--calendar::before {
  content: ""; }

.sap-icon--begin::before {
  content: ""; }

.sap-icon--basket::before {
  content: ""; }

.sap-icon--bar-chart::before {
  content: ""; }

.sap-icon--attachment::before {
  content: ""; }

.sap-icon--arrow-top::before {
  content: ""; }

.sap-icon--arrow-right::before {
  content: ""; }

.sap-icon--arrow-left::before {
  content: ""; }

.sap-icon--arrow-bottom::before {
  content: ""; }

.sap-icon--approvals::before {
  content: ""; }

.sap-icon--appointment::before {
  content: ""; }

.sap-icon--alphabetical-order::before {
  content: ""; }

.sap-icon--along-stacked-chart::before {
  content: ""; }

.sap-icon--alert::before {
  content: ""; }

.sap-icon--addresses::before {
  content: ""; }

.sap-icon--address-book::before {
  content: ""; }

.sap-icon--add-filter::before {
  content: ""; }

.sap-icon--add-favorite::before {
  content: ""; }

.sap-icon--add::before {
  content: ""; }

.sap-icon--activities::before {
  content: ""; }

.sap-icon--action::before {
  content: ""; }

.sap-icon--accept::before {
  content: ""; }

.sap-icon--hint::before {
  content: ""; }

.sap-icon--group::before {
  content: ""; }

.sap-icon--check-availability::before {
  content: ""; }

.sap-icon--weather-proofing::before {
  content: ""; }

.sap-icon--payment-approval::before {
  content: ""; }

.sap-icon--batch-payments::before {
  content: ""; }

.sap-icon--bed::before {
  content: ""; }

.sap-icon--arobase::before {
  content: ""; }

.sap-icon--family-care::before {
  content: ""; }

.sap-icon--favorite::before {
  content: ""; }

.sap-icon--navigation-right-arrow::before {
  content: ""; }

.sap-icon--navigation-left-arrow::before {
  content: ""; }

.sap-icon--e-care::before {
  content: ""; }

.sap-icon--less::before {
  content: ""; }

.sap-icon--lateness::before {
  content: ""; }

.sap-icon--lab::before {
  content: ""; }

.sap-icon--internet-browser::before {
  content: ""; }

.sap-icon--instance::before {
  content: ""; }

.sap-icon--inspection::before {
  content: ""; }

.sap-icon--image-viewer::before {
  content: ""; }

.sap-icon--home::before {
  content: ""; }

.sap-icon--grid::before {
  content: ""; }

.sap-icon--goalseek::before {
  content: ""; }

.sap-icon--general-leave-request::before {
  content: ""; }

.sap-icon--create-leave-request::before {
  content: ""; }

.sap-icon--flight::before {
  content: ""; }

.sap-icon--filter::before {
  content: ""; }

.sap-icon--favorite-list::before {
  content: ""; }

.sap-icon--factory::before {
  content: ""; }

.sap-icon--endoscopy::before {
  content: ""; }

.sap-icon--employee-pane::before {
  content: ""; }

.sap-icon--employee-approvals::before {
  content: ""; }

.sap-icon--email-read::before {
  content: ""; }

.sap-icon--electrocardiogram::before {
  content: ""; }

.sap-icon--documents::before {
  content: ""; }

.sap-icon--decision::before {
  content: ""; }

.sap-icon--database::before {
  content: ""; }

.sap-icon--customer-history::before {
  content: ""; }

.sap-icon--customer::before {
  content: ""; }

.sap-icon--credit-card::before {
  content: ""; }

.sap-icon--create-entry-time::before {
  content: ""; }

.sap-icon--contacts::before {
  content: ""; }

.sap-icon--compare::before {
  content: ""; }

.sap-icon--clinical-order::before {
  content: ""; }

.sap-icon--chain-link::before {
  content: ""; }

.sap-icon--pull-down::before {
  content: ""; }

.sap-icon--cargo-train::before {
  content: ""; }

.sap-icon--car-rental::before {
  content: ""; }

.sap-icon--business-card::before {
  content: ""; }

.sap-icon--bar-code::before {
  content: ""; }

.sap-icon--folder-blank::before {
  content: ""; }

.sap-icon--passenger-train::before {
  content: ""; }

.sap-icon--question-mark::before {
  content: ""; }

.sap-icon--world::before {
  content: ""; }

.sap-icon--iphone::before {
  content: ""; }

.sap-icon--ipad::before {
  content: ""; }

.sap-icon--warning::before {
  content: ""; }

.sap-icon--sort::before {
  content: ""; }

.sap-icon--course-book::before {
  content: ""; }

.sap-icon--course-program::before {
  content: ""; }

.sap-icon--add-coursebook::before {
  content: ""; }

.sap-icon--print::before {
  content: ""; }

.sap-icon--save::before {
  content: ""; }

.sap-icon--play::before {
  content: ""; }

.sap-icon--pause::before {
  content: ""; }

.sap-icon--record::before {
  content: ""; }

.sap-icon--response::before {
  content: ""; }

.sap-icon--pushpin-on::before {
  content: ""; }

.sap-icon--pushpin-off::before {
  content: ""; }

.sap-icon--unfavorite::before {
  content: ""; }

.sap-icon--learning-assistant::before {
  content: ""; }

.sap-icon--timesheet::before {
  content: ""; }

.sap-icon--time-entry-request::before {
  content: ""; }

.sap-icon--list::before {
  content: ""; }

.sap-icon--action-settings::before {
  content: ""; }

.sap-icon--share::before {
  content: ""; }

.sap-icon--feed::before {
  content: ""; }

.sap-icon--role::before {
  content: ""; }

.sap-icon--flag::before {
  content: ""; }

.sap-icon--post::before {
  content: ""; }

.sap-icon--inspect::before {
  content: ""; }

.sap-icon--inspect-down::before {
  content: ""; }

.sap-icon--appointment-2::before {
  content: ""; }

.sap-icon--target-group::before {
  content: ""; }

.sap-icon--marketing-campaign::before {
  content: ""; }

.sap-icon--message-error::before {
  content: ""; }

.sap-icon--comment::before {
  content: ""; }

.sap-icon--shipping-status::before {
  content: ""; }

.sap-icon--collaborate::before {
  content: ""; }

.sap-icon--shortcut::before {
  content: ""; }

.sap-icon--lead-outdated::before {
  content: ""; }

.sap-icon--tools-opportunity::before {
  content: ""; }

.sap-icon--permission::before {
  content: ""; }

.sap-icon--supplier::before {
  content: ""; }

.sap-icon--table-view::before {
  content: ""; }

.sap-icon--table-chart::before {
  content: ""; }

.sap-icon--switch-views::before {
  content: ""; }

.sap-icon--e-learning::before {
  content: ""; }

.sap-icon--manager::before {
  content: ""; }

.sap-icon--switch-classes::before {
  content: ""; }

.sap-icon--simple-payment::before {
  content: ""; }

.sap-icon--signature::before {
  content: ""; }

.sap-icon--sales-order-item::before {
  content: ""; }

.sap-icon--sales-order::before {
  content: ""; }

.sap-icon--request::before {
  content: ""; }

.sap-icon--receipt::before {
  content: ""; }

.sap-icon--puzzle::before {
  content: ""; }

.sap-icon--process::before {
  content: ""; }

.sap-icon--private::before {
  content: ""; }

.sap-icon--popup-window::before {
  content: ""; }

.sap-icon--person-placeholder::before {
  content: ""; }

.sap-icon--per-diem::before {
  content: ""; }

.sap-icon--paper-plane::before {
  content: ""; }

.sap-icon--paid-leave::before {
  content: ""; }

.sap-icon--pdf-reader::before {
  content: ""; }

.sap-icon--overview-chart::before {
  content: ""; }

.sap-icon--overlay::before {
  content: ""; }

.sap-icon--org-chart::before {
  content: ""; }

.sap-icon--number-sign::before {
  content: ""; }

.sap-icon--notification-2::before {
  content: ""; }

.sap-icon--my-sales-order::before {
  content: ""; }

.sap-icon--meal::before {
  content: ""; }

.sap-icon--loan::before {
  content: ""; }

.sap-icon--order-status::before {
  content: ""; }

.sap-icon--customer-order-entry::before {
  content: ""; }

.sap-icon--performance::before {
  content: ""; }

.sap-icon--menu::before {
  content: ""; }

.sap-icon--employee-lookup::before {
  content: ""; }

.sap-icon--education::before {
  content: ""; }

.sap-icon--customer-briefing::before {
  content: ""; }

.sap-icon--customer-and-contacts::before {
  content: ""; }

.sap-icon--my-view::before {
  content: ""; }

.sap-icon--accelerated::before {
  content: ""; }

.sap-icon--to-be-reviewed::before {
  content: ""; }

.sap-icon--warning2::before {
  content: ""; }

.sap-icon--feeder-arrow::before {
  content: ""; }

.sap-icon--quality-issue::before {
  content: ""; }

.sap-icon--workflow-tasks::before {
  content: ""; }

.sap-icon--create::before {
  content: ""; }

.sap-icon--home-share::before {
  content: ""; }

.sap-icon--globe::before {
  content: ""; }

.sap-icon--tags::before {
  content: ""; }

.sap-icon--work-history::before {
  content: ""; }

.sap-icon--x-ray::before {
  content: ""; }

.sap-icon--wounds-doc::before {
  content: ""; }

.sap-icon--web-cam::before {
  content: ""; }

.sap-icon--waiver::before {
  content: ""; }

.sap-icon--vertical-bar-chart::before {
  content: ""; }

.sap-icon--upstacked-chart::before {
  content: ""; }

.sap-icon--trip-report::before {
  content: ""; }

.sap-icon--microphone::before {
  content: ""; }

.sap-icon--unpaid-leave::before {
  content: ""; }

.sap-icon--tree::before {
  content: ""; }

.sap-icon--toaster-up::before {
  content: ""; }

.sap-icon--toaster-top::before {
  content: ""; }

.sap-icon--toaster-down::before {
  content: ""; }

.sap-icon--time-account::before {
  content: ""; }

.sap-icon--theater::before {
  content: ""; }

.sap-icon--taxi::before {
  content: ""; }

.sap-icon--subway-train::before {
  content: ""; }

.sap-icon--study-leave::before {
  content: ""; }

.sap-icon--stethoscope::before {
  content: ""; }

.sap-icon--step::before {
  content: ""; }

.sap-icon--sonography::before {
  content: ""; }

.sap-icon--soccor::before {
  content: ""; }

.sap-icon--physical-activity::before {
  content: ""; }

.sap-icon--pharmacy::before {
  content: ""; }

.sap-icon--official-service::before {
  content: ""; }

.sap-icon--offsite-work::before {
  content: ""; }

.sap-icon--nutrition-activity::before {
  content: ""; }

.sap-icon--newspaper::before {
  content: ""; }

.sap-icon--monitor-payments::before {
  content: ""; }

.sap-icon--map-2::before {
  content: ""; }

.sap-icon--machine::before {
  content: ""; }

.sap-icon--mri-scan::before {
  content: ""; }

.sap-icon--end-user-experience-monitoring::before {
  content: ""; }

.sap-icon--unwired::before {
  content: ""; }

.sap-icon--customer-financial-fact-sheet::before {
  content: ""; }

.sap-icon--retail-store-manager::before {
  content: ""; }

.sap-icon--Netweaver-business-client::before {
  content: ""; }

.sap-icon--electronic-medical-record::before {
  content: ""; }

.sap-icon--eam-work-order::before {
  content: ""; }

.sap-icon--customer-view::before {
  content: ""; }

.sap-icon--crm-service-manager::before {
  content: ""; }

.sap-icon--crm-sales::before {
  content: ""; }

.sap-icon--widgets::before {
  content: ""; }

.sap-icon--commission-check::before {
  content: ""; }

.sap-icon--collections-insight::before {
  content: ""; }

.sap-icon--clinical-tast-tracker::before {
  content: ""; }

.sap-icon--citizen-connect::before {
  content: ""; }

.sap-icon--cart-approval::before {
  content: ""; }

.sap-icon--capital-projects::before {
  content: ""; }

.sap-icon--bo-strategy-management::before {
  content: ""; }

.sap-icon--business-objects-mobile::before {
  content: ""; }

.sap-icon--business-objects-explorer::before {
  content: ""; }

.sap-icon--business-objects-experience::before {
  content: ""; }

.sap-icon--bbyd-dashboard::before {
  content: ""; }

.sap-icon--bbyd-active-sales::before {
  content: ""; }

.sap-icon--business-by-design::before {
  content: ""; }

.sap-icon--business-one::before {
  content: ""; }

.sap-icon--sap-box::before {
  content: ""; }

.sap-icon--manager-insight::before {
  content: ""; }

.sap-icon--accounting-document-verification::before {
  content: ""; }

.sap-icon--hr-approval::before {
  content: ""; }

.sap-icon--idea-wall::before {
  content: ""; }

.sap-icon--Chart-Tree-Map::before {
  content: ""; }

.sap-icon--cart-5::before {
  content: ""; }

.sap-icon--cart-4::before {
  content: ""; }

.sap-icon--wallet::before {
  content: ""; }

.sap-icon--vehicle-repair::before {
  content: ""; }

.sap-icon--upload::before {
  content: ""; }

.sap-icon--unlocked::before {
  content: ""; }

.sap-icon--umbrella::before {
  content: ""; }

.sap-icon--travel-request::before {
  content: ""; }

.sap-icon--travel-expense-report::before {
  content: ""; }

.sap-icon--travel-itinerary::before {
  content: ""; }

.sap-icon--time-overtime::before {
  content: ""; }

.sap-icon--thing-type::before {
  content: ""; }

.sap-icon--technical-object::before {
  content: ""; }

.sap-icon--tag::before {
  content: ""; }

.sap-icon--syringe::before {
  content: ""; }

.sap-icon--syntax::before {
  content: ""; }

.sap-icon--suitcase::before {
  content: ""; }

.sap-icon--simulate::before {
  content: ""; }

.sap-icon--shield::before {
  content: ""; }

.sap-icon--share-2::before {
  content: ""; }

.sap-icon--sales-quote::before {
  content: ""; }

.sap-icon--repost::before {
  content: ""; }

.sap-icon--provision::before {
  content: ""; }

.sap-icon--projector::before {
  content: ""; }

.sap-icon--add-product::before {
  content: ""; }

.sap-icon--pipeline-analysis::before {
  content: ""; }

.sap-icon--add-photo::before {
  content: ""; }

.sap-icon--palette::before {
  content: ""; }

.sap-icon--nurse::before {
  content: ""; }

.sap-icon--sales-notification::before {
  content: ""; }

.sap-icon--mileage::before {
  content: ""; }

.sap-icon--meeting-room::before {
  content: ""; }

.sap-icon--media-forward::before {
  content: ""; }

.sap-icon--media-play::before {
  content: ""; }

.sap-icon--media-pause::before {
  content: ""; }

.sap-icon--media-reverse::before {
  content: ""; }

.sap-icon--media-rewind::before {
  content: ""; }

.sap-icon--measurement-document::before {
  content: ""; }

.sap-icon--measuring-point::before {
  content: ""; }

.sap-icon--measure::before {
  content: ""; }

.sap-icon--map-3::before {
  content: ""; }

.sap-icon--locked::before {
  content: ""; }

.sap-icon--letter::before {
  content: ""; }

.sap-icon--journey-arrive::before {
  content: ""; }

.sap-icon--journey-change::before {
  content: ""; }

.sap-icon--journey-depart::before {
  content: ""; }

.sap-icon--it-system::before {
  content: ""; }

.sap-icon--it-instance::before {
  content: ""; }

.sap-icon--it-host::before {
  content: ""; }

.sap-icon--iphone-2::before {
  content: ""; }

.sap-icon--ipad-2::before {
  content: ""; }

.sap-icon--inventory::before {
  content: ""; }

.sap-icon--insurance-house::before {
  content: ""; }

.sap-icon--insurance-life::before {
  content: ""; }

.sap-icon--insurance-car::before {
  content: ""; }

.sap-icon--initiative::before {
  content: ""; }

.sap-icon--incident::before {
  content: ""; }

.sap-icon--group-2::before {
  content: ""; }

.sap-icon--goal::before {
  content: ""; }

.sap-icon--functional-location::before {
  content: ""; }

.sap-icon--full-screen::before {
  content: ""; }

.sap-icon--form::before {
  content: ""; }

.sap-icon--fob-watch::before {
  content: ""; }

.sap-icon--blank-tag::before {
  content: ""; }

.sap-icon--family-protection::before {
  content: ""; }

.sap-icon--folder::before {
  content: ""; }

.sap-icon--fax-machine::before {
  content: ""; }

.sap-icon--example::before {
  content: ""; }

.sap-icon--eraser::before {
  content: ""; }

.sap-icon--employee-rejections::before {
  content: ""; }

.sap-icon--drop-down-list::before {
  content: ""; }

.sap-icon--draw-rectangle::before {
  content: ""; }

.sap-icon--document::before {
  content: ""; }

.sap-icon--doctor::before {
  content: ""; }

.sap-icon--discussion-2::before {
  content: ""; }

.sap-icon--discussion::before {
  content: ""; }

.sap-icon--dimension::before {
  content: ""; }

.sap-icon--customer-and-supplier::before {
  content: ""; }

.sap-icon--crop::before {
  content: ""; }

.sap-icon--add-contact::before {
  content: ""; }

.sap-icon--compare-2::before {
  content: ""; }

.sap-icon--color-fill::before {
  content: ""; }

.sap-icon--collision::before {
  content: ""; }

.sap-icon--curriculum::before {
  content: ""; }

.sap-icon--chart-axis::before {
  content: ""; }

.sap-icon--full-stacked-chart::before {
  content: ""; }

.sap-icon--full-stacked-column-chart::before {
  content: ""; }

.sap-icon--vertical-bar-chart-2::before {
  content: ""; }

.sap-icon--horizontal-bar-chart-2::before {
  content: ""; }

.sap-icon--horizontal-stacked-chart::before {
  content: ""; }

.sap-icon--vertical-stacked-chart::before {
  content: ""; }

.sap-icon--choropleth-chart::before {
  content: ""; }

.sap-icon--geographic-bubble-chart::before {
  content: ""; }

.sap-icon--multiple-radar-chart::before {
  content: ""; }

.sap-icon--radar-chart::before {
  content: ""; }

.sap-icon--crossed-line-chart::before {
  content: ""; }

.sap-icon--multiple-line-chart::before {
  content: ""; }

.sap-icon--multiple-bar-chart::before {
  content: ""; }

.sap-icon--line-chart::before {
  content: ""; }

.sap-icon--line-chart-dual-axis::before {
  content: ""; }

.sap-icon--bubble-chart::before {
  content: ""; }

.sap-icon--scatter-chart::before {
  content: ""; }

.sap-icon--multiple-pie-chart::before {
  content: ""; }

.sap-icon--column-chart-dual-axis::before {
  content: ""; }

.sap-icon--tag-cloud-chart::before {
  content: ""; }

.sap-icon--area-chart::before {
  content: ""; }

.sap-icon--cause::before {
  content: ""; }

.sap-icon--cart-3::before {
  content: ""; }

.sap-icon--cart-2::before {
  content: ""; }

.sap-icon--bus-public-transport::before {
  content: ""; }

.sap-icon--burglary::before {
  content: ""; }

.sap-icon--building::before {
  content: ""; }

.sap-icon--border::before {
  content: ""; }

.sap-icon--bookmark::before {
  content: ""; }

.sap-icon--badge::before {
  content: ""; }

.sap-icon--attachment-audio::before {
  content: ""; }

.sap-icon--attachment-video::before {
  content: ""; }

.sap-icon--attachment-html::before {
  content: ""; }

.sap-icon--attachment-photo::before {
  content: ""; }

.sap-icon--attachment-e-pub::before {
  content: ""; }

.sap-icon--attachment-zip-file::before {
  content: ""; }

.sap-icon--attachment-text-file::before {
  content: ""; }

.sap-icon--add-equipment::before {
  content: ""; }

.sap-icon--add-activity::before {
  content: ""; }

.sap-icon--activity-individual::before {
  content: ""; }

.sap-icon--activity-2::before {
  content: ""; }

.sap-icon--add-activity-2::before {
  content: ""; }

.sap-icon--activity-items::before {
  content: ""; }

.sap-icon--activity-assigned-to-goal::before {
  content: ""; }

.sap-icon--status-positive::before {
  content: ""; }

.sap-icon--status-negative::before {
  content: ""; }

.sap-icon--status-inactive::before {
  content: ""; }

.sap-icon--status-critical::before {
  content: ""; }

.sap-icon--blank-tag-2::before {
  content: ""; }

.sap-icon--cart-full::before {
  content: ""; }

.sap-icon--locate-me::before {
  content: ""; }

.sap-icon--paging::before {
  content: ""; }

.sap-icon--company-view::before {
  content: ""; }

.sap-icon--document-text::before {
  content: ""; }

.sap-icon--explorer::before {
  content: ""; }

.sap-icon--personnel-view::before {
  content: ""; }

.sap-icon--sorting-ranking::before {
  content: ""; }

.sap-icon--drill-down::before {
  content: ""; }

.sap-icon--drill-up::before {
  content: ""; }

.sap-icon--vds-file::before {
  content: ""; }

.sap-icon--sap-logo-shape::before {
  content: ""; }

.sap-icon--folder-full::before {
  content: ""; }

.sap-icon--system-exit::before {
  content: ""; }

.sap-icon--system-exit-2::before {
  content: ""; }

.sap-icon--close-command-field::before {
  content: ""; }

.sap-icon--open-command-field::before {
  content: ""; }

.sap-icon--sys-enter-2::before {
  content: ""; }

.sap-icon--sys-enter::before {
  content: ""; }

.sap-icon--sys-help-2::before {
  content: ""; }

.sap-icon--sys-help::before {
  content: ""; }

.sap-icon--sys-back::before {
  content: ""; }

.sap-icon--sys-back-2::before {
  content: ""; }

.sap-icon--sys-cancel::before {
  content: ""; }

.sap-icon--sys-cancel-2::before {
  content: ""; }

.sap-icon--open-folder::before {
  content: ""; }

.sap-icon--sys-find-next::before {
  content: ""; }

.sap-icon--sys-find::before {
  content: ""; }

.sap-icon--sys-monitor::before {
  content: ""; }

.sap-icon--sys-prev-page::before {
  content: ""; }

.sap-icon--sys-first-page::before {
  content: ""; }

.sap-icon--sys-next-page::before {
  content: ""; }

.sap-icon--sys-last-page::before {
  content: ""; }

.sap-icon--generate-shortcut::before {
  content: ""; }

.sap-icon--create-session::before {
  content: ""; }

.sap-icon--display-more::before {
  content: ""; }

.sap-icon--enter-more::before {
  content: ""; }

.sap-icon--zoom-in::before {
  content: ""; }

.sap-icon--zoom-out::before {
  content: ""; }

.sap-icon--header::before {
  content: ""; }

.sap-icon--detail-view::before {
  content: ""; }

.sap-icon--collapse::before {
  content: ""; }

.sap-icon--expand::before {
  content: ""; }

.sap-icon--positive::before {
  content: ""; }

.sap-icon--negative::before {
  content: ""; }

.sap-icon--display::before {
  content: ""; }

.sap-icon--menu2::before {
  content: ""; }

.sap-icon--redo::before {
  content: ""; }

.sap-icon--undo::before {
  content: ""; }

.sap-icon--navigation-up-arrow::before {
  content: ""; }

.sap-icon--navigation-down-arrow::before {
  content: ""; }

.sap-icon--down::before {
  content: ""; }

.sap-icon--up::before {
  content: ""; }

.sap-icon--shelf::before {
  content: ""; }

.sap-icon--background::before {
  content: ""; }

.sap-icon--resize::before {
  content: ""; }

.sap-icon--move::before {
  content: ""; }

.sap-icon--show::before {
  content: ""; }

.sap-icon--hide::before {
  content: ""; }

.sap-icon--nav-back::before {
  content: ""; }

.sap-icon--error::before {
  content: ""; }

.sap-icon--slim-arrow-right::before {
  content: ""; }

.sap-icon--slim-arrow-left::before {
  content: ""; }

.sap-icon--slim-arrow-down::before {
  content: ""; }

.sap-icon--slim-arrow-up::before {
  content: ""; }

.sap-icon--forward::before {
  content: ""; }

.sap-icon--overflow::before {
  content: ""; }

.sap-icon--value-help::before {
  content: ""; }

.sap-icon--multiselect::before {
  content: ""; }

.sap-icon--exitfullscreen::before {
  content: ""; }

.sap-icon--sys-add::before {
  content: ""; }

.sap-icon--sys-minus::before {
  content: ""; }

.sap-icon--dropdown::before {
  content: ""; }

.sap-icon--expand-group::before {
  content: ""; }

.sap-icon--vertical-grip::before {
  content: ""; }

.sap-icon--horizontal-grip::before {
  content: ""; }

.sap-icon--sort-descending::before {
  content: ""; }

.sap-icon--sort-ascending::before {
  content: ""; }

.sap-icon--arrow-down::before {
  content: ""; }

.sap-icon--legend::before {
  content: ""; }

.sap-icon--collapse-group::before {
  content: ""; }

.sap-icon--message-warning::before {
  content: ""; }

.sap-icon--message-information::before {
  content: ""; }

.sap-icon--message-success::before {
  content: ""; }

.sap-icon--restart::before {
  content: ""; }

.sap-icon--stop::before {
  content: ""; }

.sap-icon--add-process::before {
  content: ""; }

.sap-icon--cancel-maintenance::before {
  content: ""; }

.sap-icon--activate::before {
  content: ""; }

.sap-icon--resize-horizontal::before {
  content: ""; }

.sap-icon--resize-vertical::before {
  content: ""; }

.sap-icon--connected::before {
  content: ""; }

.sap-icon--disconnected::before {
  content: ""; }

.sap-icon--edit-outside::before {
  content: ""; }

.sap-icon--key::before {
  content: ""; }

.sap-icon--minimize::before {
  content: ""; }

.sap-icon--back-to-top::before {
  content: ""; }

.sap-icon--hello-world::before {
  content: ""; }

.sap-icon--outbox::before {
  content: ""; }

.sap-icon--donut-chart::before {
  content: ""; }

.sap-icon--heatmap-chart::before {
  content: ""; }

.sap-icon--horizontal-bullet-chart::before {
  content: ""; }

.sap-icon--vertical-bullet-chart::before {
  content: ""; }

.sap-icon--call::before {
  content: ""; }

.sap-icon--download-from-cloud::before {
  content: ""; }

.sap-icon--upload-to-cloud::before {
  content: ""; }

.sap-icon--jam::before {
  content: ""; }

.sap-icon--sap-ui5::before {
  content: ""; }

.sap-icon--message-popup::before {
  content: ""; }

.sap-icon--cloud::before {
  content: ""; }

.sap-icon--horizontal-waterfall-chart::before {
  content: ""; }

.sap-icon--vertical-waterfall-chart::before {
  content: ""; }

.sap-icon--broken-link::before {
  content: ""; }

.sap-icon--headset::before {
  content: ""; }

.sap-icon--thumb-up::before {
  content: ""; }

.sap-icon--thumb-down::before {
  content: ""; }

.sap-icon--multiselect-all::before {
  content: ""; }

.sap-icon--multiselect-none::before {
  content: ""; }

.sap-icon--scissors::before {
  content: ""; }

.sap-icon--sound::before {
  content: ""; }

.sap-icon--sound-loud::before {
  content: ""; }

.sap-icon--sound-off::before {
  content: ""; }

.sap-icon--date-time::before {
  content: ""; }

.sap-icon--user-settings::before {
  content: ""; }

.sap-icon--key-user-settings::before {
  content: ""; }

.sap-icon--developer-settings::before {
  content: ""; }

.sap-icon--text-formatting::before {
  content: ""; }

.sap-icon--bold-text::before {
  content: ""; }

.sap-icon--italic-text::before {
  content: ""; }

.sap-icon--underline-text::before {
  content: ""; }

.sap-icon--text-align-justified::before {
  content: ""; }

.sap-icon--text-align-left::before {
  content: ""; }

.sap-icon--text-align-center::before {
  content: ""; }

.sap-icon--text-align-right::before {
  content: ""; }

.sap-icon--bullet-text::before {
  content: ""; }

.sap-icon--numbered-text::before {
  content: ""; }

.sap-icon--co::before {
  content: ""; }

.sap-icon--ui-notifications::before {
  content: ""; }

.sap-icon--bell::before {
  content: ""; }

.sap-icon--cancel-share::before {
  content: ""; }

.sap-icon--write-new-document::before {
  content: ""; }

.sap-icon--write-new::before {
  content: ""; }

.sap-icon--cancel::before {
  content: ""; }

.sap-icon--screen-split-one::before {
  content: ""; }

.sap-icon--screen-split-two::before {
  content: ""; }

.sap-icon--screen-split-three::before {
  content: ""; }

.sap-icon--customize::before {
  content: ""; }

.sap-icon--user-edit::before {
  content: ""; }

.sap-icon--source-code::before {
  content: ""; }

.sap-icon--copy::before {
  content: ""; }

.sap-icon--paste::before {
  content: ""; }

.sap-icon--line-chart-time-axis::before {
  content: ""; }

.sap-icon--clear-filter::before {
  content: ""; }

.sap-icon--reset::before {
  content: ""; }

.sap-icon--trend-up::before {
  content: ""; }

.sap-icon--trend-down::before {
  content: ""; }

.sap-icon--cursor::before {
  content: ""; }

.sap-icon--add-document::before {
  content: ""; }

.sap-icon--create-form::before {
  content: ""; }

.sap-icon--resize-corner::before {
  content: ""; }

.sap-icon--chevron-phase::before {
  content: ""; }

.sap-icon--chevron-phase-2::before {
  content: ""; }

.sap-icon--rhombus-milestone::before {
  content: ""; }

.sap-icon--rhombus-milestone-2::before {
  content: ""; }

.sap-icon--circle-task::before {
  content: ""; }

.sap-icon--circle-task-2::before {
  content: ""; }

.sap-icon--project-definition-triangle::before {
  content: ""; }

.sap-icon--project-definition-triangle-2::before {
  content: ""; }

.sap-icon--master-task-triangle::before {
  content: ""; }

.sap-icon--master-task-triangle-2::before {
  content: ""; }

.sap-icon--program-triangles::before {
  content: ""; }

.sap-icon--program-triangles-2::before {
  content: ""; }

.sap-icon--mirrored-task-circle::before {
  content: ""; }

.sap-icon--mirrored-task-circle-2::before {
  content: ""; }

.sap-icon--checklist-item::before {
  content: ""; }

.sap-icon--checklist-item-2::before {
  content: ""; }

.sap-icon--checklist::before {
  content: ""; }

.sap-icon--checklist-2::before {
  content: ""; }

.sap-icon--chart-table-view::before {
  content: ""; }

.sap-icon--filter-analytics::before {
  content: ""; }

.sap-icon--filter-facets::before {
  content: ""; }

.sap-icon--filter-fields::before {
  content: ""; }

.sap-icon--indent::before {
  content: ""; }

.sap-icon--outdent::before {
  content: ""; }

.sap-icon--heading-1::before {
  content: ""; }

.sap-icon--heading-2::before {
  content: ""; }

.sap-icon--heading-3::before {
  content: ""; }

.sap-icon--decrease-line-height::before {
  content: ""; }

.sap-icon--increase-line-height::before {
  content: ""; }

.sap-icon--animate-spin {
  display: inline-block;
  animation: sap-icon-spin 2s infinite linear; }

.sap-icon--animate-pulse {
  display: inline-block;
  animation: sap-icon-spin 2s infinite steps(8); }

@keyframes sap-icon-spin {
  0% {
    transform: rotate(0deg); }
  100% {
    transform: rotate(359deg); } }

:root {
  --fd-color-action-1: #0a6ed1;
  --fd-color-action-2: white;
  --fd-color-action-3: #0854a0;
  --fd-color-text-1: #32363a;
  --fd-color-text-2: #51555a;
  --fd-color-text-3: #6a6d70;
  --fd-color-text-4: #74777a;
  --fd-color-text-5: white;
  --fd-color-background-1: #edeff0;
  --fd-color-background-2: white;
  --fd-color-background-3: #f7f8f7;
  --fd-color-background-4: #fef7f1;
  --fd-color-background-5: #ffebeb;
  --fd-color-background-6: #fafafa;
  --fd-color-background-7: whitesmoke;
  --fd-color-neutral-1: #fafafa;
  --fd-color-neutral-2: #eeeeef;
  --fd-color-neutral-3: #d9d9d9;
  --fd-color-neutral-4: #89919a;
  --fd-color-neutral-5: #f7f7f7;
  --fd-color-neutral-6: #f2f2f2;
  --fd-color-status-1: #0a7e3e;
  --fd-color-status-2: #e9730c;
  --fd-color-status-3: #bb0000;
  --fd-color-status-4: #6a6d70;
  --fd-color-status-5: #0a6dd1;
  --fd-color-accent-1: #f5a742;
  --fd-color-accent-2: #d62929;
  --fd-color-accent-3: #db1f77;
  --fd-color-accent-4: #c0399f;
  --fd-color-accent-5: #6367de;
  --fd-color-accent-6: #1973cc;
  --fd-color-accent-7: #0cd7ed;
  --fd-color-accent-8: #7ca10c;
  --fd-color-accent-9: #925ace;
  --fd-color-accent-10: #5c819d;
  --fd-color-accent-11: #d17f15;
  --fd-color-accent-12: #d04343;
  --fd-color-accent-13: #2b78c5;
  --fd-color-accent-14: #6367de;
  --fd-color-accent-15: #984bd2;
  --fd-color-shell-1: #354a5f;
  --fd-color-shell-2: #d1e8ff;
  --fd-color-shell-3: #213b54;
  --fd-color-shell-4: #1b3046;
  --fd-color-shell-5: #7b9abc;
  --fd-color: var(--fd-color-text-1);
  --fd-background-color: var(--fd-color-background-1);
  --fd-color-background-hover: #fafafa;
  --fd-color-background-selected: rgba(10, 110, 209, 0.07);
  --fd-color-background-selected-hover: rgba(10, 110, 209, 0.1);
  --fd-color-background-information: #fafafa;
  --fd-color-background-positive: #f7f8f7;
  --fd-color-background-alert: #fef7f1;
  --fd-color-background-negative: #ffebeb;
  --fd-color-action: var(--fd-color-action-1);
  --fd-color-action-hover: #085caf;
  --fd-color-action-focus: #085caf;
  --fd-color-action-selected: #0254a7;
  --fd-color-action-disabled: rgba(10, 110, 209, 0.4);
  --fd-color-action-visited: #3c0ad1;
  --fd-color-positive: #0a7e3e;
  --fd-color-negative: #bb0000;
  --fd-color-alert: #e9730c;
  --fd-forms-color: #32363a;
  --fd-forms-border-color: #89919a;
  --fd-forms-background-color: white;
  --fd-forms-height: 36px;
  --fd-forms-height-compact: 28px;
  --fd-button-line-height: 34px;
  --fd-button-line-height-compact: 26px;
  --fd-padding-ui: 8px;
  --fd-width-gutter: 8px; }
  .fd-for-touch {
    --fd-forms-height-compact: 36px; }
  .fd-for-compact {
    --fd-forms-height-compact: 28px; }
  @media (min-width: 600px) {
    :root {
      --fd-forms-height-compact: 28px; } }
  @media (min-width: 600px) {
    :root {
      --fd-padding-ui: 32px;
      --fd-width-gutter: 16px; } }
  @media (min-width: 1440px) {
    :root {
      --fd-padding-ui: 48px; } }

/*!
* @section Root Element
* Default styles for root elements
*/
html {
  box-sizing: border-box;
  min-height: 100%; }

html,
body {
  font-size: 14px;
  font-family: '72', -apple-system, BlinkMacSystemFont, Segoe UI, Roboto, Helvetica Neue, Arial, sans-serif, Apple Color Emoji, Segoe UI Emoji, Segoe UI Symbol;
  line-height: 1.42857; }

* {
  box-sizing: inherit; }
  *::before, *::after {
    box-sizing: inherit; }

body {
  margin: 0;
  background-color: var(--fd-background-color);
  -webkit-font-smoothing: antialiased;
  color: var(--fd-color); }

/**
* @section Header Elements
* Default styles for header elements
*/
h1, h2, h3, h4, h5, h6 {
  text-rendering: optimizeLegibility;
  margin-bottom: 12px;
  margin-top: 0; }

/*!
* @section Block Elements
* Default styles for block elements
*/
p, ul, ol, blockquote, table, figure {
  margin-top: 0;
  margin-bottom: 12px; }
  p:last-child, ul:last-child, ol:last-child, blockquote:last-child, table:last-child, figure:last-child {
    margin-bottom: 0; }

/*!
* @section List Elements
* Default styles for lists
*/
ul, ol {
  padding: 0; }

/*!
* @section Phrases Elements
* Default styles for phrase elements
*/
img {
  line-height: 0;
  vertical-align: middle; }

a {
  text-decoration: none;
  display: inline-block;
  transition: all 0.125s ease-in;
  color: var(--fd-color-action); }
  a:hover,
  a .is-hover {
    color: var(--fd-color-action-hover); }
  a:active, a.is-active, a[aria-selected="true"], a.is-selected, a[aria-pressed="true"], a.is-pressed {
    color: var(--fd-color-action-selected);
    outline: none; }
  a:focus {
    outline-style: dotted;
    outline-width: 1px;
    outline-color: var(--fd-color-action-focus); }
  a[aria-disabled="true"], a.is-disabled, a:disabled {
    outline-color: var(--fd-color-action-disabled);
    cursor: not-allowed; }

pre,
code {
  font-family: monospace; }

/*!
* @section Button Elements
* Default styles for button elements
*/
button::-moz-focus-inner,
input[type="submit"]::-moz-focus-inner {
  border: 0;
  padding: 0; }

input[type=checkbox], input[type=radio],
.fd-checkbox,
.fd-radio {
  font-size: 14px;
  line-height: 1.42857;
  color: var(--fd-color-text-1);
  font-family: '72', -apple-system, BlinkMacSystemFont, Segoe UI, Roboto, Helvetica Neue, Arial, sans-serif, Apple Color Emoji, Segoe UI Emoji, Segoe UI Symbol;
  font-size: 1rem;
  line-height: 1.42857;
  font-weight: 400;
  appearance: none;
  -webkit-appearance: textfield;
  -moz-appearance: textfield;
  font-size: inherit;
  box-sizing: border-box;
  outline: none;
  border-style: solid;
  border-width: 1px;
  color: var(--fd-forms-color);
  border-color: var(--fd-forms-border-color);
  background-color: var(--fd-forms-background-color);
  border-radius: 4px;
  transition: border-color 0.125s;
  transition: border-color 0.125s ease-in, background-color 0.125s ease-in, background-image 0.125s ease-in; }
  input:hover[type=checkbox], input:hover[type=radio],
  .fd-checkbox:hover,
  .fd-radio:hover,
  input[type=checkbox] .is-hover,
  input[type=radio] .is-hover,
  .fd-checkbox .is-hover,
  .fd-radio .is-hover {
    --fd-forms-border-color: var(--fd-color-action-hover); }
  input:focus[type=checkbox], input:focus[type=radio],
  .fd-checkbox:focus,
  .fd-radio:focus, input.is-focus[type=checkbox], input.is-focus[type=radio],
  .is-focus.fd-checkbox,
  .is-focus.fd-radio {
    box-shadow: 0 0 0 1px var(--fd-color-action-focus);
    --fd-forms-border-color: var(--fd-color-action-focus); }
  input.is-invalid[type=checkbox], input.is-invalid[type=radio],
  .is-invalid.fd-checkbox,
  .is-invalid.fd-radio {
    --fd-forms-border-color: var(--fd-color-negative);
    border-width: 2px; }
  input.is-valid[type=checkbox], input.is-valid[type=radio],
  .is-valid.fd-checkbox,
  .is-valid.fd-radio {
    --fd-forms-border-color: var(--fd-color-positive);
    border-width: 2px; }
  input.is-warning[type=checkbox], input.is-warning[type=radio],
  .is-warning.fd-checkbox,
  .is-warning.fd-radio, input.is-alert[type=checkbox], input.is-alert[type=radio],
  .is-alert.fd-checkbox,
  .is-alert.fd-radio {
    --fd-forms-border-color: var(--fd-color-alert);
    border-width: 2px; }
  input[aria-disabled="true"][type=checkbox], input[aria-disabled="true"][type=radio],
  .fd-checkbox[aria-disabled="true"],
  .fd-radio[aria-disabled="true"], input.is-disabled[type=checkbox], input.is-disabled[type=radio],
  .is-disabled.fd-checkbox,
  .is-disabled.fd-radio, input:disabled[type=checkbox], input:disabled[type=radio],
  .fd-checkbox:disabled,
  .fd-radio:disabled {
    cursor: not-allowed;
    --fd-forms-color: var(--fd-color-text-3);
    --fd-forms-border-color: var(--fd-color-neutral-2);
    --fd-forms-background-color: var(--fd-color-neutral-1); }
  input[readonly][type=checkbox], input[readonly][type=radio],
  .fd-checkbox[readonly],
  .fd-radio[readonly], input.is-readonly[type=checkbox], input.is-readonly[type=radio],
  .is-readonly.fd-checkbox,
  .is-readonly.fd-radio {
    --fd-forms-color: var(--fd-forms-color);
    --fd-forms-border-color: var(--fd-color-neutral-2);
    border-width: 0 0 1px;
    border-radius: 0; }
  input[type=checkbox]::after, input[type=radio]::after,
  .fd-checkbox::after,
  .fd-radio::after {
    transition: border-color 0.125s ease-in; }

fieldset {
  border: 0;
  padding: 0;
  margin: 0; }

input[type=text], input[type=password], input[type=email], input[type=url], input[type=search], input[type=tel], input[type=number], input[type=date], input[type=time],
.fd-input {
  font-size: 14px;
  line-height: 1.42857;
  color: var(--fd-color-text-1);
  font-family: '72', -apple-system, BlinkMacSystemFont, Segoe UI, Roboto, Helvetica Neue, Arial, sans-serif, Apple Color Emoji, Segoe UI Emoji, Segoe UI Symbol;
  font-size: 1rem;
  line-height: 1.42857;
  font-weight: 400;
  appearance: none;
  -webkit-appearance: textfield;
  -moz-appearance: textfield;
  font-size: inherit;
  box-sizing: border-box;
  outline: none;
  border-style: solid;
  border-width: 1px;
  color: var(--fd-forms-color);
  border-color: var(--fd-forms-border-color);
  background-color: var(--fd-forms-background-color);
  border-radius: 4px;
  transition: border-color 0.125s;
  padding-left: 12px;
  padding-right: 12px;
  height: var(--fd-forms-height);
  width: 100%; }
  input[type=text]:hover,
  input[type=text] .is-hover, input[type=password]:hover,
  input[type=password] .is-hover, input[type=email]:hover,
  input[type=email] .is-hover, input[type=url]:hover,
  input[type=url] .is-hover, input[type=search]:hover,
  input[type=search] .is-hover, input[type=tel]:hover,
  input[type=tel] .is-hover, input[type=number]:hover,
  input[type=number] .is-hover, input[type=date]:hover,
  input[type=date] .is-hover, input[type=time]:hover,
  input[type=time] .is-hover,
  .fd-input:hover,
  .fd-input .is-hover {
    --fd-forms-border-color: var(--fd-color-action-hover); }
  input[type=text]:focus, input[type=text].is-focus, input[type=password]:focus, input[type=password].is-focus, input[type=email]:focus, input[type=email].is-focus, input[type=url]:focus, input[type=url].is-focus, input[type=search]:focus, input[type=search].is-focus, input[type=tel]:focus, input[type=tel].is-focus, input[type=number]:focus, input[type=number].is-focus, input[type=date]:focus, input[type=date].is-focus, input[type=time]:focus, input[type=time].is-focus,
  .fd-input:focus,
  .fd-input.is-focus {
    box-shadow: 0 0 0 1px var(--fd-color-action-focus);
    --fd-forms-border-color: var(--fd-color-action-focus); }
  input[type=text].is-invalid, input[type=password].is-invalid, input[type=email].is-invalid, input[type=url].is-invalid, input[type=search].is-invalid, input[type=tel].is-invalid, input[type=number].is-invalid, input[type=date].is-invalid, input[type=time].is-invalid,
  .fd-input.is-invalid {
    --fd-forms-border-color: var(--fd-color-negative);
    border-width: 2px; }
  input[type=text].is-valid, input[type=password].is-valid, input[type=email].is-valid, input[type=url].is-valid, input[type=search].is-valid, input[type=tel].is-valid, input[type=number].is-valid, input[type=date].is-valid, input[type=time].is-valid,
  .fd-input.is-valid {
    --fd-forms-border-color: var(--fd-color-positive);
    border-width: 2px; }
  input[type=text].is-warning, input[type=text].is-alert, input[type=password].is-warning, input[type=password].is-alert, input[type=email].is-warning, input[type=email].is-alert, input[type=url].is-warning, input[type=url].is-alert, input[type=search].is-warning, input[type=search].is-alert, input[type=tel].is-warning, input[type=tel].is-alert, input[type=number].is-warning, input[type=number].is-alert, input[type=date].is-warning, input[type=date].is-alert, input[type=time].is-warning, input[type=time].is-alert,
  .fd-input.is-warning,
  .fd-input.is-alert {
    --fd-forms-border-color: var(--fd-color-alert);
    border-width: 2px; }
  input[type=text][aria-disabled="true"], input[type=text].is-disabled, input[type=text]:disabled, input[type=password][aria-disabled="true"], input[type=password].is-disabled, input[type=password]:disabled, input[type=email][aria-disabled="true"], input[type=email].is-disabled, input[type=email]:disabled, input[type=url][aria-disabled="true"], input[type=url].is-disabled, input[type=url]:disabled, input[type=search][aria-disabled="true"], input[type=search].is-disabled, input[type=search]:disabled, input[type=tel][aria-disabled="true"], input[type=tel].is-disabled, input[type=tel]:disabled, input[type=number][aria-disabled="true"], input[type=number].is-disabled, input[type=number]:disabled, input[type=date][aria-disabled="true"], input[type=date].is-disabled, input[type=date]:disabled, input[type=time][aria-disabled="true"], input[type=time].is-disabled, input[type=time]:disabled,
  .fd-input[aria-disabled="true"],
  .fd-input.is-disabled,
  .fd-input:disabled {
    cursor: not-allowed;
    --fd-forms-color: var(--fd-color-text-3);
    --fd-forms-border-color: var(--fd-color-neutral-2);
    --fd-forms-background-color: var(--fd-color-neutral-1); }
  input[type=text][readonly], input[type=text].is-readonly, input[type=password][readonly], input[type=password].is-readonly, input[type=email][readonly], input[type=email].is-readonly, input[type=url][readonly], input[type=url].is-readonly, input[type=search][readonly], input[type=search].is-readonly, input[type=tel][readonly], input[type=tel].is-readonly, input[type=number][readonly], input[type=number].is-readonly, input[type=date][readonly], input[type=date].is-readonly, input[type=time][readonly], input[type=time].is-readonly,
  .fd-input[readonly],
  .fd-input.is-readonly {
    --fd-forms-color: var(--fd-forms-color);
    --fd-forms-border-color: var(--fd-color-neutral-2);
    border-width: 0 0 1px;
    border-radius: 0; }
  input[type=text]::placeholder, input[type=password]::placeholder, input[type=email]::placeholder, input[type=url]::placeholder, input[type=search]::placeholder, input[type=tel]::placeholder, input[type=number]::placeholder, input[type=date]::placeholder, input[type=time]::placeholder,
  .fd-input::placeholder {
    color: var(--fd-color-neutral-4); }

input.fd-input--compact {
  height: var(--fd-forms-height-compact); }

textarea,
.fd-textarea {
  font-size: 14px;
  line-height: 1.42857;
  color: var(--fd-color-text-1);
  font-family: '72', -apple-system, BlinkMacSystemFont, Segoe UI, Roboto, Helvetica Neue, Arial, sans-serif, Apple Color Emoji, Segoe UI Emoji, Segoe UI Symbol;
  font-size: 1rem;
  line-height: 1.42857;
  font-weight: 400;
  appearance: none;
  -webkit-appearance: textfield;
  -moz-appearance: textfield;
  font-size: inherit;
  box-sizing: border-box;
  outline: none;
  border-style: solid;
  border-width: 1px;
  color: var(--fd-forms-color);
  border-color: var(--fd-forms-border-color);
  background-color: var(--fd-forms-background-color);
  border-radius: 4px;
  transition: border-color 0.125s;
  padding-left: 12px;
  padding-right: 12px;
  width: 100%;
  height: calc(var(--fd-forms-height) * 2);
  padding-top: 12px; }
  textarea:hover,
  textarea .is-hover,
  .fd-textarea:hover,
  .fd-textarea .is-hover {
    --fd-forms-border-color: var(--fd-color-action-hover); }
  textarea:focus, textarea.is-focus,
  .fd-textarea:focus,
  .fd-textarea.is-focus {
    box-shadow: 0 0 0 1px var(--fd-color-action-focus);
    --fd-forms-border-color: var(--fd-color-action-focus); }
  textarea.is-invalid,
  .fd-textarea.is-invalid {
    --fd-forms-border-color: var(--fd-color-negative);
    border-width: 2px; }
  textarea.is-valid,
  .fd-textarea.is-valid {
    --fd-forms-border-color: var(--fd-color-positive);
    border-width: 2px; }
  textarea.is-warning, textarea.is-alert,
  .fd-textarea.is-warning,
  .fd-textarea.is-alert {
    --fd-forms-border-color: var(--fd-color-alert);
    border-width: 2px; }
  textarea[aria-disabled="true"], textarea.is-disabled, textarea:disabled,
  .fd-textarea[aria-disabled="true"],
  .fd-textarea.is-disabled,
  .fd-textarea:disabled {
    cursor: not-allowed;
    --fd-forms-color: var(--fd-color-text-3);
    --fd-forms-border-color: var(--fd-color-neutral-2);
    --fd-forms-background-color: var(--fd-color-neutral-1); }
  textarea[readonly], textarea.is-readonly,
  .fd-textarea[readonly],
  .fd-textarea.is-readonly {
    --fd-forms-color: var(--fd-forms-color);
    --fd-forms-border-color: var(--fd-color-neutral-2);
    border-width: 0 0 1px;
    border-radius: 0; }

.fd-textarea--compact {
  height: calc(var(--fd-forms-height-compact) * 2);
  padding-top: 12px; }

select,
.fd-select {
  font-size: 14px;
  line-height: 1.42857;
  color: var(--fd-color-text-1);
  font-family: '72', -apple-system, BlinkMacSystemFont, Segoe UI, Roboto, Helvetica Neue, Arial, sans-serif, Apple Color Emoji, Segoe UI Emoji, Segoe UI Symbol;
  font-size: 1rem;
  line-height: 1.42857;
  font-weight: 400;
  appearance: none;
  -webkit-appearance: textfield;
  -moz-appearance: textfield;
  font-size: inherit;
  box-sizing: border-box;
  outline: none;
  border-style: solid;
  border-width: 1px;
  color: var(--fd-forms-color);
  border-color: var(--fd-forms-border-color);
  background-color: var(--fd-forms-background-color);
  border-radius: 4px;
  transition: border-color 0.125s;
  padding-left: 12px;
  padding-right: 12px;
  appearance: none;
  -moz-appearance: none;
  background-image: url(data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iMzkiIGhlaWdodD0iMzYiIHZpZXdCb3g9IjAgMCAzOSAzNiIgeG1sbnM9Imh0dHA6Ly93d3cudzMub3JnLzIwMDAvc3ZnIj48ZyBmaWxsPSJub25lIiBmaWxsLXJ1bGU9ImV2ZW5vZGQiPjxwYXRoIGZpbGw9IiNGQUZCRkMiIGQ9Ik0xIDBoMzd2MzZIMXoiLz48cGF0aCBkPSJNMSAwdjM2TTM4IDB2MzYiIHN0cm9rZT0iI0NFQ0VEMCIvPjxwYXRoIGQ9Ik0yNi45MTkgMTYuODQzbC03LjY2NyA4LjA1OGEuMzY0LjM2NCAwIDAgMS0uMjUzLjA5OS4zNjQuMzY0IDAgMCAxLS4yNTItLjFsLTcuNjY0LTguMDU3YS4yODMuMjgzIDAgMCAxIC4wMzQtLjQyOGwxLjcyMS0xLjM0MWEuMzUyLjM1MiAwIDAgMSAuMjE4LS4wNzRsLjAyNS4wMDFjLjA4OC4wMDYuMTcuMDQ1LjIyOC4xMDdMMTkgMjEuMjAybDUuNjkzLTYuMDk0Yy4xMi0uMTMuMzMtLjE0NS40Ny0uMDM0bDEuNzIyIDEuMzQxYS4yOTcuMjk3IDAgMCAxIC4xMTUuMjA3LjI4My4yODMgMCAwIDEtLjA4LjIyMXoiIGZpbGw9IiMwQTZFRDEiLz48L2c+PC9zdmc+);
  background-repeat: no-repeat;
  background-position: calc(100% + 1px) center;
  padding-right: 48px;
  width: 100%;
  height: var(--fd-forms-height); }
  select:hover,
  select .is-hover,
  .fd-select:hover,
  .fd-select .is-hover {
    --fd-forms-border-color: var(--fd-color-action-hover); }
  select:focus, select.is-focus,
  .fd-select:focus,
  .fd-select.is-focus {
    box-shadow: 0 0 0 1px var(--fd-color-action-focus);
    --fd-forms-border-color: var(--fd-color-action-focus); }
  select.is-invalid,
  .fd-select.is-invalid {
    --fd-forms-border-color: var(--fd-color-negative);
    border-width: 2px; }
  select.is-valid,
  .fd-select.is-valid {
    --fd-forms-border-color: var(--fd-color-positive);
    border-width: 2px; }
  select.is-warning, select.is-alert,
  .fd-select.is-warning,
  .fd-select.is-alert {
    --fd-forms-border-color: var(--fd-color-alert);
    border-width: 2px; }
  select[aria-disabled="true"], select.is-disabled, select:disabled,
  .fd-select[aria-disabled="true"],
  .fd-select.is-disabled,
  .fd-select:disabled {
    cursor: not-allowed;
    --fd-forms-color: var(--fd-color-text-3);
    --fd-forms-border-color: var(--fd-color-neutral-2);
    --fd-forms-background-color: var(--fd-color-neutral-1); }
  select[readonly], select.is-readonly,
  .fd-select[readonly],
  .fd-select.is-readonly {
    --fd-forms-color: var(--fd-forms-color);
    --fd-forms-border-color: var(--fd-color-neutral-2);
    border-width: 0 0 1px;
    border-radius: 0; }
  [dir="rtl"] select, select[dir="rtl"], [dir="rtl"]
  .fd-select,
  .fd-select[dir="rtl"] {
    background-position: -1px center;
    padding-right: 12px;
    padding-left: 48px; }
  select:focus, select:hover,
  .fd-select:focus,
  .fd-select:hover {
    background-image: url(data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iMzkiIGhlaWdodD0iMzYiIHZpZXdCb3g9IjAgMCAzOSAzNiIgeG1sbnM9Imh0dHA6Ly93d3cudzMub3JnLzIwMDAvc3ZnIj48ZyBmaWxsPSJub25lIiBmaWxsLXJ1bGU9ImV2ZW5vZGQiPjxwYXRoIGZpbGw9IiNGQUZCRkMiIGQ9Ik0xIDBoMzd2MzZIMXoiLz48cGF0aCBkPSJNMSAwdjM2TTM4IDB2MzYiIHN0cm9rZT0iI0NFQ0VEMCIvPjxwYXRoIGQ9Ik0yNi45MTkgMTYuODQzbC03LjY2NyA4LjA1OGEuMzY0LjM2NCAwIDAgMS0uMjUzLjA5OS4zNjQuMzY0IDAgMCAxLS4yNTItLjFsLTcuNjY0LTguMDU3YS4yODMuMjgzIDAgMCAxIC4wMzQtLjQyOGwxLjcyMS0xLjM0MWEuMzUyLjM1MiAwIDAgMSAuMjE4LS4wNzRsLjAyNS4wMDFjLjA4OC4wMDYuMTcuMDQ1LjIyOC4xMDdMMTkgMjEuMjAybDUuNjkzLTYuMDk0Yy4xMi0uMTMuMzMtLjE0NS40Ny0uMDM0bDEuNzIyIDEuMzQxYS4yOTcuMjk3IDAgMCAxIC4xMTUuMjA3LjI4My4yODMgMCAwIDEtLjA4LjIyMXoiIGZpbGw9IiMwQTZFRDEiLz48L2c+PC9zdmc+); }
  select[aria-expanded="true"], select.is-expanded,
  .fd-select[aria-expanded="true"],
  .fd-select.is-expanded {
    background-image: url(data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iMzkiIGhlaWdodD0iMzYiIHZpZXdCb3g9IjAgMCAzOSAzNiIgeG1sbnM9Imh0dHA6Ly93d3cudzMub3JnLzIwMDAvc3ZnIj48ZyBmaWxsPSJub25lIiBmaWxsLXJ1bGU9ImV2ZW5vZGQiPjxwYXRoIGZpbGw9IiNGQUZCRkMiIGQ9Ik0xIDBoMzd2MzZIMXoiLz48cGF0aCBkPSJNMSAwdjM2TTM4IDB2MzYiIHN0cm9rZT0iI0NFQ0VEMCIvPjxwYXRoIGQ9Ik0yNi45MTkgMTYuODQzbC03LjY2NyA4LjA1OGEuMzY0LjM2NCAwIDAgMS0uMjUzLjA5OS4zNjQuMzY0IDAgMCAxLS4yNTItLjFsLTcuNjY0LTguMDU3YS4yODMuMjgzIDAgMCAxIC4wMzQtLjQyOGwxLjcyMS0xLjM0MWEuMzUyLjM1MiAwIDAgMSAuMjE4LS4wNzRsLjAyNS4wMDFjLjA4OC4wMDYuMTcuMDQ1LjIyOC4xMDdMMTkgMjEuMjAybDUuNjkzLTYuMDk0Yy4xMi0uMTMuMzMtLjE0NS40Ny0uMDM0bDEuNzIyIDEuMzQxYS4yOTcuMjk3IDAgMCAxIC4xMTUuMjA3LjI4My4yODMgMCAwIDEtLjA4LjIyMXoiIGZpbGw9IiMwQTZFRDEiLz48L2c+PC9zdmc+); }
  select[aria-disabled="true"], select.is-disabled, select:disabled,
  .fd-select[aria-disabled="true"],
  .fd-select.is-disabled,
  .fd-select:disabled {
    background-image: url(data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iMzkiIGhlaWdodD0iMzYiIHZpZXdCb3g9IjAgMCAzOSAzNiIgeG1sbnM9Imh0dHA6Ly93d3cudzMub3JnLzIwMDAvc3ZnIj48ZyBmaWxsPSJub25lIiBmaWxsLXJ1bGU9ImV2ZW5vZGQiPjxwYXRoIGZpbGw9IiNGQUZCRkMiIGQ9Ik0xIDBoMzd2MzZIMXoiLz48cGF0aCBkPSJNMSAwdjM2TTM4IDB2MzYiIHN0cm9rZT0iI0VCRUJFQyIvPjxwYXRoIGQ9Ik0yNi45MTkgMTYuODQzbC03LjY2NyA4LjA1OGEuMzY0LjM2NCAwIDAgMS0uMjUzLjA5OS4zNjQuMzY0IDAgMCAxLS4yNTItLjFsLTcuNjY0LTguMDU3YS4yODMuMjgzIDAgMCAxIC4wMzQtLjQyOGwxLjcyMS0xLjM0MWEuMzUyLjM1MiAwIDAgMSAuMjE4LS4wNzRsLjAyNS4wMDFjLjA4OC4wMDYuMTcuMDQ1LjIyOC4xMDdMMTkgMjEuMjAybDUuNjkzLTYuMDk0Yy4xMi0uMTMuMzMtLjE0NS40Ny0uMDM0bDEuNzIyIDEuMzQxYS4yOTcuMjk3IDAgMCAxIC4xMTUuMjA3LjI4My4yODMgMCAwIDEtLjA4LjIyMXoiIGZpbGw9IiNFQkVCRUMiLz48L2c+PC9zdmc+); }
  select::after,
  .fd-select::after {
    content: "";
    width: 10px;
    height: 5px;
    border-color: transparent;
    border-style: solid;
    border-width: 0 0 2px 2px;
    transform: rotate(-45deg);
    position: absolute;
    z-index: 2;
    top: calc(50% - 4px);
    left: calc(50% - 10px/2); }
  select[multiple],
  .fd-select[multiple] {
    height: calc(var(--fd-forms-height) * 3);
    background-image: none;
    padding-top: 12px; }

.fd-select--compact {
  height: var(--fd-forms-height-compact); }

[multiple].fd-select--compact {
  height: calc(var(--fd-forms-height-compact) * 3); }

@-moz-document url-prefix() {
  input[type=checkbox],
  .fd-checkbox {
    -moz-appearance: checkbox; }
  input[type=radio],
  .fd-radio {
    -moz-appearance: radio; } }

input[type=checkbox], input[type=radio],
.fd-checkbox,
.fd-radio {
  height: 16px;
  width: 16px;
  margin: 0;
  vertical-align: middle;
  position: relative;
  cursor: pointer; }
  input[type=checkbox]:hover,
  input[type=checkbox] .is-hover, input[type=radio]:hover,
  input[type=radio] .is-hover,
  .fd-checkbox:hover,
  .fd-checkbox .is-hover,
  .fd-radio:hover,
  .fd-radio .is-hover {
    border-width: 2px; }
    input[type=checkbox]:hover[aria-disabled="true"], input[type=checkbox]:hover.is-disabled, input[type=checkbox]:hover:disabled,
    input[type=checkbox] .is-hover[aria-disabled="true"],
    input[type=checkbox] .is-hover.is-disabled,
    input[type=checkbox] .is-hover:disabled, input[type=radio]:hover[aria-disabled="true"], input[type=radio]:hover.is-disabled, input[type=radio]:hover:disabled,
    input[type=radio] .is-hover[aria-disabled="true"],
    input[type=radio] .is-hover.is-disabled,
    input[type=radio] .is-hover:disabled,
    .fd-checkbox:hover[aria-disabled="true"],
    .fd-checkbox:hover.is-disabled,
    .fd-checkbox:hover:disabled,
    .fd-checkbox .is-hover[aria-disabled="true"],
    .fd-checkbox .is-hover.is-disabled,
    .fd-checkbox .is-hover:disabled,
    .fd-radio:hover[aria-disabled="true"],
    .fd-radio:hover.is-disabled,
    .fd-radio:hover:disabled,
    .fd-radio .is-hover[aria-disabled="true"],
    .fd-radio .is-hover.is-disabled,
    .fd-radio .is-hover:disabled {
      border-width: 1px; }
  input[type=checkbox]:checked, input[type=radio]:checked,
  .fd-checkbox:checked,
  .fd-radio:checked {
    --fd-forms-border-color: var(--fd-color-action-selected);
    --fd-forms-background-color: var(--fd-color-action-selected); }
    input[type=checkbox]:checked[aria-disabled="true"], input[type=checkbox]:checked.is-disabled, input[type=checkbox]:checked:disabled, input[type=radio]:checked[aria-disabled="true"], input[type=radio]:checked.is-disabled, input[type=radio]:checked:disabled,
    .fd-checkbox:checked[aria-disabled="true"],
    .fd-checkbox:checked.is-disabled,
    .fd-checkbox:checked:disabled,
    .fd-radio:checked[aria-disabled="true"],
    .fd-radio:checked.is-disabled,
    .fd-radio:checked:disabled {
      --fd-forms-border-color: var(--fd-color-action-disabled);
      --fd-forms-background-color: var(--fd-color-action-disabled); }
    input[type=checkbox]:checked:hover,
    input[type=checkbox]:checked .is-hover, input[type=radio]:checked:hover,
    input[type=radio]:checked .is-hover,
    .fd-checkbox:checked:hover,
    .fd-checkbox:checked .is-hover,
    .fd-radio:checked:hover,
    .fd-radio:checked .is-hover {
      border-width: 1px; }

input[type=radio],
.fd-radio {
  border-radius: 50%; }
  input[type="radio"]::after,
  .fd-radio::after {
    content: "";
    border-radius: 50%;
    width: 10px;
    height: 10px;
    position: absolute;
    top: calc(50% - (10px/2));
    left: calc(50% - (10px/2));
    transition: background-color 0.125s ease-in;
    background-color: transparent; }
  input[type="radio"]:checked,
  .fd-radio:checked {
    --fd-forms-background-color: var(--fd-forms-background-color); }
    input[type="radio"]:checked::after,
    .fd-radio:checked::after {
      --fd-forms-background-color: var(--fd-color-action-selected);
      background-color: var(--fd-forms-background-color); }
    input[type="radio"]:checked[aria-disabled="true"], input[type="radio"]:checked.is-disabled, input[type="radio"]:checked:disabled,
    .fd-radio:checked[aria-disabled="true"],
    .fd-radio:checked.is-disabled,
    .fd-radio:checked:disabled {
      --fd-forms-background-color: var(--fd-forms-background-color); }
      input[type="radio"]:checked[aria-disabled="true"]::after, input[type="radio"]:checked.is-disabled::after, input[type="radio"]:checked:disabled::after,
      .fd-radio:checked[aria-disabled="true"]::after,
      .fd-radio:checked.is-disabled::after,
      .fd-radio:checked:disabled::after {
        --fd-forms-background-color: var(--fd-color-action-disabled); }

input[type="checkbox"]::before,
.fd-checkbox::before {
  content: "";
  width: 10px;
  height: 5px;
  border-color: transparent;
  border-style: solid;
  border-width: 0 0 2px 2px;
  transform: rotate(-45deg);
  position: absolute;
  z-index: 2;
  top: calc(50% - 4px);
  left: calc(50% - 10px/2); }

input[type="checkbox"]:checked::before,
.fd-checkbox:checked::before {
  --fd-forms-border-color: var(--fd-color-action-2);
  border-color: var(--fd-forms-border-color); }

input[type="checkbox"]:indeterminate,
.fd-checkbox:indeterminate {
  --fd-forms-border-color: var(--fd-color-action-2);
  --fd-forms-background-color: var(--fd-color-action-selected);
  border-width: 3px;
  border-style: solid;
  box-shadow: 0 0 0 1px var(--fd-forms-background-color); }

/*!
.fd-section+(--full-bleed, --no-border)
    .fd-section__header
        .fd-section__title
        .fd-section__actions
    .fd-section__footer
*/
:root {
  --fd-section-background-color: transparent; }

.fd-section {
  --fd-section-padding-x: var(--fd-padding-ui);
  --fd-section-title-color: var(--fd-color-text-2);
  padding: 16px 32px 24px;
  padding: 16px var(--fd-section-padding-x) 24px;
  border-bottom: none;
  background-color: var(--fd-section-background-color, transparent); }
  .fd-section::after {
    content: "";
    display: table;
    clear: both; }
  .fd-section:last-child, .fd-section--no-border {
    border-bottom: 0; }
  .fd-section--full-bleed, .fd-section--bleed {
    padding-right: 0;
    padding-left: 0; }
    .fd-section--full-bleed .fd-section__header, .fd-section--full-bleed .fd-section__footer, .fd-section--bleed .fd-section__header, .fd-section--bleed .fd-section__footer {
      margin-left: 32px;
      margin-left: var(--fd-section-padding-x);
      margin-right: 32px;
      margin-right: var(--fd-section-padding-x); }
  .fd-section__header {
    min-height: 40px;
    display: flex;
    align-items: center;
    margin-bottom: 24px; }
  .fd-section__title {
    font-size: 1.71429rem;
    line-height: 1.33333;
    font-weight: 400;
    color: var(--fd-section-title-color);
    flex: 1;
    margin-bottom: 0; }
  .fd-section__actions {
    margin-left: auto; }
  .fd-section__footer {
    display: flex;
    justify-content: center; }

.fd-container {
  margin-bottom: 12px;
  max-width: 1290px; }
  .fd-container::after {
    content: "";
    display: table;
    clear: both; }
  .fd-container:last-child {
    margin-bottom: 0; }
  .fd-container--fluid {
    max-width: 100%; }
  .fd-container--flex {
    display: flex; }
  .fd-container--centered {
    margin-left: auto;
    margin-right: auto; }

/*
WHY THIS:
Other semantic grids don't eaily allow for fixed gutter widths
nor do they take advantage of the CSS calc function
and they can get kind of confusing.
This is meant for simple layout problems — 
i.e., you have a box and you need three cols inside of equal widths
with gutters between.

The FLOW terminology is meant to be netural outside of rows and columns
and comes from the HTML5 spec referring to elements that can contain other elements
http://w3c.github.io/html/dom.html#kinds-of-content-flow-content

USAGE:
— Outer containers should contain the `@include flow-box` base styles
— Columns get `@include flow` with `$span` and `$cols` params

EXAMPLE MARKUP:
<section>
  <div class="box">x</div>
  <div class="box">x</div>
  <div class="box">x</div>
  <div class="box">x</div>
</section>

EXAMPLE CSS:
section {
  @include flow-box()
  .box {
    @include flow(2);
    &:first-child {
      @include flow-shift(2);
    }
  }
}

OUTPUT:
This will render 4 boxes spanning 2 cols each indented 2 cols
(based on defaults)

|--| |--| |--| |--| |--| |--| |--| |--| |--| |--| |--| |--|
          |  box  | |  box  | |  box  | |  box  |

*/
/*!
    .fd-col+(--1...12, --shift-1...11)
*/
@media (min-width: 600px) {
  .fd-col--1 {
    float: left;
    margin-right: 8px;
    margin-right: var(--fd-width-gutter);
    width: calc( ( ( (100% - 88px) / 12 ) * 1 ) + 0px);
    width: calc( ( ( (100% - (11 * var(--fd-width-gutter))) / 12 ) * 1 ) + (var(--fd-width-gutter) * (1 - 1))); }
    .fd-col--1:last-child {
      margin-right: 0; }
    [dir="rtl"] .fd-col--1, .fd-col--1[dir="rtl"] {
      float: right;
      margin-right: 0;
      margin-left: 8px;
      margin-left: var(--fd-width-gutter); }
      [dir="rtl"] .fd-col--1:last-child, .fd-col--1[dir="rtl"]:last-child {
        margin-left: 0; }
  .fd-col--2 {
    float: left;
    margin-right: 8px;
    margin-right: var(--fd-width-gutter);
    width: calc( ( ( (100% - 88px) / 12 ) * 2 ) + 8px);
    width: calc( ( ( (100% - (11 * var(--fd-width-gutter))) / 12 ) * 2 ) + (var(--fd-width-gutter) * (2 - 1))); }
    .fd-col--2:last-child {
      margin-right: 0; }
    [dir="rtl"] .fd-col--2, .fd-col--2[dir="rtl"] {
      float: right;
      margin-right: 0;
      margin-left: 8px;
      margin-left: var(--fd-width-gutter); }
      [dir="rtl"] .fd-col--2:last-child, .fd-col--2[dir="rtl"]:last-child {
        margin-left: 0; }
  .fd-col--3 {
    float: left;
    margin-right: 8px;
    margin-right: var(--fd-width-gutter);
    width: calc( ( ( (100% - 88px) / 12 ) * 3 ) + 16px);
    width: calc( ( ( (100% - (11 * var(--fd-width-gutter))) / 12 ) * 3 ) + (var(--fd-width-gutter) * (3 - 1))); }
    .fd-col--3:last-child {
      margin-right: 0; }
    [dir="rtl"] .fd-col--3, .fd-col--3[dir="rtl"] {
      float: right;
      margin-right: 0;
      margin-left: 8px;
      margin-left: var(--fd-width-gutter); }
      [dir="rtl"] .fd-col--3:last-child, .fd-col--3[dir="rtl"]:last-child {
        margin-left: 0; }
  .fd-col--4 {
    float: left;
    margin-right: 8px;
    margin-right: var(--fd-width-gutter);
    width: calc( ( ( (100% - 88px) / 12 ) * 4 ) + 24px);
    width: calc( ( ( (100% - (11 * var(--fd-width-gutter))) / 12 ) * 4 ) + (var(--fd-width-gutter) * (4 - 1))); }
    .fd-col--4:last-child {
      margin-right: 0; }
    [dir="rtl"] .fd-col--4, .fd-col--4[dir="rtl"] {
      float: right;
      margin-right: 0;
      margin-left: 8px;
      margin-left: var(--fd-width-gutter); }
      [dir="rtl"] .fd-col--4:last-child, .fd-col--4[dir="rtl"]:last-child {
        margin-left: 0; }
  .fd-col--5 {
    float: left;
    margin-right: 8px;
    margin-right: var(--fd-width-gutter);
    width: calc( ( ( (100% - 88px) / 12 ) * 5 ) + 32px);
    width: calc( ( ( (100% - (11 * var(--fd-width-gutter))) / 12 ) * 5 ) + (var(--fd-width-gutter) * (5 - 1))); }
    .fd-col--5:last-child {
      margin-right: 0; }
    [dir="rtl"] .fd-col--5, .fd-col--5[dir="rtl"] {
      float: right;
      margin-right: 0;
      margin-left: 8px;
      margin-left: var(--fd-width-gutter); }
      [dir="rtl"] .fd-col--5:last-child, .fd-col--5[dir="rtl"]:last-child {
        margin-left: 0; }
  .fd-col--6 {
    float: left;
    margin-right: 8px;
    margin-right: var(--fd-width-gutter);
    width: calc( ( ( (100% - 88px) / 12 ) * 6 ) + 40px);
    width: calc( ( ( (100% - (11 * var(--fd-width-gutter))) / 12 ) * 6 ) + (var(--fd-width-gutter) * (6 - 1))); }
    .fd-col--6:last-child {
      margin-right: 0; }
    [dir="rtl"] .fd-col--6, .fd-col--6[dir="rtl"] {
      float: right;
      margin-right: 0;
      margin-left: 8px;
      margin-left: var(--fd-width-gutter); }
      [dir="rtl"] .fd-col--6:last-child, .fd-col--6[dir="rtl"]:last-child {
        margin-left: 0; }
  .fd-col--7 {
    float: left;
    margin-right: 8px;
    margin-right: var(--fd-width-gutter);
    width: calc( ( ( (100% - 88px) / 12 ) * 7 ) + 48px);
    width: calc( ( ( (100% - (11 * var(--fd-width-gutter))) / 12 ) * 7 ) + (var(--fd-width-gutter) * (7 - 1))); }
    .fd-col--7:last-child {
      margin-right: 0; }
    [dir="rtl"] .fd-col--7, .fd-col--7[dir="rtl"] {
      float: right;
      margin-right: 0;
      margin-left: 8px;
      margin-left: var(--fd-width-gutter); }
      [dir="rtl"] .fd-col--7:last-child, .fd-col--7[dir="rtl"]:last-child {
        margin-left: 0; }
  .fd-col--8 {
    float: left;
    margin-right: 8px;
    margin-right: var(--fd-width-gutter);
    width: calc( ( ( (100% - 88px) / 12 ) * 8 ) + 56px);
    width: calc( ( ( (100% - (11 * var(--fd-width-gutter))) / 12 ) * 8 ) + (var(--fd-width-gutter) * (8 - 1))); }
    .fd-col--8:last-child {
      margin-right: 0; }
    [dir="rtl"] .fd-col--8, .fd-col--8[dir="rtl"] {
      float: right;
      margin-right: 0;
      margin-left: 8px;
      margin-left: var(--fd-width-gutter); }
      [dir="rtl"] .fd-col--8:last-child, .fd-col--8[dir="rtl"]:last-child {
        margin-left: 0; }
  .fd-col--9 {
    float: left;
    margin-right: 8px;
    margin-right: var(--fd-width-gutter);
    width: calc( ( ( (100% - 88px) / 12 ) * 9 ) + 64px);
    width: calc( ( ( (100% - (11 * var(--fd-width-gutter))) / 12 ) * 9 ) + (var(--fd-width-gutter) * (9 - 1))); }
    .fd-col--9:last-child {
      margin-right: 0; }
    [dir="rtl"] .fd-col--9, .fd-col--9[dir="rtl"] {
      float: right;
      margin-right: 0;
      margin-left: 8px;
      margin-left: var(--fd-width-gutter); }
      [dir="rtl"] .fd-col--9:last-child, .fd-col--9[dir="rtl"]:last-child {
        margin-left: 0; }
  .fd-col--10 {
    float: left;
    margin-right: 8px;
    margin-right: var(--fd-width-gutter);
    width: calc( ( ( (100% - 88px) / 12 ) * 10 ) + 72px);
    width: calc( ( ( (100% - (11 * var(--fd-width-gutter))) / 12 ) * 10 ) + (var(--fd-width-gutter) * (10 - 1))); }
    .fd-col--10:last-child {
      margin-right: 0; }
    [dir="rtl"] .fd-col--10, .fd-col--10[dir="rtl"] {
      float: right;
      margin-right: 0;
      margin-left: 8px;
      margin-left: var(--fd-width-gutter); }
      [dir="rtl"] .fd-col--10:last-child, .fd-col--10[dir="rtl"]:last-child {
        margin-left: 0; }
  .fd-col--11 {
    float: left;
    margin-right: 8px;
    margin-right: var(--fd-width-gutter);
    width: calc( ( ( (100% - 88px) / 12 ) * 11 ) + 80px);
    width: calc( ( ( (100% - (11 * var(--fd-width-gutter))) / 12 ) * 11 ) + (var(--fd-width-gutter) * (11 - 1))); }
    .fd-col--11:last-child {
      margin-right: 0; }
    [dir="rtl"] .fd-col--11, .fd-col--11[dir="rtl"] {
      float: right;
      margin-right: 0;
      margin-left: 8px;
      margin-left: var(--fd-width-gutter); }
      [dir="rtl"] .fd-col--11:last-child, .fd-col--11[dir="rtl"]:last-child {
        margin-left: 0; }
  .fd-col--12 {
    float: left;
    margin-right: 8px;
    margin-right: var(--fd-width-gutter);
    width: calc( ( ( (100% - 88px) / 12 ) * 12 ) + 88px);
    width: calc( ( ( (100% - (11 * var(--fd-width-gutter))) / 12 ) * 12 ) + (var(--fd-width-gutter) * (12 - 1))); }
    .fd-col--12:last-child {
      margin-right: 0; }
    [dir="rtl"] .fd-col--12, .fd-col--12[dir="rtl"] {
      float: right;
      margin-right: 0;
      margin-left: 8px;
      margin-left: var(--fd-width-gutter); }
      [dir="rtl"] .fd-col--12:last-child, .fd-col--12[dir="rtl"]:last-child {
        margin-left: 0; }
  .fd-col--shift-1 {
    margin-left: calc( ( ( (100% - 88px) / 12 ) * 1 ) + 8px);
    margin-left: calc( ( ( (100% - (11 * var(--fd-width-gutter))) / 12 ) * 1 ) + (var(--fd-width-gutter) * (1))); }
    [dir="rtl"] .fd-col--shift-1, .fd-col--shift-1[dir="rtl"] {
      margin-left: 0;
      margin-right: calc( ( ( (100% - 88px) / 12 ) * 1 ) + 8px);
      margin-right: calc( ( ( (100% - (11 * var(--fd-width-gutter))) / 12 ) * 1 ) + (var(--fd-width-gutter) * (1))); }
  .fd-col--shift-2 {
    margin-left: calc( ( ( (100% - 88px) / 12 ) * 2 ) + 16px);
    margin-left: calc( ( ( (100% - (11 * var(--fd-width-gutter))) / 12 ) * 2 ) + (var(--fd-width-gutter) * (2))); }
    [dir="rtl"] .fd-col--shift-2, .fd-col--shift-2[dir="rtl"] {
      margin-left: 0;
      margin-right: calc( ( ( (100% - 88px) / 12 ) * 2 ) + 16px);
      margin-right: calc( ( ( (100% - (11 * var(--fd-width-gutter))) / 12 ) * 2 ) + (var(--fd-width-gutter) * (2))); }
  .fd-col--shift-3 {
    margin-left: calc( ( ( (100% - 88px) / 12 ) * 3 ) + 24px);
    margin-left: calc( ( ( (100% - (11 * var(--fd-width-gutter))) / 12 ) * 3 ) + (var(--fd-width-gutter) * (3))); }
    [dir="rtl"] .fd-col--shift-3, .fd-col--shift-3[dir="rtl"] {
      margin-left: 0;
      margin-right: calc( ( ( (100% - 88px) / 12 ) * 3 ) + 24px);
      margin-right: calc( ( ( (100% - (11 * var(--fd-width-gutter))) / 12 ) * 3 ) + (var(--fd-width-gutter) * (3))); }
  .fd-col--shift-4 {
    margin-left: calc( ( ( (100% - 88px) / 12 ) * 4 ) + 32px);
    margin-left: calc( ( ( (100% - (11 * var(--fd-width-gutter))) / 12 ) * 4 ) + (var(--fd-width-gutter) * (4))); }
    [dir="rtl"] .fd-col--shift-4, .fd-col--shift-4[dir="rtl"] {
      margin-left: 0;
      margin-right: calc( ( ( (100% - 88px) / 12 ) * 4 ) + 32px);
      margin-right: calc( ( ( (100% - (11 * var(--fd-width-gutter))) / 12 ) * 4 ) + (var(--fd-width-gutter) * (4))); }
  .fd-col--shift-5 {
    margin-left: calc( ( ( (100% - 88px) / 12 ) * 5 ) + 40px);
    margin-left: calc( ( ( (100% - (11 * var(--fd-width-gutter))) / 12 ) * 5 ) + (var(--fd-width-gutter) * (5))); }
    [dir="rtl"] .fd-col--shift-5, .fd-col--shift-5[dir="rtl"] {
      margin-left: 0;
      margin-right: calc( ( ( (100% - 88px) / 12 ) * 5 ) + 40px);
      margin-right: calc( ( ( (100% - (11 * var(--fd-width-gutter))) / 12 ) * 5 ) + (var(--fd-width-gutter) * (5))); }
  .fd-col--shift-6 {
    margin-left: calc( ( ( (100% - 88px) / 12 ) * 6 ) + 48px);
    margin-left: calc( ( ( (100% - (11 * var(--fd-width-gutter))) / 12 ) * 6 ) + (var(--fd-width-gutter) * (6))); }
    [dir="rtl"] .fd-col--shift-6, .fd-col--shift-6[dir="rtl"] {
      margin-left: 0;
      margin-right: calc( ( ( (100% - 88px) / 12 ) * 6 ) + 48px);
      margin-right: calc( ( ( (100% - (11 * var(--fd-width-gutter))) / 12 ) * 6 ) + (var(--fd-width-gutter) * (6))); }
  .fd-col--shift-7 {
    margin-left: calc( ( ( (100% - 88px) / 12 ) * 7 ) + 56px);
    margin-left: calc( ( ( (100% - (11 * var(--fd-width-gutter))) / 12 ) * 7 ) + (var(--fd-width-gutter) * (7))); }
    [dir="rtl"] .fd-col--shift-7, .fd-col--shift-7[dir="rtl"] {
      margin-left: 0;
      margin-right: calc( ( ( (100% - 88px) / 12 ) * 7 ) + 56px);
      margin-right: calc( ( ( (100% - (11 * var(--fd-width-gutter))) / 12 ) * 7 ) + (var(--fd-width-gutter) * (7))); }
  .fd-col--shift-8 {
    margin-left: calc( ( ( (100% - 88px) / 12 ) * 8 ) + 64px);
    margin-left: calc( ( ( (100% - (11 * var(--fd-width-gutter))) / 12 ) * 8 ) + (var(--fd-width-gutter) * (8))); }
    [dir="rtl"] .fd-col--shift-8, .fd-col--shift-8[dir="rtl"] {
      margin-left: 0;
      margin-right: calc( ( ( (100% - 88px) / 12 ) * 8 ) + 64px);
      margin-right: calc( ( ( (100% - (11 * var(--fd-width-gutter))) / 12 ) * 8 ) + (var(--fd-width-gutter) * (8))); }
  .fd-col--shift-9 {
    margin-left: calc( ( ( (100% - 88px) / 12 ) * 9 ) + 72px);
    margin-left: calc( ( ( (100% - (11 * var(--fd-width-gutter))) / 12 ) * 9 ) + (var(--fd-width-gutter) * (9))); }
    [dir="rtl"] .fd-col--shift-9, .fd-col--shift-9[dir="rtl"] {
      margin-left: 0;
      margin-right: calc( ( ( (100% - 88px) / 12 ) * 9 ) + 72px);
      margin-right: calc( ( ( (100% - (11 * var(--fd-width-gutter))) / 12 ) * 9 ) + (var(--fd-width-gutter) * (9))); }
  .fd-col--shift-10 {
    margin-left: calc( ( ( (100% - 88px) / 12 ) * 10 ) + 80px);
    margin-left: calc( ( ( (100% - (11 * var(--fd-width-gutter))) / 12 ) * 10 ) + (var(--fd-width-gutter) * (10))); }
    [dir="rtl"] .fd-col--shift-10, .fd-col--shift-10[dir="rtl"] {
      margin-left: 0;
      margin-right: calc( ( ( (100% - 88px) / 12 ) * 10 ) + 80px);
      margin-right: calc( ( ( (100% - (11 * var(--fd-width-gutter))) / 12 ) * 10 ) + (var(--fd-width-gutter) * (10))); }
  .fd-col--shift-11 {
    margin-left: calc( ( ( (100% - 88px) / 12 ) * 11 ) + 88px);
    margin-left: calc( ( ( (100% - (11 * var(--fd-width-gutter))) / 12 ) * 11 ) + (var(--fd-width-gutter) * (11))); }
    [dir="rtl"] .fd-col--shift-11, .fd-col--shift-11[dir="rtl"] {
      margin-left: 0;
      margin-right: calc( ( ( (100% - 88px) / 12 ) * 11 ) + 88px);
      margin-right: calc( ( ( (100% - (11 * var(--fd-width-gutter))) / 12 ) * 11 ) + (var(--fd-width-gutter) * (11))); } }

[class^="fd-col"] {
  flex: 1;
  margin-bottom: 12px; }
  [class^="fd-col"]:last-child {
    margin-bottom: 0; }
  @media (min-width: 320px) {
    [class^="fd-col"] {
      margin-bottom: 0; } }

/*!
.fd-ui+(--fixed)
    .fd-ui__header+(--fixed)
    .fd-ui__app
    .fd-ui__footer+(--fixed)
    .fd-ui__overlay
*/
.fd-ui {
  position: absolute;
  min-height: 100vh;
  width: 100vw;
  max-width: 100%;
  background: none;
  background-size: cover;
  background-attachment: fixed; }
  .fd-ui--fixed {
    display: flex;
    flex-direction: column;
    max-height: 100vh; }
    .fd-ui--fixed .fd-ui__header {
      flex: 0 0 50px;
      position: static; }
    .fd-ui--fixed .fd-ui__footer {
      flex: 0 0 40px;
      position: static; }
    .fd-ui--fixed .fd-ui__app {
      overflow: scroll;
      margin-top: 0;
      flex: 1;
      min-height: auto; }
  .fd-ui__header {
    position: absolute;
    z-index: 1;
    background: white;
    width: 100%;
    min-height: 50px;
    height: 50px;
    border-bottom: solid 1px #d9d9d9; }
    .fd-ui__header--fixed {
      position: fixed; }
  .fd-ui__footer {
    background: white;
    width: 100%;
    min-height: 40px;
    height: 40px;
    border-top: solid 1px #d9d9d9; }
    .fd-ui__footer--fixed {
      position: fixed;
      bottom: 0; }
  .fd-ui__app {
    margin-top: 50px;
    min-height: calc(100vh - 40px - 50px);
    width: 100%;
    display: flex;
    position: relative; }
  .fd-ui__overlay {
    position: absolute; }

/*!
.fd-shell+(--fixed)
    .fd-shell__header+(--fixed)
    .fd-shell__app
    .fd-shell__footer+(--fixed)
    .fd-shell__overlay
*/
.fd-shell {
  position: absolute;
  min-height: 100vh;
  height: 100vh;
  width: 100vw;
  max-width: 100%;
  background-size: cover;
  background-attachment: fixed; }
  .fd-shell--fixed {
    display: flex;
    flex-direction: column;
    max-height: 100vh; }
    .fd-shell--fixed .fd-shell__header {
      flex: 0 0 48px;
      position: static; }
    .fd-shell--fixed .fd-shell__footer {
      flex: 0 0 40px;
      position: static; }
    .fd-shell--fixed .fd-shell__app {
      overflow: scroll;
      margin-top: 0;
      flex: 1;
      min-height: auto; }
  .fd-shell__header {
    background-color: var(--fd-color-shell-1);
    position: absolute;
    z-index: 1;
    width: 100%;
    height: 48px; }
    .fd-shell__header--fixed {
      position: fixed; }
  .fd-shell__footer {
    width: 100%;
    min-height: 40px; }
  .fd-shell__app {
    margin-top: 48px;
    min-height: calc(100vh - 40px - 48px);
    width: 100%;
    display: flex;
    position: relative; }
  .fd-shell__overlay {
    position: absolute; }

/*!
.fd-app
  .fd-app__navigation+(--horizontal|--vertical)
  .fd-app__sidebar
  .fd-app__main
*/
.fd-app {
  position: relative;
  width: 100%; }
  @media (min-width: 600px) {
    .fd-app {
      display: flex;
      flex-flow: row wrap;
      align-content: flex-start; } }
  .fd-app__navigation {
    --fd-background-color: var(--fd-color-background-2);
    background-color: var(--fd-background-color);
    height: 52px;
    max-height: 52px;
    display: flex; }
    .fd-app__navigation--horizontal {
      flex: 1 100%;
      padding: 0 32px;
      padding: 0 var(--fd-padding-ui); }
    .fd-app__navigation--vertical {
      flex: 0; }
      @media (min-width: 600px) {
        .fd-app__navigation--vertical {
          max-width: 250px;
          position: relative;
          height: 100%;
          max-height: inherit; } }
  .fd-app__main {
    flex: 1 1;
    overflow: auto; }

.fd-page {
  --fd-page-background-color: transparent;
  --fd-page-header-padding-x: var(--fd-padding-ui);
  --fd-page-header-border-color: var(--fd-color-neutral-3);
  --fd-page-header-background-color: transparent;
  display: flex;
  flex-direction: column;
  min-height: 100%;
  width: 100%;
  background-color: var(--fd-page-background-color); }
  .fd-page__header {
    border-style: solid;
    border-width: 0;
    border-color: var(--fd-page-header-border-color);
    background-color: var(--fd-page-header-background-color);
    min-height: auto;
    padding: 0 32px;
    padding: 0 var(--fd-page-header-padding-x); }
  .fd-page__content {
    flex-grow: 1;
    margin-bottom: 32px; }

/*!
.fd-section+(--full-bleed, --no-border)
    .fd-section__header
        .fd-section__title
        .fd-section__actions
    .fd-section__footer
*/
:root {
  --fd-section-background-color: transparent; }

.fd-section {
  --fd-section-padding-x: var(--fd-padding-ui);
  --fd-section-title-color: var(--fd-color-text-2);
  padding: 16px 32px 24px;
  padding: 16px var(--fd-section-padding-x) 24px;
  border-bottom: none;
  background-color: var(--fd-section-background-color, transparent); }
  .fd-section::after {
    content: "";
    display: table;
    clear: both; }
  .fd-section:last-child, .fd-section--no-border {
    border-bottom: 0; }
  .fd-section--full-bleed, .fd-section--bleed {
    padding-right: 0;
    padding-left: 0; }
    .fd-section--full-bleed .fd-section__header, .fd-section--full-bleed .fd-section__footer, .fd-section--bleed .fd-section__header, .fd-section--bleed .fd-section__footer {
      margin-left: 32px;
      margin-left: var(--fd-section-padding-x);
      margin-right: 32px;
      margin-right: var(--fd-section-padding-x); }
  .fd-section__header {
    min-height: 40px;
    display: flex;
    align-items: center;
    margin-bottom: 24px; }
  .fd-section__title {
    font-size: 1.71429rem;
    line-height: 1.33333;
    font-weight: 400;
    color: var(--fd-section-title-color);
    flex: 1;
    margin-bottom: 0; }
  .fd-section__actions {
    margin-left: auto; }
  .fd-section__footer {
    display: flex;
    justify-content: center; }

/*!
.fd-panel
    .fd-panel__header
        .fd-panel__title
        .fd-panel__actions
    .fd-panel__footer
*/
.fd-panel {
  --fd-panel-background-color: var(--fd-color-background-2);
  --fd-panel-border-color: var(--fd-color-neutral-2);
  --fd-panel-box-shadow-color: var(--fd-color-neutral-2);
  --fd-panel-divider-color: var(--fd-panel-border-color);
  --fd-panel-border-width: 0;
  --fd-panel-title-color: var(--fd-color-text-1);
  background-color: var(--fd-panel-background-color);
  border-radius: 4px;
  border-style: solid;
  border-width: var(--fd-panel-border-width);
  border-color: var(--fd-panel-border-color);
  box-shadow: 0 5px 20px 0 var(--fd-panel-box-shadow-color); }
  .fd-panel::after {
    content: "";
    display: table;
    clear: both; }
  .fd-panel__header {
    min-height: 40px;
    display: flex;
    align-items: center;
    border-bottom-style: solid;
    border-bottom-width: 1px;
    border-bottom-color: var(--fd-panel-divider-color);
    padding: 16px 24px;
    font-size: 0.85714rem;
    line-height: 1.33333;
    font-weight: 400;
    color: var(--fd-color-text-3); }
  .fd-panel__title {
    font-size: 1.14286rem;
    line-height: 1.25;
    font-weight: 400;
    flex: 1;
    margin-bottom: 0;
    color: var(--fd-panel-title-color); }
  .fd-panel__description {
    margin-top: 4px; }
  .fd-panel__actions {
    margin-left: auto;
    margin-top: -4px;
    margin-bottom: -4px; }
    [dir="rtl"] .fd-panel__actions, .fd-panel__actions[dir="rtl"] {
      margin-right: auto;
      margin-left: 0; }
  .fd-panel__filters {
    padding: 12px 24px;
    border-bottom-style: solid;
    border-bottom-width: 1px;
    border-bottom-color: var(--fd-panel-divider-color);
    transition: all 0.15s ease-in; }
    .fd-panel__filters.is-hidden, .fd-panel__filters[aria-hidden="true"] {
      padding-top: 0;
      padding-bottom: 0;
      max-height: 0;
      overflow: hidden; }
  .fd-panel__body {
    padding: 16px 24px; }
    .fd-panel__body--full-bleed, .fd-panel__body--bleed {
      padding: 0; }
  .fd-panel__footer {
    display: flex;
    justify-content: center;
    padding: 16px 24px;
    border-top-style: solid;
    border-top-width: 1px;
    border-top-color: var(--fd-panel-divider-color); }

/*!
.fd-tile-grid+(--2col | --4col | --5col | --6col)
*/
.fd-panel-grid {
  display: flex;
  flex-wrap: wrap;
  flex-direction: column;
  position: relative; }
  @media (min-width: 320px) {
    .fd-panel-grid {
      /* flex fallback */
      display: flex;
      flex-direction: row;
      flex-wrap: wrap;
      display: grid;
      grid-template-columns: repeat(3, 1fr);
      grid-gap: var(--fd-width-gutter); }
      .fd-panel-grid--1col {
        grid-template-columns: repeat(1, 1fr); }
      .fd-panel-grid--2col {
        grid-template-columns: repeat(2, 1fr); }
      .fd-panel-grid--3col {
        grid-template-columns: repeat(3, 1fr); }
      .fd-panel-grid--4col {
        grid-template-columns: repeat(4, 1fr); }
      .fd-panel-grid--5col {
        grid-template-columns: repeat(5, 1fr); }
      .fd-panel-grid--6col {
        grid-template-columns: repeat(6, 1fr); }
      .fd-panel-grid--nogap, .fd-panel-grid--nogutter {
        grid-gap: 1px; }
        .fd-panel-grid--nogap > *, .fd-panel-grid--nogutter > * {
          box-shadow: none; } }

/*!
.fd-overlay
*/
.fd-overlay {
  --fd-overlay-background-color: rgba(74, 80, 92, 0.3);
  position: fixed;
  display: flex;
  top: 0;
  align-items: center;
  justify-content: center;
  z-index: 1000; }
  .fd-overlay[aria-hidden="true"] {
    display: none; }
  .fd-overlay--modal {
    background-color: var(--fd-overlay-background-color);
    height: 100vh;
    width: 100vw; }
  .fd-overlay--alert {
    position: fixed;
    left: 50%;
    transform: translate(-50%, 0);
    margin-top: 28px; }

/*!
.fd-alert+(--information, --success, --warning, --error)
    .fd-alert__close
*/
.fd-alert {
  --fd-alert-background-color: var(--fd-color-neutral-1);
  --fd-alert-border-color: var(--fd-color-neutral-4);
  --fd-alert-action-color: var(--fd-color-action-1);
  font-size: 14px;
  line-height: 1.42857;
  color: var(--fd-color-text-1);
  font-family: '72', -apple-system, BlinkMacSystemFont, Segoe UI, Roboto, Helvetica Neue, Arial, sans-serif, Apple Color Emoji, Segoe UI Emoji, Segoe UI Symbol;
  position: relative;
  color: #32363a;
  border-style: solid;
  border-width: 1px;
  background-color: var(--fd-alert-background-color);
  border-color: var(--fd-alert-border-color);
  padding: 8px 12px;
  border-radius: 4px; }
  .fd-alert .sap-icon--message-error, .fd-alert .sap-icon--message-warning, .fd-alert .sap-icon--message-success, .fd-alert .sap-icon--message-information {
    display: none; }
  .fd-alert__close {
    position: absolute;
    right: 0;
    top: 0;
    display: inline-block;
    margin: 0;
    padding: 0;
    font-smoothing: antialiased;
    /* stylelint-disable-line property-no-unknown */
    appearance: none;
    outline: 0;
    border: 0;
    display: inline-block;
    text-decoration: none;
    cursor: pointer;
    user-select: none;
    vertical-align: middle;
    white-space: nowrap;
    background-color: transparent;
    border-radius: 4px;
    color: var(--fd-alert-action-color);
    width: 36px;
    height: 36px; }
    .fd-alert__close::before {
      font-family: "SAP-icons";
      font-style: normal;
      font-weight: normal;
      text-align: center;
      display: inline-block;
      text-decoration: inherit;
      text-transform: none;
      text-rendering: optimizeLegibility;
      -webkit-font-smoothing: antialiased;
      -moz-osx-font-smoothing: grayscale;
      speak: none; }
    .fd-alert__close::before {
      content: ""; }
    .fd-alert__close::before {
      font-size: 1.42857rem;
      line-height: 1; }
    .fd-alert__close:focus, .fd-alert__close.is-focus {
      box-shadow: 0 0 0 1px var(--fd-color-action-focus); }
    [dir="rtl"] .fd-alert__close, .fd-alert__close[dir="rtl"] {
      left: 0;
      right: auto; }
  .fd-alert--dismissible {
    padding-right: 48px; }
    [dir="rtl"] .fd-alert--dismissible, .fd-alert--dismissible[dir="rtl"] {
      padding-right: 8px;
      padding-left: 48px; }
  .fd-alert--warning, .fd-alert--information, .fd-alert--success, .fd-alert--error {
    padding-left: 48px; }
    [dir="rtl"] .fd-alert--warning, .fd-alert--warning[dir="rtl"], [dir="rtl"] .fd-alert--information, .fd-alert--information[dir="rtl"], [dir="rtl"] .fd-alert--success, .fd-alert--success[dir="rtl"], [dir="rtl"] .fd-alert--error, .fd-alert--error[dir="rtl"] {
      padding-right: 48px;
      padding-left: 8px; }
      [dir="rtl"] .fd-alert--warning::before, .fd-alert--warning[dir="rtl"]::before, [dir="rtl"] .fd-alert--information::before, .fd-alert--information[dir="rtl"]::before, [dir="rtl"] .fd-alert--success::before, .fd-alert--success[dir="rtl"]::before, [dir="rtl"] .fd-alert--error::before, .fd-alert--error[dir="rtl"]::before {
        display: none; }
    .fd-alert--warning.fd-alert--dismissible, .fd-alert--information.fd-alert--dismissible, .fd-alert--success.fd-alert--dismissible, .fd-alert--error.fd-alert--dismissible {
      padding-right: 48px; }
      [dir="rtl"] .fd-alert--warning.fd-alert--dismissible, .fd-alert--warning.fd-alert--dismissible[dir="rtl"], [dir="rtl"] .fd-alert--information.fd-alert--dismissible, .fd-alert--information.fd-alert--dismissible[dir="rtl"], [dir="rtl"] .fd-alert--success.fd-alert--dismissible, .fd-alert--success.fd-alert--dismissible[dir="rtl"], [dir="rtl"] .fd-alert--error.fd-alert--dismissible, .fd-alert--error.fd-alert--dismissible[dir="rtl"] {
        padding-left: 48px; }
    .fd-alert--warning::before, .fd-alert--information::before, .fd-alert--success::before, .fd-alert--error::before {
      font-family: "SAP-icons";
      font-style: normal;
      font-weight: normal;
      text-align: center;
      display: inline-block;
      text-decoration: inherit;
      text-transform: none;
      text-rendering: optimizeLegibility;
      -webkit-font-smoothing: antialiased;
      -moz-osx-font-smoothing: grayscale;
      speak: none;
      position: absolute;
      left: 16px;
      top: 8px; }
    [dir="rtl"] .fd-alert--warning::after, .fd-alert--warning[dir="rtl"]::after, [dir="rtl"] .fd-alert--information::after, .fd-alert--information[dir="rtl"]::after, [dir="rtl"] .fd-alert--success::after, .fd-alert--success[dir="rtl"]::after, [dir="rtl"] .fd-alert--error::after, .fd-alert--error[dir="rtl"]::after {
      font-family: "SAP-icons";
      font-style: normal;
      font-weight: normal;
      text-align: center;
      display: inline-block;
      text-decoration: inherit;
      text-transform: none;
      text-rendering: optimizeLegibility;
      -webkit-font-smoothing: antialiased;
      -moz-osx-font-smoothing: grayscale;
      speak: none;
      position: absolute;
      right: 16px;
      top: 8px; }
  .fd-alert--warning {
    --fd-alert-background-color: var(--fd-color-background-alert);
    --fd-alert-border-color: var(--fd-color-status-2);
    background-color: var(--fd-alert-background-color);
    border-color: var(--fd-alert-border-color); }
    .fd-alert--warning::before, .fd-alert--warning::after {
      color: var(--fd-alert-border-color); }
    .fd-alert--warning::before {
      font-family: "SAP-icons";
      font-style: normal;
      font-weight: normal;
      text-align: center;
      display: inline-block;
      text-decoration: inherit;
      text-transform: none;
      text-rendering: optimizeLegibility;
      -webkit-font-smoothing: antialiased;
      -moz-osx-font-smoothing: grayscale;
      speak: none; }
    .fd-alert--warning::before {
      content: ""; }
    .fd-alert--warning::before {
      font-size: 1.42857rem;
      line-height: 1; }
    [dir="rtl"] .fd-alert--warning::after, .fd-alert--warning[dir="rtl"]::after {
      font-family: "SAP-icons";
      font-style: normal;
      font-weight: normal;
      text-align: center;
      display: inline-block;
      text-decoration: inherit;
      text-transform: none;
      text-rendering: optimizeLegibility;
      -webkit-font-smoothing: antialiased;
      -moz-osx-font-smoothing: grayscale;
      speak: none; }
    [dir="rtl"] .fd-alert--warning::after, .fd-alert--warning[dir="rtl"]::after {
      content: ""; }
    [dir="rtl"] .fd-alert--warning::after, .fd-alert--warning[dir="rtl"]::after {
      font-size: 1.42857rem;
      line-height: 1; }
  .fd-alert--error {
    --fd-alert-background-color: var(--fd-color-background-negative);
    --fd-alert-border-color: var(--fd-color-status-3);
    background-color: var(--fd-alert-background-color);
    border-color: var(--fd-alert-border-color); }
    .fd-alert--error::before, .fd-alert--error::after {
      color: var(--fd-alert-border-color); }
    .fd-alert--error::before {
      font-family: "SAP-icons";
      font-style: normal;
      font-weight: normal;
      text-align: center;
      display: inline-block;
      text-decoration: inherit;
      text-transform: none;
      text-rendering: optimizeLegibility;
      -webkit-font-smoothing: antialiased;
      -moz-osx-font-smoothing: grayscale;
      speak: none; }
    .fd-alert--error::before {
      content: ""; }
    .fd-alert--error::before {
      font-size: 1.42857rem;
      line-height: 1; }
    [dir="rtl"] .fd-alert--error::after, .fd-alert--error[dir="rtl"]::after {
      font-family: "SAP-icons";
      font-style: normal;
      font-weight: normal;
      text-align: center;
      display: inline-block;
      text-decoration: inherit;
      text-transform: none;
      text-rendering: optimizeLegibility;
      -webkit-font-smoothing: antialiased;
      -moz-osx-font-smoothing: grayscale;
      speak: none; }
    [dir="rtl"] .fd-alert--error::after, .fd-alert--error[dir="rtl"]::after {
      content: ""; }
    [dir="rtl"] .fd-alert--error::after, .fd-alert--error[dir="rtl"]::after {
      font-size: 1.42857rem;
      line-height: 1; }
  .fd-alert--success {
    --fd-alert-background-color: var(--fd-color-background-positive);
    --fd-alert-border-color: var(--fd-color-status-1);
    background-color: var(--fd-alert-background-color);
    border-color: var(--fd-alert-border-color); }
    .fd-alert--success::before, .fd-alert--success::after {
      color: var(--fd-alert-border-color); }
    .fd-alert--success::before {
      font-family: "SAP-icons";
      font-style: normal;
      font-weight: normal;
      text-align: center;
      display: inline-block;
      text-decoration: inherit;
      text-transform: none;
      text-rendering: optimizeLegibility;
      -webkit-font-smoothing: antialiased;
      -moz-osx-font-smoothing: grayscale;
      speak: none; }
    .fd-alert--success::before {
      content: ""; }
    .fd-alert--success::before {
      font-size: 1.42857rem;
      line-height: 1; }
    [dir="rtl"] .fd-alert--success::after, .fd-alert--success[dir="rtl"]::after {
      font-family: "SAP-icons";
      font-style: normal;
      font-weight: normal;
      text-align: center;
      display: inline-block;
      text-decoration: inherit;
      text-transform: none;
      text-rendering: optimizeLegibility;
      -webkit-font-smoothing: antialiased;
      -moz-osx-font-smoothing: grayscale;
      speak: none; }
    [dir="rtl"] .fd-alert--success::after, .fd-alert--success[dir="rtl"]::after {
      content: ""; }
    [dir="rtl"] .fd-alert--success::after, .fd-alert--success[dir="rtl"]::after {
      font-size: 1.42857rem;
      line-height: 1; }
  .fd-alert--information {
    --fd-alert-background-color: var(--fd-color-background-information);
    --fd-alert-border-color: var(--fd-color-action-1);
    background-color: var(--fd-alert-background-color);
    border-color: var(--fd-alert-border-color); }
    .fd-alert--information::before, .fd-alert--information::after {
      color: var(--fd-alert-border-color); }
    .fd-alert--information::before {
      font-family: "SAP-icons";
      font-style: normal;
      font-weight: normal;
      text-align: center;
      display: inline-block;
      text-decoration: inherit;
      text-transform: none;
      text-rendering: optimizeLegibility;
      -webkit-font-smoothing: antialiased;
      -moz-osx-font-smoothing: grayscale;
      speak: none; }
    .fd-alert--information::before {
      content: ""; }
    .fd-alert--information::before {
      font-size: 1.42857rem;
      line-height: 1; }
    [dir="rtl"] .fd-alert--information::after, .fd-alert--information[dir="rtl"]::after {
      font-family: "SAP-icons";
      font-style: normal;
      font-weight: normal;
      text-align: center;
      display: inline-block;
      text-decoration: inherit;
      text-transform: none;
      text-rendering: optimizeLegibility;
      -webkit-font-smoothing: antialiased;
      -moz-osx-font-smoothing: grayscale;
      speak: none; }
    [dir="rtl"] .fd-alert--information::after, .fd-alert--information[dir="rtl"]::after {
      content: ""; }
    [dir="rtl"] .fd-alert--information::after, .fd-alert--information[dir="rtl"]::after {
      font-size: 1.42857rem;
      line-height: 1; }

/*!
.fd-action-bar
	.fd-action-bar__title
	.fd-action-bar__actions+(.is-disabled | aria-hidden)?
        .fd-action-bar__action-item
*/
.fd-action-bar {
  --fd-action-bar-backbtn-separator-color: var(--fd-color-neutral-3);
  font-size: 14px;
  line-height: 1.42857;
  color: var(--fd-color-text-1);
  font-family: '72', -apple-system, BlinkMacSystemFont, Segoe UI, Roboto, Helvetica Neue, Arial, sans-serif, Apple Color Emoji, Segoe UI Emoji, Segoe UI Symbol;
  background-color: transparent;
  min-height: 64px;
  padding-right: 0;
  padding-left: 0;
  display: flex;
  align-items: baseline; }
  .fd-action-bar__header {
    font-size: 14px;
    line-height: 1.42857;
    color: var(--fd-color-text-1);
    font-family: '72', -apple-system, BlinkMacSystemFont, Segoe UI, Roboto, Helvetica Neue, Arial, sans-serif, Apple Color Emoji, Segoe UI Emoji, Segoe UI Symbol;
    font-size: 1rem;
    line-height: 1.42857;
    font-weight: 400;
    margin-bottom: 0;
    padding-top: 16px;
    padding-bottom: 16px;
    flex-grow: 1; }
    @media (min-width: 320px) {
      .fd-action-bar__header {
        white-space: nowrap;
        width: calc(100% - 10px);
        overflow: hidden;
        text-overflow: ellipsis; } }
  .fd-action-bar__back {
    display: block;
    position: relative;
    margin-right: 20px; }
    @media (min-width: 320px) {
      .fd-action-bar__back {
        display: none !important; } }
    @media (min-width: 600px) {
      .fd-action-bar__back {
        display: inline-block !important; } }
    .fd-action-bar__back::after {
      content: '';
      width: 0;
      height: 100%;
      position: absolute;
      top: -4px;
      right: -4px;
      border-right-style: solid;
      border-right-width: 1px;
      border-right-color: var(--fd-action-bar-backbtn-separator-color); }
    .fd-action-bar__back button {
      margin-top: -8px; }
    [dir="rtl"] .fd-action-bar__back, .fd-action-bar__back[dir="rtl"] {
      transform: scaleX(-1);
      margin-left: 20px;
      margin-right: 0; }
  .fd-action-bar__title {
    font-size: 1.71429rem;
    line-height: 1.33333;
    font-weight: 400;
    margin-bottom: 4px; }
    @media (min-width: 320px) {
      .fd-action-bar__title {
        white-space: nowrap;
        width: calc(100% - 10px);
        overflow: hidden;
        text-overflow: ellipsis; } }
  .fd-action-bar__description {
    color: var(--fd-color-text-3);
    font-size: 1rem;
    line-height: 1.42857;
    font-weight: 400; }
    @media (min-width: 320px) {
      .fd-action-bar__description {
        display: none !important; } }
    @media (min-width: 600px) {
      .fd-action-bar__description {
        display: inline-block !important; } }
  .fd-action-bar__actions {
    font-size: 14px;
    line-height: 1.42857;
    color: var(--fd-color-text-1);
    font-family: '72', -apple-system, BlinkMacSystemFont, Segoe UI, Roboto, Helvetica Neue, Arial, sans-serif, Apple Color Emoji, Segoe UI Emoji, Segoe UI Symbol;
    display: flex;
    align-items: center;
    transition: opacity 0.25s ease-in;
    visibility: visible; }
    .fd-action-bar__actions.is-disabled, .fd-action-bar__actions[aria-hidden="true"] {
      opacity: 0;
      visibility: hidden; }
    .fd-action-bar__actions > *,
    .fd-action-bar__actions > button {
      margin-left: 8px; }
      .fd-action-bar__actions > *:first-child,
      .fd-action-bar__actions > button:first-child {
        margin-left: 0; }
      [dir="rtl"] .fd-action-bar__actions > *, .fd-action-bar__actions > *[dir="rtl"], [dir="rtl"]
      .fd-action-bar__actions > button,
      .fd-action-bar__actions > button[dir="rtl"] {
        margin-right: 8px;
        margin-left: 0; }
        [dir="rtl"] .fd-action-bar__actions > *:first-child, .fd-action-bar__actions > *[dir="rtl"]:first-child, [dir="rtl"]
        .fd-action-bar__actions > button:first-child,
        .fd-action-bar__actions > button[dir="rtl"]:first-child {
          margin-right: 0; }
    .fd-action-bar__actions .fd-popover {
      top: -4px; }

/*!
.fd-badge+(( --success | --warning | --error ), (--pill | --filled))
*/
.fd-badge {
  --fd-badge-color: var(--fd-color-text-3);
  --fd-badge-background-color: transparent;
  font-size: 14px;
  line-height: 1.42857;
  color: var(--fd-color-text-1);
  font-family: '72', -apple-system, BlinkMacSystemFont, Segoe UI, Roboto, Helvetica Neue, Arial, sans-serif, Apple Color Emoji, Segoe UI Emoji, Segoe UI Symbol;
  font-size: 0.85714rem;
  line-height: 1.33333;
  font-weight: 400;
  font-weight: 700;
  color: var(--fd-badge-color);
  background-color: var(--fd-badge-background-color);
  text-transform: uppercase;
  line-height: 16px;
  vertical-align: middle;
  display: inline-block;
  padding-left: 4px;
  padding-right: 4px;
  border-radius: 4px;
  border-width: 1px;
  border-style: solid; }
  .fd-badge--pill {
    border-radius: 12px; }
  .fd-badge--filled {
    --fd-badge-background-color: var(--fd-color-neutral-1);
    border: none; }
    .fd-badge--filled.fd-badge--success {
      --fd-badge-background-color: var(--fd-color-background-positive); }
    .fd-badge--filled.fd-badge--warning {
      --fd-badge-background-color: var(--fd-color-background-alert); }
    .fd-badge--filled.fd-badge--error {
      --fd-badge-background-color: var(--fd-color-background-negative); }
  .fd-badge--success {
    --fd-badge-color: var(--fd-color-positive); }
  .fd-badge--warning {
    --fd-badge-color: var(--fd-color-alert); }
  .fd-badge--error {
    --fd-badge-color: var(--fd-color-negative); }

/*!
.fd-button+( (--compact), (--emphasized, --light), (--standard, --positive, --medium, --negative))+( (.is-disabled | [aria-disabled=true]) | (.is-selected | [aria-selected=true] | (.is-pressed | [aria-pressed=true]))
*/
.fd-button, [class*="fd-button--"], a[class*="fd-button--"] {
  --fd-button-color: var(--fd-color-action-1);
  --fd-button-border-color: var(--fd-color-action-1);
  --fd-button-background-color: var(--fd-color-background-2);
  display: inline-block;
  margin: 0;
  padding: 0;
  font-smoothing: antialiased;
  /* stylelint-disable-line property-no-unknown */
  appearance: none;
  outline: 0;
  border: 0;
  display: inline-block;
  text-decoration: none;
  cursor: pointer;
  user-select: none;
  vertical-align: middle;
  white-space: nowrap;
  background-color: transparent;
  border-radius: 4px;
  height: var(--fd-forms-height);
  max-height: var(--fd-forms-height);
  min-width: var(--fd-forms-height);
  font-size: 1rem;
  line-height: 1.42857;
  font-weight: 400;
  line-height: var(--fd-button-line-height);
  padding-left: 12px;
  padding-right: 12px;
  text-align: center;
  border-style: solid;
  border-width: 1px;
  color: var(--fd-button-color);
  border-color: var(--fd-button-border-color);
  background-color: var(--fd-button-background-color);
  transition: all 0.125s ease-in; }
  .fd-button::before, [class*="fd-button--"]::before, a[class*="fd-button--"]::before {
    font-size: 1.14286rem;
    line-height: 1; }
  .fd-button::after, [class*="fd-button--"]::after, a[class*="fd-button--"]::after {
    font-size: 1.14286rem;
    line-height: 1; }
  .fd-button::before, [class*="fd-button--"]::before, a[class*="fd-button--"]::before {
    margin-right: 8px;
    vertical-align: text-bottom; }
  [dir="rtl"] .fd-button::before, .fd-button[dir="rtl"]::before, [dir="rtl"] [class*="fd-button--"]::before, [class*="fd-button--"][dir="rtl"]::before, [dir="rtl"] a[class*="fd-button--"]::before, a[class*="fd-button--"][dir="rtl"]::before {
    margin-right: 0;
    margin-left: 8px; }
  .fd-button::after, [class*="fd-button--"]::after, a[class*="fd-button--"]::after {
    margin-left: 8px;
    vertical-align: middle; }
  [dir="rtl"] .fd-button::after, .fd-button[dir="rtl"]::after, [dir="rtl"] [class*="fd-button--"]::after, [class*="fd-button--"][dir="rtl"]::after, [dir="rtl"] a[class*="fd-button--"]::after, a[class*="fd-button--"][dir="rtl"]::after {
    margin-left: 0;
    margin-right: 8px; }
  .fd-button:empty, [class*="fd-button--"]:empty, a[class*="fd-button--"]:empty {
    padding: 0; }
    .fd-button:empty::before, .fd-button:empty::after, [class*="fd-button--"]:empty::before, [class*="fd-button--"]:empty::after, a[class*="fd-button--"]:empty::before, a[class*="fd-button--"]:empty::after {
      margin-right: 0;
      margin-left: 0; }
  .fd-button:focus, .fd-button.is-focus, [class*="fd-button--"]:focus, [class*="fd-button--"].is-focus, a[class*="fd-button--"]:focus, a[class*="fd-button--"].is-focus {
    box-shadow: 0 0 0 1px var(--fd-color-action-focus); }
  .fd-button:hover,
  .fd-button .is-hover, [class*="fd-button--"]:hover,
  [class*="fd-button--"] .is-hover, a[class*="fd-button--"]:hover,
  a[class*="fd-button--"] .is-hover {
    --fd-button-background-color: var(--fd-color-action-hover);
    --fd-button-color: var(--fd-color-action-2); }
    .fd-button:hover[aria-disabled="true"], .fd-button:hover.is-disabled, .fd-button:hover:disabled,
    .fd-button .is-hover[aria-disabled="true"],
    .fd-button .is-hover.is-disabled,
    .fd-button .is-hover:disabled, [class*="fd-button--"]:hover[aria-disabled="true"], [class*="fd-button--"]:hover.is-disabled, [class*="fd-button--"]:hover:disabled,
    [class*="fd-button--"] .is-hover[aria-disabled="true"],
    [class*="fd-button--"] .is-hover.is-disabled,
    [class*="fd-button--"] .is-hover:disabled, a[class*="fd-button--"]:hover[aria-disabled="true"], a[class*="fd-button--"]:hover.is-disabled, a[class*="fd-button--"]:hover:disabled,
    a[class*="fd-button--"] .is-hover[aria-disabled="true"],
    a[class*="fd-button--"] .is-hover.is-disabled,
    a[class*="fd-button--"] .is-hover:disabled {
      --fd-button-background-color: var(--fd-color-background-2);
      --fd-button-color: var(--fd-color-action-1); }
  .fd-button:active, .fd-button.is-active, .fd-button[aria-selected="true"], .fd-button.is-selected, .fd-button[aria-pressed="true"], .fd-button.is-pressed, [class*="fd-button--"]:active, [class*="fd-button--"].is-active, [class*="fd-button--"][aria-selected="true"], [class*="fd-button--"].is-selected, [class*="fd-button--"][aria-pressed="true"], [class*="fd-button--"].is-pressed, a[class*="fd-button--"]:active, a[class*="fd-button--"].is-active, a[class*="fd-button--"][aria-selected="true"], a[class*="fd-button--"].is-selected, a[class*="fd-button--"][aria-pressed="true"], a[class*="fd-button--"].is-pressed {
    --fd-button-background-color: var(--fd-color-action-selected);
    --fd-button-color: var(--fd-color-action-2); }
  .fd-button[aria-disabled="true"], .fd-button.is-disabled, .fd-button:disabled, [class*="fd-button--"][aria-disabled="true"], [class*="fd-button--"].is-disabled, [class*="fd-button--"]:disabled, a[class*="fd-button--"][aria-disabled="true"], a[class*="fd-button--"].is-disabled, a[class*="fd-button--"]:disabled {
    opacity: 0.4;
    cursor: not-allowed; }

.fd-button--compact,
a.fd-button--compact {
  height: var(--fd-forms-height-compact);
  max-height: var(--fd-forms-height-compact);
  min-width: var(--fd-forms-height-compact);
  line-height: var(--fd-button-line-height-compact); }
  .fd-for-touch .fd-button--compact, .fd-for-touch
  a.fd-button--compact {
    height: var(--fd-forms-height);
    min-width: var(--fd-forms-height);
    line-height: var(--fd-button-line-height); }
  .fd-for-compact .fd-button--compact, .fd-for-compact
  a.fd-button--compact {
    height: var(--fd-forms-height-compact);
    min-width: var(--fd-forms-height-compact);
    line-height: var(--fd-button-line-height-compact); }
  @media (min-width: 600px) {
    .fd-button--compact,
    a.fd-button--compact {
      height: var(--fd-forms-height-compact);
      min-width: var(--fd-forms-height-compact);
      line-height: var(--fd-button-line-height-compact); } }

.fd-button--emphasized,
a.fd-button--emphasized {
  font-weight: 700;
  --fd-button-color: var(--fd-color-action-2);
  --fd-button-border-color: var(--fd-color-action-1);
  --fd-button-background-color: var(--fd-color-action-1); }
  .fd-button--emphasized:hover,
  .fd-button--emphasized .is-hover,
  a.fd-button--emphasized:hover,
  a.fd-button--emphasized .is-hover {
    --fd-button-background-color: var(--fd-color-action-hover);
    --fd-button-color: var(--fd-color-action-2); }
    .fd-button--emphasized:hover[aria-disabled="true"], .fd-button--emphasized:hover.is-disabled, .fd-button--emphasized:hover:disabled,
    .fd-button--emphasized .is-hover[aria-disabled="true"],
    .fd-button--emphasized .is-hover.is-disabled,
    .fd-button--emphasized .is-hover:disabled,
    a.fd-button--emphasized:hover[aria-disabled="true"],
    a.fd-button--emphasized:hover.is-disabled,
    a.fd-button--emphasized:hover:disabled,
    a.fd-button--emphasized .is-hover[aria-disabled="true"],
    a.fd-button--emphasized .is-hover.is-disabled,
    a.fd-button--emphasized .is-hover:disabled {
      --fd-button-background-color: var(--fd-color-action-1);
      --fd-button-color: var(--fd-color-action-2); }
  .fd-button--emphasized.fd-button--standard, .fd-button-group .fd-button--emphasized[class*="fd-button--"],
  .fd-button-group .fd-button--emphasized.fd-button, .fd-button--emphasized.fd-button--positive, .fd-button--emphasized.fd-button--negative, .fd-button--emphasized.fd-button--medium,
  a.fd-button--emphasized.fd-button--standard,
  .fd-button-group a.fd-button--emphasized[class*="fd-button--"],
  .fd-button-group a.fd-button--emphasized.fd-button,
  a.fd-button--emphasized.fd-button--positive,
  a.fd-button--emphasized.fd-button--negative,
  a.fd-button--emphasized.fd-button--medium {
    --fd-button-color: var(--fd-color-action-2); }
    .fd-button--emphasized.fd-button--standard:hover[aria-disabled="true"], .fd-button-group .fd-button--emphasized:hover[aria-disabled="true"][class*="fd-button--"],
    .fd-button-group .fd-button--emphasized.fd-button:hover[aria-disabled="true"], .fd-button--emphasized.fd-button--standard:hover.is-disabled, .fd-button-group .fd-button--emphasized:hover.is-disabled[class*="fd-button--"],
    .fd-button-group .fd-button--emphasized.fd-button:hover.is-disabled, .fd-button--emphasized.fd-button--standard:hover:disabled, .fd-button-group .fd-button--emphasized:hover:disabled[class*="fd-button--"],
    .fd-button-group .fd-button--emphasized.fd-button:hover:disabled,
    .fd-button--emphasized.fd-button--standard .is-hover[aria-disabled="true"],
    .fd-button-group .fd-button--emphasized[class*="fd-button--"] .is-hover[aria-disabled="true"],
    .fd-button-group .fd-button--emphasized.fd-button .is-hover[aria-disabled="true"],
    .fd-button--emphasized.fd-button--standard .is-hover.is-disabled,
    .fd-button-group .fd-button--emphasized[class*="fd-button--"] .is-hover.is-disabled,
    .fd-button-group .fd-button--emphasized.fd-button .is-hover.is-disabled,
    .fd-button--emphasized.fd-button--standard .is-hover:disabled,
    .fd-button-group .fd-button--emphasized[class*="fd-button--"] .is-hover:disabled,
    .fd-button-group .fd-button--emphasized.fd-button .is-hover:disabled, .fd-button--emphasized.fd-button--positive:hover[aria-disabled="true"], .fd-button--emphasized.fd-button--positive:hover.is-disabled, .fd-button--emphasized.fd-button--positive:hover:disabled,
    .fd-button--emphasized.fd-button--positive .is-hover[aria-disabled="true"],
    .fd-button--emphasized.fd-button--positive .is-hover.is-disabled,
    .fd-button--emphasized.fd-button--positive .is-hover:disabled, .fd-button--emphasized.fd-button--negative:hover[aria-disabled="true"], .fd-button--emphasized.fd-button--negative:hover.is-disabled, .fd-button--emphasized.fd-button--negative:hover:disabled,
    .fd-button--emphasized.fd-button--negative .is-hover[aria-disabled="true"],
    .fd-button--emphasized.fd-button--negative .is-hover.is-disabled,
    .fd-button--emphasized.fd-button--negative .is-hover:disabled, .fd-button--emphasized.fd-button--medium:hover[aria-disabled="true"], .fd-button--emphasized.fd-button--medium:hover.is-disabled, .fd-button--emphasized.fd-button--medium:hover:disabled,
    .fd-button--emphasized.fd-button--medium .is-hover[aria-disabled="true"],
    .fd-button--emphasized.fd-button--medium .is-hover.is-disabled,
    .fd-button--emphasized.fd-button--medium .is-hover:disabled,
    a.fd-button--emphasized.fd-button--standard:hover[aria-disabled="true"],
    .fd-button-group a.fd-button--emphasized:hover[aria-disabled="true"][class*="fd-button--"],
    .fd-button-group a.fd-button--emphasized.fd-button:hover[aria-disabled="true"],
    a.fd-button--emphasized.fd-button--standard:hover.is-disabled,
    .fd-button-group a.fd-button--emphasized:hover.is-disabled[class*="fd-button--"],
    .fd-button-group a.fd-button--emphasized.fd-button:hover.is-disabled,
    a.fd-button--emphasized.fd-button--standard:hover:disabled,
    .fd-button-group a.fd-button--emphasized:hover:disabled[class*="fd-button--"],
    .fd-button-group a.fd-button--emphasized.fd-button:hover:disabled,
    a.fd-button--emphasized.fd-button--standard .is-hover[aria-disabled="true"],
    .fd-button-group a.fd-button--emphasized[class*="fd-button--"] .is-hover[aria-disabled="true"],
    .fd-button-group a.fd-button--emphasized.fd-button .is-hover[aria-disabled="true"],
    a.fd-button--emphasized.fd-button--standard .is-hover.is-disabled,
    .fd-button-group a.fd-button--emphasized[class*="fd-button--"] .is-hover.is-disabled,
    .fd-button-group a.fd-button--emphasized.fd-button .is-hover.is-disabled,
    a.fd-button--emphasized.fd-button--standard .is-hover:disabled,
    .fd-button-group a.fd-button--emphasized[class*="fd-button--"] .is-hover:disabled,
    .fd-button-group a.fd-button--emphasized.fd-button .is-hover:disabled,
    a.fd-button--emphasized.fd-button--positive:hover[aria-disabled="true"],
    a.fd-button--emphasized.fd-button--positive:hover.is-disabled,
    a.fd-button--emphasized.fd-button--positive:hover:disabled,
    a.fd-button--emphasized.fd-button--positive .is-hover[aria-disabled="true"],
    a.fd-button--emphasized.fd-button--positive .is-hover.is-disabled,
    a.fd-button--emphasized.fd-button--positive .is-hover:disabled,
    a.fd-button--emphasized.fd-button--negative:hover[aria-disabled="true"],
    a.fd-button--emphasized.fd-button--negative:hover.is-disabled,
    a.fd-button--emphasized.fd-button--negative:hover:disabled,
    a.fd-button--emphasized.fd-button--negative .is-hover[aria-disabled="true"],
    a.fd-button--emphasized.fd-button--negative .is-hover.is-disabled,
    a.fd-button--emphasized.fd-button--negative .is-hover:disabled,
    a.fd-button--emphasized.fd-button--medium:hover[aria-disabled="true"],
    a.fd-button--emphasized.fd-button--medium:hover.is-disabled,
    a.fd-button--emphasized.fd-button--medium:hover:disabled,
    a.fd-button--emphasized.fd-button--medium .is-hover[aria-disabled="true"],
    a.fd-button--emphasized.fd-button--medium .is-hover.is-disabled,
    a.fd-button--emphasized.fd-button--medium .is-hover:disabled {
      --fd-button-color: var(--fd-color-action-2); }
  .fd-button--emphasized.fd-button--standard, .fd-button-group .fd-button--emphasized[class*="fd-button--"],
  .fd-button-group .fd-button--emphasized.fd-button,
  a.fd-button--emphasized.fd-button--standard,
  .fd-button-group a.fd-button--emphasized[class*="fd-button--"],
  .fd-button-group a.fd-button--emphasized.fd-button {
    --fd-button-border-color: var(--fd-color-status-4);
    --fd-button-background-color: var(--fd-color-status-4); }
    .fd-button--emphasized.fd-button--standard:hover[aria-disabled="true"], .fd-button-group .fd-button--emphasized:hover[aria-disabled="true"][class*="fd-button--"],
    .fd-button-group .fd-button--emphasized.fd-button:hover[aria-disabled="true"], .fd-button--emphasized.fd-button--standard:hover.is-disabled, .fd-button-group .fd-button--emphasized:hover.is-disabled[class*="fd-button--"],
    .fd-button-group .fd-button--emphasized.fd-button:hover.is-disabled, .fd-button--emphasized.fd-button--standard:hover:disabled, .fd-button-group .fd-button--emphasized:hover:disabled[class*="fd-button--"],
    .fd-button-group .fd-button--emphasized.fd-button:hover:disabled,
    .fd-button--emphasized.fd-button--standard .is-hover[aria-disabled="true"],
    .fd-button-group .fd-button--emphasized[class*="fd-button--"] .is-hover[aria-disabled="true"],
    .fd-button-group .fd-button--emphasized.fd-button .is-hover[aria-disabled="true"],
    .fd-button--emphasized.fd-button--standard .is-hover.is-disabled,
    .fd-button-group .fd-button--emphasized[class*="fd-button--"] .is-hover.is-disabled,
    .fd-button-group .fd-button--emphasized.fd-button .is-hover.is-disabled,
    .fd-button--emphasized.fd-button--standard .is-hover:disabled,
    .fd-button-group .fd-button--emphasized[class*="fd-button--"] .is-hover:disabled,
    .fd-button-group .fd-button--emphasized.fd-button .is-hover:disabled,
    a.fd-button--emphasized.fd-button--standard:hover[aria-disabled="true"],
    .fd-button-group a.fd-button--emphasized:hover[aria-disabled="true"][class*="fd-button--"],
    .fd-button-group a.fd-button--emphasized.fd-button:hover[aria-disabled="true"],
    a.fd-button--emphasized.fd-button--standard:hover.is-disabled,
    .fd-button-group a.fd-button--emphasized:hover.is-disabled[class*="fd-button--"],
    .fd-button-group a.fd-button--emphasized.fd-button:hover.is-disabled,
    a.fd-button--emphasized.fd-button--standard:hover:disabled,
    .fd-button-group a.fd-button--emphasized:hover:disabled[class*="fd-button--"],
    .fd-button-group a.fd-button--emphasized.fd-button:hover:disabled,
    a.fd-button--emphasized.fd-button--standard .is-hover[aria-disabled="true"],
    .fd-button-group a.fd-button--emphasized[class*="fd-button--"] .is-hover[aria-disabled="true"],
    .fd-button-group a.fd-button--emphasized.fd-button .is-hover[aria-disabled="true"],
    a.fd-button--emphasized.fd-button--standard .is-hover.is-disabled,
    .fd-button-group a.fd-button--emphasized[class*="fd-button--"] .is-hover.is-disabled,
    .fd-button-group a.fd-button--emphasized.fd-button .is-hover.is-disabled,
    a.fd-button--emphasized.fd-button--standard .is-hover:disabled,
    .fd-button-group a.fd-button--emphasized[class*="fd-button--"] .is-hover:disabled,
    .fd-button-group a.fd-button--emphasized.fd-button .is-hover:disabled {
      --fd-button-background-color: var(--fd-color-status-4); }
  .fd-button--emphasized.fd-button--negative,
  a.fd-button--emphasized.fd-button--negative {
    --fd-button-border-color: var(--fd-color-status-3);
    --fd-button-background-color: var(--fd-color-status-3); }
    .fd-button--emphasized.fd-button--negative:hover[aria-disabled="true"], .fd-button--emphasized.fd-button--negative:hover.is-disabled, .fd-button--emphasized.fd-button--negative:hover:disabled,
    .fd-button--emphasized.fd-button--negative .is-hover[aria-disabled="true"],
    .fd-button--emphasized.fd-button--negative .is-hover.is-disabled,
    .fd-button--emphasized.fd-button--negative .is-hover:disabled,
    a.fd-button--emphasized.fd-button--negative:hover[aria-disabled="true"],
    a.fd-button--emphasized.fd-button--negative:hover.is-disabled,
    a.fd-button--emphasized.fd-button--negative:hover:disabled,
    a.fd-button--emphasized.fd-button--negative .is-hover[aria-disabled="true"],
    a.fd-button--emphasized.fd-button--negative .is-hover.is-disabled,
    a.fd-button--emphasized.fd-button--negative .is-hover:disabled {
      --fd-button-background-color: var(--fd-color-status-3); }
  .fd-button--emphasized.fd-button--medium,
  a.fd-button--emphasized.fd-button--medium {
    --fd-button-border-color: var(--fd-color-status-2);
    --fd-button-background-color: var(--fd-color-status-2); }
    .fd-button--emphasized.fd-button--medium:hover[aria-disabled="true"], .fd-button--emphasized.fd-button--medium:hover.is-disabled, .fd-button--emphasized.fd-button--medium:hover:disabled,
    .fd-button--emphasized.fd-button--medium .is-hover[aria-disabled="true"],
    .fd-button--emphasized.fd-button--medium .is-hover.is-disabled,
    .fd-button--emphasized.fd-button--medium .is-hover:disabled,
    a.fd-button--emphasized.fd-button--medium:hover[aria-disabled="true"],
    a.fd-button--emphasized.fd-button--medium:hover.is-disabled,
    a.fd-button--emphasized.fd-button--medium:hover:disabled,
    a.fd-button--emphasized.fd-button--medium .is-hover[aria-disabled="true"],
    a.fd-button--emphasized.fd-button--medium .is-hover.is-disabled,
    a.fd-button--emphasized.fd-button--medium .is-hover:disabled {
      --fd-button-background-color: var(--fd-color-status-2); }
  .fd-button--emphasized.fd-button--positive,
  a.fd-button--emphasized.fd-button--positive {
    --fd-button-border-color: var(--fd-color-status-1);
    --fd-button-background-color: var(--fd-color-status-1); }
    .fd-button--emphasized.fd-button--positive:hover[aria-disabled="true"], .fd-button--emphasized.fd-button--positive:hover.is-disabled, .fd-button--emphasized.fd-button--positive:hover:disabled,
    .fd-button--emphasized.fd-button--positive .is-hover[aria-disabled="true"],
    .fd-button--emphasized.fd-button--positive .is-hover.is-disabled,
    .fd-button--emphasized.fd-button--positive .is-hover:disabled,
    a.fd-button--emphasized.fd-button--positive:hover[aria-disabled="true"],
    a.fd-button--emphasized.fd-button--positive:hover.is-disabled,
    a.fd-button--emphasized.fd-button--positive:hover:disabled,
    a.fd-button--emphasized.fd-button--positive .is-hover[aria-disabled="true"],
    a.fd-button--emphasized.fd-button--positive .is-hover.is-disabled,
    a.fd-button--emphasized.fd-button--positive .is-hover:disabled {
      --fd-button-background-color: var(--fd-color-status-1); }

.fd-button--light,
a.fd-button--light {
  --fd-button-border-color: transparent;
  --fd-button-background-color: transparent; }
  .fd-button--light:hover,
  .fd-button--light .is-hover,
  a.fd-button--light:hover,
  a.fd-button--light .is-hover {
    --fd-button-background-color: var(--fd-color-neutral-1);
    --fd-button-color: var(--fd-color-action-1); }
    .fd-button--light:hover[aria-disabled="true"], .fd-button--light:hover.is-disabled, .fd-button--light:hover:disabled,
    .fd-button--light .is-hover[aria-disabled="true"],
    .fd-button--light .is-hover.is-disabled,
    .fd-button--light .is-hover:disabled,
    a.fd-button--light:hover[aria-disabled="true"],
    a.fd-button--light:hover.is-disabled,
    a.fd-button--light:hover:disabled,
    a.fd-button--light .is-hover[aria-disabled="true"],
    a.fd-button--light .is-hover.is-disabled,
    a.fd-button--light .is-hover:disabled {
      --fd-button-background-color: transparent;
      --fd-button-color: var(--fd-color-action-1); }
  .fd-button--light:active, .fd-button--light.is-active, .fd-button--light[aria-selected="true"], .fd-button--light.is-selected, .fd-button--light[aria-pressed="true"], .fd-button--light.is-pressed,
  a.fd-button--light:active,
  a.fd-button--light.is-active,
  a.fd-button--light[aria-selected="true"],
  a.fd-button--light.is-selected,
  a.fd-button--light[aria-pressed="true"],
  a.fd-button--light.is-pressed {
    --fd-button-background-color: var(--fd-color-action-selected);
    --fd-button-color: var(--fd-color-action-2); }
  .fd-button--light.fd-button--standard, .fd-button-group .fd-button--light[class*="fd-button--"],
  .fd-button-group .fd-button--light.fd-button, .fd-button--light.fd-button--positive, .fd-button--light.fd-button--negative, .fd-button--light.fd-button--medium,
  a.fd-button--light.fd-button--standard,
  .fd-button-group a.fd-button--light[class*="fd-button--"],
  .fd-button-group a.fd-button--light.fd-button,
  a.fd-button--light.fd-button--positive,
  a.fd-button--light.fd-button--negative,
  a.fd-button--light.fd-button--medium {
    --fd-button-border-color: transparent;
    --fd-button-background-color: transparent; }
    .fd-button--light.fd-button--standard:hover, .fd-button-group .fd-button--light:hover[class*="fd-button--"],
    .fd-button-group .fd-button--light.fd-button:hover,
    .fd-button--light.fd-button--standard .is-hover,
    .fd-button-group .fd-button--light[class*="fd-button--"] .is-hover,
    .fd-button-group .fd-button--light.fd-button .is-hover, .fd-button--light.fd-button--positive:hover,
    .fd-button--light.fd-button--positive .is-hover, .fd-button--light.fd-button--negative:hover,
    .fd-button--light.fd-button--negative .is-hover, .fd-button--light.fd-button--medium:hover,
    .fd-button--light.fd-button--medium .is-hover,
    a.fd-button--light.fd-button--standard:hover,
    .fd-button-group a.fd-button--light:hover[class*="fd-button--"],
    .fd-button-group a.fd-button--light.fd-button:hover,
    a.fd-button--light.fd-button--standard .is-hover,
    .fd-button-group a.fd-button--light[class*="fd-button--"] .is-hover,
    .fd-button-group a.fd-button--light.fd-button .is-hover,
    a.fd-button--light.fd-button--positive:hover,
    a.fd-button--light.fd-button--positive .is-hover,
    a.fd-button--light.fd-button--negative:hover,
    a.fd-button--light.fd-button--negative .is-hover,
    a.fd-button--light.fd-button--medium:hover,
    a.fd-button--light.fd-button--medium .is-hover {
      --fd-button-background-color: var(--fd-color-neutral-1); }
      .fd-button--light.fd-button--standard:hover[aria-disabled="true"], .fd-button-group .fd-button--light:hover[aria-disabled="true"][class*="fd-button--"],
      .fd-button-group .fd-button--light.fd-button:hover[aria-disabled="true"], .fd-button--light.fd-button--standard:hover.is-disabled, .fd-button-group .fd-button--light:hover.is-disabled[class*="fd-button--"],
      .fd-button-group .fd-button--light.fd-button:hover.is-disabled, .fd-button--light.fd-button--standard:hover:disabled, .fd-button-group .fd-button--light:hover:disabled[class*="fd-button--"],
      .fd-button-group .fd-button--light.fd-button:hover:disabled,
      .fd-button--light.fd-button--standard .is-hover[aria-disabled="true"],
      .fd-button-group .fd-button--light[class*="fd-button--"] .is-hover[aria-disabled="true"],
      .fd-button-group .fd-button--light.fd-button .is-hover[aria-disabled="true"],
      .fd-button--light.fd-button--standard .is-hover.is-disabled,
      .fd-button-group .fd-button--light[class*="fd-button--"] .is-hover.is-disabled,
      .fd-button-group .fd-button--light.fd-button .is-hover.is-disabled,
      .fd-button--light.fd-button--standard .is-hover:disabled,
      .fd-button-group .fd-button--light[class*="fd-button--"] .is-hover:disabled,
      .fd-button-group .fd-button--light.fd-button .is-hover:disabled, .fd-button--light.fd-button--positive:hover[aria-disabled="true"], .fd-button--light.fd-button--positive:hover.is-disabled, .fd-button--light.fd-button--positive:hover:disabled,
      .fd-button--light.fd-button--positive .is-hover[aria-disabled="true"],
      .fd-button--light.fd-button--positive .is-hover.is-disabled,
      .fd-button--light.fd-button--positive .is-hover:disabled, .fd-button--light.fd-button--negative:hover[aria-disabled="true"], .fd-button--light.fd-button--negative:hover.is-disabled, .fd-button--light.fd-button--negative:hover:disabled,
      .fd-button--light.fd-button--negative .is-hover[aria-disabled="true"],
      .fd-button--light.fd-button--negative .is-hover.is-disabled,
      .fd-button--light.fd-button--negative .is-hover:disabled, .fd-button--light.fd-button--medium:hover[aria-disabled="true"], .fd-button--light.fd-button--medium:hover.is-disabled, .fd-button--light.fd-button--medium:hover:disabled,
      .fd-button--light.fd-button--medium .is-hover[aria-disabled="true"],
      .fd-button--light.fd-button--medium .is-hover.is-disabled,
      .fd-button--light.fd-button--medium .is-hover:disabled,
      a.fd-button--light.fd-button--standard:hover[aria-disabled="true"],
      .fd-button-group a.fd-button--light:hover[aria-disabled="true"][class*="fd-button--"],
      .fd-button-group a.fd-button--light.fd-button:hover[aria-disabled="true"],
      a.fd-button--light.fd-button--standard:hover.is-disabled,
      .fd-button-group a.fd-button--light:hover.is-disabled[class*="fd-button--"],
      .fd-button-group a.fd-button--light.fd-button:hover.is-disabled,
      a.fd-button--light.fd-button--standard:hover:disabled,
      .fd-button-group a.fd-button--light:hover:disabled[class*="fd-button--"],
      .fd-button-group a.fd-button--light.fd-button:hover:disabled,
      a.fd-button--light.fd-button--standard .is-hover[aria-disabled="true"],
      .fd-button-group a.fd-button--light[class*="fd-button--"] .is-hover[aria-disabled="true"],
      .fd-button-group a.fd-button--light.fd-button .is-hover[aria-disabled="true"],
      a.fd-button--light.fd-button--standard .is-hover.is-disabled,
      .fd-button-group a.fd-button--light[class*="fd-button--"] .is-hover.is-disabled,
      .fd-button-group a.fd-button--light.fd-button .is-hover.is-disabled,
      a.fd-button--light.fd-button--standard .is-hover:disabled,
      .fd-button-group a.fd-button--light[class*="fd-button--"] .is-hover:disabled,
      .fd-button-group a.fd-button--light.fd-button .is-hover:disabled,
      a.fd-button--light.fd-button--positive:hover[aria-disabled="true"],
      a.fd-button--light.fd-button--positive:hover.is-disabled,
      a.fd-button--light.fd-button--positive:hover:disabled,
      a.fd-button--light.fd-button--positive .is-hover[aria-disabled="true"],
      a.fd-button--light.fd-button--positive .is-hover.is-disabled,
      a.fd-button--light.fd-button--positive .is-hover:disabled,
      a.fd-button--light.fd-button--negative:hover[aria-disabled="true"],
      a.fd-button--light.fd-button--negative:hover.is-disabled,
      a.fd-button--light.fd-button--negative:hover:disabled,
      a.fd-button--light.fd-button--negative .is-hover[aria-disabled="true"],
      a.fd-button--light.fd-button--negative .is-hover.is-disabled,
      a.fd-button--light.fd-button--negative .is-hover:disabled,
      a.fd-button--light.fd-button--medium:hover[aria-disabled="true"],
      a.fd-button--light.fd-button--medium:hover.is-disabled,
      a.fd-button--light.fd-button--medium:hover:disabled,
      a.fd-button--light.fd-button--medium .is-hover[aria-disabled="true"],
      a.fd-button--light.fd-button--medium .is-hover.is-disabled,
      a.fd-button--light.fd-button--medium .is-hover:disabled {
        --fd-button-background-color: transparent; }
  .fd-button--light.fd-button--standard, .fd-button-group .fd-button--light[class*="fd-button--"],
  .fd-button-group .fd-button--light.fd-button,
  a.fd-button--light.fd-button--standard,
  .fd-button-group a.fd-button--light[class*="fd-button--"],
  .fd-button-group a.fd-button--light.fd-button {
    --fd-button-color: var(--fd-color-status-4); }
    .fd-button--light.fd-button--standard:hover, .fd-button-group .fd-button--light:hover[class*="fd-button--"],
    .fd-button-group .fd-button--light.fd-button:hover,
    .fd-button--light.fd-button--standard .is-hover,
    .fd-button-group .fd-button--light[class*="fd-button--"] .is-hover,
    .fd-button-group .fd-button--light.fd-button .is-hover,
    a.fd-button--light.fd-button--standard:hover,
    .fd-button-group a.fd-button--light:hover[class*="fd-button--"],
    .fd-button-group a.fd-button--light.fd-button:hover,
    a.fd-button--light.fd-button--standard .is-hover,
    .fd-button-group a.fd-button--light[class*="fd-button--"] .is-hover,
    .fd-button-group a.fd-button--light.fd-button .is-hover {
      --fd-button-color: var(--fd-color-status-4); }
      .fd-button--light.fd-button--standard:hover[aria-disabled="true"], .fd-button-group .fd-button--light:hover[aria-disabled="true"][class*="fd-button--"],
      .fd-button-group .fd-button--light.fd-button:hover[aria-disabled="true"], .fd-button--light.fd-button--standard:hover.is-disabled, .fd-button-group .fd-button--light:hover.is-disabled[class*="fd-button--"],
      .fd-button-group .fd-button--light.fd-button:hover.is-disabled, .fd-button--light.fd-button--standard:hover:disabled, .fd-button-group .fd-button--light:hover:disabled[class*="fd-button--"],
      .fd-button-group .fd-button--light.fd-button:hover:disabled,
      .fd-button--light.fd-button--standard .is-hover[aria-disabled="true"],
      .fd-button-group .fd-button--light[class*="fd-button--"] .is-hover[aria-disabled="true"],
      .fd-button-group .fd-button--light.fd-button .is-hover[aria-disabled="true"],
      .fd-button--light.fd-button--standard .is-hover.is-disabled,
      .fd-button-group .fd-button--light[class*="fd-button--"] .is-hover.is-disabled,
      .fd-button-group .fd-button--light.fd-button .is-hover.is-disabled,
      .fd-button--light.fd-button--standard .is-hover:disabled,
      .fd-button-group .fd-button--light[class*="fd-button--"] .is-hover:disabled,
      .fd-button-group .fd-button--light.fd-button .is-hover:disabled,
      a.fd-button--light.fd-button--standard:hover[aria-disabled="true"],
      .fd-button-group a.fd-button--light:hover[aria-disabled="true"][class*="fd-button--"],
      .fd-button-group a.fd-button--light.fd-button:hover[aria-disabled="true"],
      a.fd-button--light.fd-button--standard:hover.is-disabled,
      .fd-button-group a.fd-button--light:hover.is-disabled[class*="fd-button--"],
      .fd-button-group a.fd-button--light.fd-button:hover.is-disabled,
      a.fd-button--light.fd-button--standard:hover:disabled,
      .fd-button-group a.fd-button--light:hover:disabled[class*="fd-button--"],
      .fd-button-group a.fd-button--light.fd-button:hover:disabled,
      a.fd-button--light.fd-button--standard .is-hover[aria-disabled="true"],
      .fd-button-group a.fd-button--light[class*="fd-button--"] .is-hover[aria-disabled="true"],
      .fd-button-group a.fd-button--light.fd-button .is-hover[aria-disabled="true"],
      a.fd-button--light.fd-button--standard .is-hover.is-disabled,
      .fd-button-group a.fd-button--light[class*="fd-button--"] .is-hover.is-disabled,
      .fd-button-group a.fd-button--light.fd-button .is-hover.is-disabled,
      a.fd-button--light.fd-button--standard .is-hover:disabled,
      .fd-button-group a.fd-button--light[class*="fd-button--"] .is-hover:disabled,
      .fd-button-group a.fd-button--light.fd-button .is-hover:disabled {
        --fd-button-color: var(--fd-color-status-4); }
    .fd-button--light.fd-button--standard:active, .fd-button-group .fd-button--light:active[class*="fd-button--"],
    .fd-button-group .fd-button--light.fd-button:active, .fd-button--light.fd-button--standard.is-active, .fd-button-group .fd-button--light.is-active[class*="fd-button--"],
    .fd-button-group .fd-button--light.is-active.fd-button, .fd-button--light.fd-button--standard[aria-selected="true"], .fd-button-group .fd-button--light[aria-selected="true"][class*="fd-button--"],
    .fd-button-group .fd-button--light.fd-button[aria-selected="true"], .fd-button--light.fd-button--standard.is-selected, .fd-button-group .fd-button--light.is-selected[class*="fd-button--"],
    .fd-button-group .fd-button--light.is-selected.fd-button, .fd-button--light.fd-button--standard[aria-pressed="true"], .fd-button-group .fd-button--light[aria-pressed="true"][class*="fd-button--"],
    .fd-button-group .fd-button--light.fd-button[aria-pressed="true"], .fd-button--light.fd-button--standard.is-pressed, .fd-button-group .fd-button--light.is-pressed[class*="fd-button--"],
    .fd-button-group .fd-button--light.is-pressed.fd-button,
    a.fd-button--light.fd-button--standard:active,
    .fd-button-group a.fd-button--light:active[class*="fd-button--"],
    .fd-button-group a.fd-button--light.fd-button:active,
    a.fd-button--light.fd-button--standard.is-active,
    .fd-button-group a.fd-button--light.is-active[class*="fd-button--"],
    .fd-button-group a.fd-button--light.is-active.fd-button,
    a.fd-button--light.fd-button--standard[aria-selected="true"],
    .fd-button-group a.fd-button--light[aria-selected="true"][class*="fd-button--"],
    .fd-button-group a.fd-button--light.fd-button[aria-selected="true"],
    a.fd-button--light.fd-button--standard.is-selected,
    .fd-button-group a.fd-button--light.is-selected[class*="fd-button--"],
    .fd-button-group a.fd-button--light.is-selected.fd-button,
    a.fd-button--light.fd-button--standard[aria-pressed="true"],
    .fd-button-group a.fd-button--light[aria-pressed="true"][class*="fd-button--"],
    .fd-button-group a.fd-button--light.fd-button[aria-pressed="true"],
    a.fd-button--light.fd-button--standard.is-pressed,
    .fd-button-group a.fd-button--light.is-pressed[class*="fd-button--"],
    .fd-button-group a.fd-button--light.is-pressed.fd-button {
      --fd-button-background-color: var(--fd-color-status-4);
      --fd-button-color: var(--fd-color-action-2); }
  .fd-button--light.fd-button--negative,
  a.fd-button--light.fd-button--negative {
    --fd-button-color: var(--fd-color-status-3); }
    .fd-button--light.fd-button--negative:hover,
    .fd-button--light.fd-button--negative .is-hover,
    a.fd-button--light.fd-button--negative:hover,
    a.fd-button--light.fd-button--negative .is-hover {
      --fd-button-color: var(--fd-color-status-3); }
      .fd-button--light.fd-button--negative:hover[aria-disabled="true"], .fd-button--light.fd-button--negative:hover.is-disabled, .fd-button--light.fd-button--negative:hover:disabled,
      .fd-button--light.fd-button--negative .is-hover[aria-disabled="true"],
      .fd-button--light.fd-button--negative .is-hover.is-disabled,
      .fd-button--light.fd-button--negative .is-hover:disabled,
      a.fd-button--light.fd-button--negative:hover[aria-disabled="true"],
      a.fd-button--light.fd-button--negative:hover.is-disabled,
      a.fd-button--light.fd-button--negative:hover:disabled,
      a.fd-button--light.fd-button--negative .is-hover[aria-disabled="true"],
      a.fd-button--light.fd-button--negative .is-hover.is-disabled,
      a.fd-button--light.fd-button--negative .is-hover:disabled {
        --fd-button-color: var(--fd-color-status-3); }
    .fd-button--light.fd-button--negative:active, .fd-button--light.fd-button--negative.is-active, .fd-button--light.fd-button--negative[aria-selected="true"], .fd-button--light.fd-button--negative.is-selected, .fd-button--light.fd-button--negative[aria-pressed="true"], .fd-button--light.fd-button--negative.is-pressed,
    a.fd-button--light.fd-button--negative:active,
    a.fd-button--light.fd-button--negative.is-active,
    a.fd-button--light.fd-button--negative[aria-selected="true"],
    a.fd-button--light.fd-button--negative.is-selected,
    a.fd-button--light.fd-button--negative[aria-pressed="true"],
    a.fd-button--light.fd-button--negative.is-pressed {
      --fd-button-background-color: var(--fd-color-status-3);
      --fd-button-color: var(--fd-color-action-2); }
  .fd-button--light.fd-button--positive,
  a.fd-button--light.fd-button--positive {
    --fd-button-color: var(--fd-color-status-1); }
    .fd-button--light.fd-button--positive:hover,
    .fd-button--light.fd-button--positive .is-hover,
    a.fd-button--light.fd-button--positive:hover,
    a.fd-button--light.fd-button--positive .is-hover {
      --fd-button-color: var(--fd-color-status-1); }
      .fd-button--light.fd-button--positive:hover[aria-disabled="true"], .fd-button--light.fd-button--positive:hover.is-disabled, .fd-button--light.fd-button--positive:hover:disabled,
      .fd-button--light.fd-button--positive .is-hover[aria-disabled="true"],
      .fd-button--light.fd-button--positive .is-hover.is-disabled,
      .fd-button--light.fd-button--positive .is-hover:disabled,
      a.fd-button--light.fd-button--positive:hover[aria-disabled="true"],
      a.fd-button--light.fd-button--positive:hover.is-disabled,
      a.fd-button--light.fd-button--positive:hover:disabled,
      a.fd-button--light.fd-button--positive .is-hover[aria-disabled="true"],
      a.fd-button--light.fd-button--positive .is-hover.is-disabled,
      a.fd-button--light.fd-button--positive .is-hover:disabled {
        --fd-button-color: var(--fd-color-status-1); }
    .fd-button--light.fd-button--positive:active, .fd-button--light.fd-button--positive.is-active, .fd-button--light.fd-button--positive[aria-selected="true"], .fd-button--light.fd-button--positive.is-selected, .fd-button--light.fd-button--positive[aria-pressed="true"], .fd-button--light.fd-button--positive.is-pressed,
    a.fd-button--light.fd-button--positive:active,
    a.fd-button--light.fd-button--positive.is-active,
    a.fd-button--light.fd-button--positive[aria-selected="true"],
    a.fd-button--light.fd-button--positive.is-selected,
    a.fd-button--light.fd-button--positive[aria-pressed="true"],
    a.fd-button--light.fd-button--positive.is-pressed {
      --fd-button-background-color: var(--fd-color-status-1);
      --fd-button-color: var(--fd-color-action-2); }
  .fd-button--light.fd-button--medium,
  a.fd-button--light.fd-button--medium {
    --fd-button-color: var(--fd-color-status-2); }
    .fd-button--light.fd-button--medium:hover,
    .fd-button--light.fd-button--medium .is-hover,
    a.fd-button--light.fd-button--medium:hover,
    a.fd-button--light.fd-button--medium .is-hover {
      --fd-button-color: var(--fd-color-status-2); }
      .fd-button--light.fd-button--medium:hover[aria-disabled="true"], .fd-button--light.fd-button--medium:hover.is-disabled, .fd-button--light.fd-button--medium:hover:disabled,
      .fd-button--light.fd-button--medium .is-hover[aria-disabled="true"],
      .fd-button--light.fd-button--medium .is-hover.is-disabled,
      .fd-button--light.fd-button--medium .is-hover:disabled,
      a.fd-button--light.fd-button--medium:hover[aria-disabled="true"],
      a.fd-button--light.fd-button--medium:hover.is-disabled,
      a.fd-button--light.fd-button--medium:hover:disabled,
      a.fd-button--light.fd-button--medium .is-hover[aria-disabled="true"],
      a.fd-button--light.fd-button--medium .is-hover.is-disabled,
      a.fd-button--light.fd-button--medium .is-hover:disabled {
        --fd-button-color: var(--fd-color-status-2); }
    .fd-button--light.fd-button--medium:active, .fd-button--light.fd-button--medium.is-active, .fd-button--light.fd-button--medium[aria-selected="true"], .fd-button--light.fd-button--medium.is-selected, .fd-button--light.fd-button--medium[aria-pressed="true"], .fd-button--light.fd-button--medium.is-pressed,
    a.fd-button--light.fd-button--medium:active,
    a.fd-button--light.fd-button--medium.is-active,
    a.fd-button--light.fd-button--medium[aria-selected="true"],
    a.fd-button--light.fd-button--medium.is-selected,
    a.fd-button--light.fd-button--medium[aria-pressed="true"],
    a.fd-button--light.fd-button--medium.is-pressed {
      --fd-button-background-color: var(--fd-color-status-2);
      --fd-button-color: var(--fd-color-action-2); }

.fd-button--standard, .fd-button-group [class*="fd-button--"],
.fd-button-group .fd-button, .fd-button--positive, .fd-button--negative, .fd-button--medium,
a.fd-button--standard,
.fd-button-group a[class*="fd-button--"],
.fd-button-group a.fd-button,
a.fd-button--positive,
a.fd-button--negative,
a.fd-button--medium {
  --fd-button-background-color: var(--fd-color-background-2); }
  .fd-button--standard:hover, .fd-button-group :hover[class*="fd-button--"],
  .fd-button-group .fd-button:hover,
  .fd-button--standard .is-hover,
  .fd-button-group [class*="fd-button--"] .is-hover,
  .fd-button-group .fd-button .is-hover, .fd-button--positive:hover,
  .fd-button--positive .is-hover, .fd-button--negative:hover,
  .fd-button--negative .is-hover, .fd-button--medium:hover,
  .fd-button--medium .is-hover,
  a.fd-button--standard:hover,
  .fd-button-group a:hover[class*="fd-button--"],
  .fd-button-group a.fd-button:hover,
  a.fd-button--standard .is-hover,
  .fd-button-group a[class*="fd-button--"] .is-hover,
  .fd-button-group a.fd-button .is-hover,
  a.fd-button--positive:hover,
  a.fd-button--positive .is-hover,
  a.fd-button--negative:hover,
  a.fd-button--negative .is-hover,
  a.fd-button--medium:hover,
  a.fd-button--medium .is-hover {
    --fd-button-color: var(--fd-color-action-2); }
  .fd-button--standard:active, .fd-button-group :active[class*="fd-button--"],
  .fd-button-group .fd-button:active, .fd-button--standard.is-active, .fd-button-group .is-active[class*="fd-button--"],
  .fd-button-group .is-active.fd-button, .fd-button--standard[aria-selected="true"], .fd-button-group [aria-selected="true"][class*="fd-button--"],
  .fd-button-group .fd-button[aria-selected="true"], .fd-button--standard.is-selected, .fd-button-group .is-selected[class*="fd-button--"],
  .fd-button-group .is-selected.fd-button, .fd-button--standard[aria-pressed="true"], .fd-button-group [aria-pressed="true"][class*="fd-button--"],
  .fd-button-group .fd-button[aria-pressed="true"], .fd-button--standard.is-pressed, .fd-button-group .is-pressed[class*="fd-button--"],
  .fd-button-group .is-pressed.fd-button, .fd-button--positive:active, .fd-button--positive.is-active, .fd-button--positive[aria-selected="true"], .fd-button--positive.is-selected, .fd-button--positive[aria-pressed="true"], .fd-button--positive.is-pressed, .fd-button--negative:active, .fd-button--negative.is-active, .fd-button--negative[aria-selected="true"], .fd-button--negative.is-selected, .fd-button--negative[aria-pressed="true"], .fd-button--negative.is-pressed, .fd-button--medium:active, .fd-button--medium.is-active, .fd-button--medium[aria-selected="true"], .fd-button--medium.is-selected, .fd-button--medium[aria-pressed="true"], .fd-button--medium.is-pressed,
  a.fd-button--standard:active,
  .fd-button-group a:active[class*="fd-button--"],
  .fd-button-group a.fd-button:active,
  a.fd-button--standard.is-active,
  .fd-button-group a.is-active[class*="fd-button--"],
  .fd-button-group a.is-active.fd-button,
  a.fd-button--standard[aria-selected="true"],
  .fd-button-group a[aria-selected="true"][class*="fd-button--"],
  .fd-button-group a.fd-button[aria-selected="true"],
  a.fd-button--standard.is-selected,
  .fd-button-group a.is-selected[class*="fd-button--"],
  .fd-button-group a.is-selected.fd-button,
  a.fd-button--standard[aria-pressed="true"],
  .fd-button-group a[aria-pressed="true"][class*="fd-button--"],
  .fd-button-group a.fd-button[aria-pressed="true"],
  a.fd-button--standard.is-pressed,
  .fd-button-group a.is-pressed[class*="fd-button--"],
  .fd-button-group a.is-pressed.fd-button,
  a.fd-button--positive:active,
  a.fd-button--positive.is-active,
  a.fd-button--positive[aria-selected="true"],
  a.fd-button--positive.is-selected,
  a.fd-button--positive[aria-pressed="true"],
  a.fd-button--positive.is-pressed,
  a.fd-button--negative:active,
  a.fd-button--negative.is-active,
  a.fd-button--negative[aria-selected="true"],
  a.fd-button--negative.is-selected,
  a.fd-button--negative[aria-pressed="true"],
  a.fd-button--negative.is-pressed,
  a.fd-button--medium:active,
  a.fd-button--medium.is-active,
  a.fd-button--medium[aria-selected="true"],
  a.fd-button--medium.is-selected,
  a.fd-button--medium[aria-pressed="true"],
  a.fd-button--medium.is-pressed {
    --fd-button-color: var(--fd-color-action-2); }

.fd-button--standard, .fd-button-group [class*="fd-button--"],
.fd-button-group .fd-button,
a.fd-button--standard,
.fd-button-group a[class*="fd-button--"],
.fd-button-group a.fd-button {
  --fd-button-color: var(--fd-color-status-4);
  --fd-button-border-color: var(--fd-color-status-4); }
  .fd-button--standard:focus, .fd-button-group :focus[class*="fd-button--"],
  .fd-button-group .fd-button:focus, .fd-button--standard.is-focus, .fd-button-group .is-focus[class*="fd-button--"],
  .fd-button-group .is-focus.fd-button,
  a.fd-button--standard:focus,
  .fd-button-group a:focus[class*="fd-button--"],
  .fd-button-group a.fd-button:focus,
  a.fd-button--standard.is-focus,
  .fd-button-group a.is-focus[class*="fd-button--"],
  .fd-button-group a.is-focus.fd-button {
    box-shadow: 0 0 0 1px var(--fd-color-status-4); }
  .fd-button--standard:hover, .fd-button-group :hover[class*="fd-button--"],
  .fd-button-group .fd-button:hover,
  .fd-button--standard .is-hover,
  .fd-button-group [class*="fd-button--"] .is-hover,
  .fd-button-group .fd-button .is-hover,
  a.fd-button--standard:hover,
  .fd-button-group a:hover[class*="fd-button--"],
  .fd-button-group a.fd-button:hover,
  a.fd-button--standard .is-hover,
  .fd-button-group a[class*="fd-button--"] .is-hover,
  .fd-button-group a.fd-button .is-hover {
    --fd-button-color: var(--fd-color-action-2);
    --fd-button-background-color: var(--fd-color-status-4); }
    .fd-button--standard:hover[aria-disabled="true"], .fd-button-group :hover[aria-disabled="true"][class*="fd-button--"],
    .fd-button-group .fd-button:hover[aria-disabled="true"], .fd-button--standard:hover.is-disabled, .fd-button-group :hover.is-disabled[class*="fd-button--"],
    .fd-button-group .fd-button:hover.is-disabled, .fd-button--standard:hover:disabled, .fd-button-group :hover:disabled[class*="fd-button--"],
    .fd-button-group .fd-button:hover:disabled,
    .fd-button--standard .is-hover[aria-disabled="true"],
    .fd-button-group [class*="fd-button--"] .is-hover[aria-disabled="true"],
    .fd-button-group .fd-button .is-hover[aria-disabled="true"],
    .fd-button--standard .is-hover.is-disabled,
    .fd-button-group [class*="fd-button--"] .is-hover.is-disabled,
    .fd-button-group .fd-button .is-hover.is-disabled,
    .fd-button--standard .is-hover:disabled,
    .fd-button-group [class*="fd-button--"] .is-hover:disabled,
    .fd-button-group .fd-button .is-hover:disabled,
    a.fd-button--standard:hover[aria-disabled="true"],
    .fd-button-group a:hover[aria-disabled="true"][class*="fd-button--"],
    .fd-button-group a.fd-button:hover[aria-disabled="true"],
    a.fd-button--standard:hover.is-disabled,
    .fd-button-group a:hover.is-disabled[class*="fd-button--"],
    .fd-button-group a.fd-button:hover.is-disabled,
    a.fd-button--standard:hover:disabled,
    .fd-button-group a:hover:disabled[class*="fd-button--"],
    .fd-button-group a.fd-button:hover:disabled,
    a.fd-button--standard .is-hover[aria-disabled="true"],
    .fd-button-group a[class*="fd-button--"] .is-hover[aria-disabled="true"],
    .fd-button-group a.fd-button .is-hover[aria-disabled="true"],
    a.fd-button--standard .is-hover.is-disabled,
    .fd-button-group a[class*="fd-button--"] .is-hover.is-disabled,
    .fd-button-group a.fd-button .is-hover.is-disabled,
    a.fd-button--standard .is-hover:disabled,
    .fd-button-group a[class*="fd-button--"] .is-hover:disabled,
    .fd-button-group a.fd-button .is-hover:disabled {
      --fd-button-color: var(--fd-color-status-4); }
  .fd-button--standard:active, .fd-button-group :active[class*="fd-button--"],
  .fd-button-group .fd-button:active, .fd-button--standard.is-active, .fd-button-group .is-active[class*="fd-button--"],
  .fd-button-group .is-active.fd-button, .fd-button--standard[aria-selected="true"], .fd-button-group [aria-selected="true"][class*="fd-button--"],
  .fd-button-group .fd-button[aria-selected="true"], .fd-button--standard.is-selected, .fd-button-group .is-selected[class*="fd-button--"],
  .fd-button-group .is-selected.fd-button, .fd-button--standard[aria-pressed="true"], .fd-button-group [aria-pressed="true"][class*="fd-button--"],
  .fd-button-group .fd-button[aria-pressed="true"], .fd-button--standard.is-pressed, .fd-button-group .is-pressed[class*="fd-button--"],
  .fd-button-group .is-pressed.fd-button,
  a.fd-button--standard:active,
  .fd-button-group a:active[class*="fd-button--"],
  .fd-button-group a.fd-button:active,
  a.fd-button--standard.is-active,
  .fd-button-group a.is-active[class*="fd-button--"],
  .fd-button-group a.is-active.fd-button,
  a.fd-button--standard[aria-selected="true"],
  .fd-button-group a[aria-selected="true"][class*="fd-button--"],
  .fd-button-group a.fd-button[aria-selected="true"],
  a.fd-button--standard.is-selected,
  .fd-button-group a.is-selected[class*="fd-button--"],
  .fd-button-group a.is-selected.fd-button,
  a.fd-button--standard[aria-pressed="true"],
  .fd-button-group a[aria-pressed="true"][class*="fd-button--"],
  .fd-button-group a.fd-button[aria-pressed="true"],
  a.fd-button--standard.is-pressed,
  .fd-button-group a.is-pressed[class*="fd-button--"],
  .fd-button-group a.is-pressed.fd-button {
    --fd-button-background-color: var(--fd-color-status-4); }

.fd-button--positive,
a.fd-button--positive {
  --fd-button-color: var(--fd-color-status-1);
  --fd-button-border-color: var(--fd-color-status-1); }
  .fd-button--positive:focus, .fd-button--positive.is-focus,
  a.fd-button--positive:focus,
  a.fd-button--positive.is-focus {
    box-shadow: 0 0 0 1px var(--fd-color-status-1); }
  .fd-button--positive:hover,
  .fd-button--positive .is-hover,
  a.fd-button--positive:hover,
  a.fd-button--positive .is-hover {
    --fd-button-background-color: var(--fd-color-status-1); }
    .fd-button--positive:hover[aria-disabled="true"], .fd-button--positive:hover.is-disabled, .fd-button--positive:hover:disabled,
    .fd-button--positive .is-hover[aria-disabled="true"],
    .fd-button--positive .is-hover.is-disabled,
    .fd-button--positive .is-hover:disabled,
    a.fd-button--positive:hover[aria-disabled="true"],
    a.fd-button--positive:hover.is-disabled,
    a.fd-button--positive:hover:disabled,
    a.fd-button--positive .is-hover[aria-disabled="true"],
    a.fd-button--positive .is-hover.is-disabled,
    a.fd-button--positive .is-hover:disabled {
      --fd-button-color: var(--fd-color-status-1); }
  .fd-button--positive:active, .fd-button--positive.is-active, .fd-button--positive[aria-selected="true"], .fd-button--positive.is-selected, .fd-button--positive[aria-pressed="true"], .fd-button--positive.is-pressed,
  a.fd-button--positive:active,
  a.fd-button--positive.is-active,
  a.fd-button--positive[aria-selected="true"],
  a.fd-button--positive.is-selected,
  a.fd-button--positive[aria-pressed="true"],
  a.fd-button--positive.is-pressed {
    --fd-button-background-color: var(--fd-color-status-1); }

.fd-button--medium,
a.fd-button--medium {
  --fd-button-color: var(--fd-color-status-2);
  --fd-button-border-color: var(--fd-color-status-2); }
  .fd-button--medium:focus, .fd-button--medium.is-focus,
  a.fd-button--medium:focus,
  a.fd-button--medium.is-focus {
    box-shadow: 0 0 0 1px var(--fd-color-status-2); }
  .fd-button--medium:hover,
  .fd-button--medium .is-hover,
  a.fd-button--medium:hover,
  a.fd-button--medium .is-hover {
    --fd-button-background-color: var(--fd-color-status-2); }
    .fd-button--medium:hover[aria-disabled="true"], .fd-button--medium:hover.is-disabled, .fd-button--medium:hover:disabled,
    .fd-button--medium .is-hover[aria-disabled="true"],
    .fd-button--medium .is-hover.is-disabled,
    .fd-button--medium .is-hover:disabled,
    a.fd-button--medium:hover[aria-disabled="true"],
    a.fd-button--medium:hover.is-disabled,
    a.fd-button--medium:hover:disabled,
    a.fd-button--medium .is-hover[aria-disabled="true"],
    a.fd-button--medium .is-hover.is-disabled,
    a.fd-button--medium .is-hover:disabled {
      --fd-button-color: var(--fd-color-status-2); }
  .fd-button--medium:active, .fd-button--medium.is-active, .fd-button--medium[aria-selected="true"], .fd-button--medium.is-selected, .fd-button--medium[aria-pressed="true"], .fd-button--medium.is-pressed,
  a.fd-button--medium:active,
  a.fd-button--medium.is-active,
  a.fd-button--medium[aria-selected="true"],
  a.fd-button--medium.is-selected,
  a.fd-button--medium[aria-pressed="true"],
  a.fd-button--medium.is-pressed {
    --fd-button-background-color: var(--fd-color-status-2); }

.fd-button--negative,
a.fd-button--negative {
  --fd-button-color: var(--fd-color-status-3);
  --fd-button-border-color: var(--fd-color-status-3); }
  .fd-button--negative:focus, .fd-button--negative.is-focus,
  a.fd-button--negative:focus,
  a.fd-button--negative.is-focus {
    box-shadow: 0 0 0 1px var(--fd-color-status-3); }
  .fd-button--negative:hover,
  .fd-button--negative .is-hover,
  a.fd-button--negative:hover,
  a.fd-button--negative .is-hover {
    --fd-button-background-color: var(--fd-color-status-3); }
    .fd-button--negative:hover[aria-disabled="true"], .fd-button--negative:hover.is-disabled, .fd-button--negative:hover:disabled,
    .fd-button--negative .is-hover[aria-disabled="true"],
    .fd-button--negative .is-hover.is-disabled,
    .fd-button--negative .is-hover:disabled,
    a.fd-button--negative:hover[aria-disabled="true"],
    a.fd-button--negative:hover.is-disabled,
    a.fd-button--negative:hover:disabled,
    a.fd-button--negative .is-hover[aria-disabled="true"],
    a.fd-button--negative .is-hover.is-disabled,
    a.fd-button--negative .is-hover:disabled {
      --fd-button-color: var(--fd-color-status-3); }
  .fd-button--negative:active, .fd-button--negative.is-active, .fd-button--negative[aria-selected="true"], .fd-button--negative.is-selected, .fd-button--negative[aria-pressed="true"], .fd-button--negative.is-pressed,
  a.fd-button--negative:active,
  a.fd-button--negative.is-active,
  a.fd-button--negative[aria-selected="true"],
  a.fd-button--negative.is-selected,
  a.fd-button--negative[aria-pressed="true"],
  a.fd-button--negative.is-pressed {
    --fd-button-background-color: var(--fd-color-status-3); }

.fd-button--shell,
a.fd-button--shell {
  --fd-button-color: var(--fd-color-shell-2);
  --fd-button-border-color: transparent;
  --fd-button-background-color: transparent; }
  .fd-button--shell[class*="sap-icon"],
  a.fd-button--shell[class*="sap-icon"] {
    padding: 0; }
    .fd-button--shell[class*="sap-icon"]::before, .fd-button--shell[class*="sap-icon"]::after,
    a.fd-button--shell[class*="sap-icon"]::before,
    a.fd-button--shell[class*="sap-icon"]::after {
      margin-right: 0;
      margin-left: 0; }
  .fd-button--shell:focus,
  a.fd-button--shell:focus {
    box-shadow: none; }
  .fd-button--shell:hover,
  .fd-button--shell .is-hover,
  a.fd-button--shell:hover,
  a.fd-button--shell .is-hover {
    --fd-button-color: var(--fd-color-shell-2);
    --fd-button-border-color: transparent;
    --fd-button-background-color: hsl(217, 21%, 25%); }
    .fd-button--shell:hover[aria-disabled="true"], .fd-button--shell:hover.is-disabled, .fd-button--shell:hover:disabled,
    .fd-button--shell .is-hover[aria-disabled="true"],
    .fd-button--shell .is-hover.is-disabled,
    .fd-button--shell .is-hover:disabled,
    a.fd-button--shell:hover[aria-disabled="true"],
    a.fd-button--shell:hover.is-disabled,
    a.fd-button--shell:hover:disabled,
    a.fd-button--shell .is-hover[aria-disabled="true"],
    a.fd-button--shell .is-hover.is-disabled,
    a.fd-button--shell .is-hover:disabled {
      --fd-button-color: var(--fd-color-shell-2);
      --fd-button-background-color: transparent; }
  .fd-button--shell:active, .fd-button--shell.is-active, .fd-button--shell[aria-selected="true"], .fd-button--shell.is-selected, .fd-button--shell[aria-pressed="true"], .fd-button--shell.is-pressed,
  a.fd-button--shell:active,
  a.fd-button--shell.is-active,
  a.fd-button--shell[aria-selected="true"],
  a.fd-button--shell.is-selected,
  a.fd-button--shell[aria-pressed="true"],
  a.fd-button--shell.is-pressed {
    --fd-button-color: var(--fd-color-shell-2);
    --fd-button-border-color: transparent;
    --fd-button-background-color: hsl(217, 21%, 21%); }

/* stylelint-disable no-duplicate-selectors */
.fd-button--xs {
  font-size: 0.85714rem;
  line-height: 1.33333;
  font-weight: 400;
  height: 24px;
  max-height: 24px;
  min-width: 24px;
  line-height: 1;
  padding-left: 8px;
  padding-right: 8px; }
  .fd-button--xs::before {
    font-size: 0.85714rem;
    line-height: 1; }
  .fd-button--xs::after {
    font-size: 0.85714rem;
    line-height: 1; }
  .fd-button--xs::before, .fd-button--xs::after {
    vertical-align: baseline; }
  .fd-button--xs::after {
    font-size: 14px;
    line-height: 1.42857; }

.fd-button--s {
  font-size: 1rem;
  line-height: 1.42857;
  font-weight: 400;
  height: 28px;
  max-height: 28px;
  min-width: 28px;
  line-height: 1; }
  .fd-button--s::before {
    font-size: 1.14286rem;
    line-height: 1; }
  .fd-button--s::after {
    font-size: 1.14286rem;
    line-height: 1; }
  .fd-button--s::after {
    font-size: 14px;
    line-height: 1.42857; }

.fd-button--l {
  font-size: 1rem;
  line-height: 1.42857;
  font-weight: 400;
  height: 40px;
  max-height: 40px;
  min-width: 40px;
  line-height: 1;
  padding-left: 12px;
  padding-right: 12px; }
  .fd-button--l::before {
    font-size: 1.42857rem;
    line-height: 1; }
  .fd-button--l::after {
    font-size: 1.42857rem;
    line-height: 1; }

.fd-button--main, .fd-button--action-bar {
  --fd-button-color: var(--fd-color-action-2);
  --fd-button-border-color: var(--fd-color-action-1);
  --fd-button-background-color: var(--fd-color-action-1); }
  .fd-button--main:hover,
  .fd-button--main .is-hover, .fd-button--action-bar:hover,
  .fd-button--action-bar .is-hover {
    --fd-button-background-color: var(--fd-color-action-hover);
    --fd-button-color: var(--fd-color-action-2); }
    .fd-button--main:hover[aria-disabled="true"], .fd-button--main:hover.is-disabled, .fd-button--main:hover:disabled,
    .fd-button--main .is-hover[aria-disabled="true"],
    .fd-button--main .is-hover.is-disabled,
    .fd-button--main .is-hover:disabled, .fd-button--action-bar:hover[aria-disabled="true"], .fd-button--action-bar:hover.is-disabled, .fd-button--action-bar:hover:disabled,
    .fd-button--action-bar .is-hover[aria-disabled="true"],
    .fd-button--action-bar .is-hover.is-disabled,
    .fd-button--action-bar .is-hover:disabled {
      --fd-button-background-color: var(--fd-color-action-1);
      --fd-button-color: var(--fd-color-action-2); }
  .fd-button--main.fd-button--negative, .fd-button--action-bar.fd-button--negative {
    --fd-button-color: var(--fd-color-action-2);
    --fd-button-border-color: var(--fd-color-status-3);
    --fd-button-background-color: var(--fd-color-status-3); }
    .fd-button--main.fd-button--negative:hover[aria-disabled="true"], .fd-button--main.fd-button--negative:hover.is-disabled, .fd-button--main.fd-button--negative:hover:disabled,
    .fd-button--main.fd-button--negative .is-hover[aria-disabled="true"],
    .fd-button--main.fd-button--negative .is-hover.is-disabled,
    .fd-button--main.fd-button--negative .is-hover:disabled, .fd-button--action-bar.fd-button--negative:hover[aria-disabled="true"], .fd-button--action-bar.fd-button--negative:hover.is-disabled, .fd-button--action-bar.fd-button--negative:hover:disabled,
    .fd-button--action-bar.fd-button--negative .is-hover[aria-disabled="true"],
    .fd-button--action-bar.fd-button--negative .is-hover.is-disabled,
    .fd-button--action-bar.fd-button--negative .is-hover:disabled {
      --fd-button-background-color: var(--fd-color-status-3);
      --fd-button-color: var(--fd-color-action-2); }
  .fd-button--main.fd-button--positive, .fd-button--action-bar.fd-button--positive {
    --fd-button-color: var(--fd-color-action-2);
    --fd-button-border-color: var(--fd-color-status-1);
    --fd-button-background-color: var(--fd-color-status-1); }
    .fd-button--main.fd-button--positive:hover[aria-disabled="true"], .fd-button--main.fd-button--positive:hover.is-disabled, .fd-button--main.fd-button--positive:hover:disabled,
    .fd-button--main.fd-button--positive .is-hover[aria-disabled="true"],
    .fd-button--main.fd-button--positive .is-hover.is-disabled,
    .fd-button--main.fd-button--positive .is-hover:disabled, .fd-button--action-bar.fd-button--positive:hover[aria-disabled="true"], .fd-button--action-bar.fd-button--positive:hover.is-disabled, .fd-button--action-bar.fd-button--positive:hover:disabled,
    .fd-button--action-bar.fd-button--positive .is-hover[aria-disabled="true"],
    .fd-button--action-bar.fd-button--positive .is-hover.is-disabled,
    .fd-button--action-bar.fd-button--positive .is-hover:disabled {
      --fd-button-background-color: var(--fd-color-status-1);
      --fd-button-color: var(--fd-color-action-2); }

.fd-button--secondary {
  --fd-button-border-color: transparent; }
  .fd-button--secondary:hover,
  .fd-button--secondary .is-hover {
    --fd-button-background-color: var(--fd-color-neutral-1);
    --fd-button-color: var(--fd-color-action-1); }
    .fd-button--secondary:hover[aria-disabled="true"], .fd-button--secondary:hover.is-disabled, .fd-button--secondary:hover:disabled,
    .fd-button--secondary .is-hover[aria-disabled="true"],
    .fd-button--secondary .is-hover.is-disabled,
    .fd-button--secondary .is-hover:disabled {
      --fd-button-background-color: var(--fd-color-background-2);
      --fd-button-color: var(--fd-color-action-1); }
  .fd-button--secondary:active, .fd-button--secondary.is-active, .fd-button--secondary[aria-selected="true"], .fd-button--secondary.is-selected, .fd-button--secondary[aria-pressed="true"], .fd-button--secondary.is-pressed {
    --fd-button-background-color: var(--fd-color-action-selected);
    --fd-button-color: var(--fd-color-action-2); }
  .fd-button--secondary.fd-button--negative {
    --fd-button-color: var(--fd-color-status-3);
    --fd-button-border-color: transparent;
    --fd-button-background-color: transparent; }
    .fd-button--secondary.fd-button--negative:hover,
    .fd-button--secondary.fd-button--negative .is-hover {
      --fd-button-background-color: var(--fd-color-neutral-1);
      --fd-button-color: var(--fd-color-status-3); }
      .fd-button--secondary.fd-button--negative:hover[aria-disabled="true"], .fd-button--secondary.fd-button--negative:hover.is-disabled, .fd-button--secondary.fd-button--negative:hover:disabled,
      .fd-button--secondary.fd-button--negative .is-hover[aria-disabled="true"],
      .fd-button--secondary.fd-button--negative .is-hover.is-disabled,
      .fd-button--secondary.fd-button--negative .is-hover:disabled {
        --fd-button-background-color: transparent;
        --fd-button-color: var(--fd-color-status-3); }
    .fd-button--secondary.fd-button--negative:active, .fd-button--secondary.fd-button--negative.is-active, .fd-button--secondary.fd-button--negative[aria-selected="true"], .fd-button--secondary.fd-button--negative.is-selected, .fd-button--secondary.fd-button--negative[aria-pressed="true"], .fd-button--secondary.fd-button--negative.is-pressed {
      --fd-button-background-color: var(--fd-color-status-3);
      --fd-button-color: var(--fd-color-action-2); }
  .fd-button--secondary.fd-button--positive {
    --fd-button-color: var(--fd-color-status-1);
    --fd-button-border-color: transparent;
    --fd-button-background-color: transparent; }
    .fd-button--secondary.fd-button--positive:hover,
    .fd-button--secondary.fd-button--positive .is-hover {
      --fd-button-background-color: var(--fd-color-neutral-1);
      --fd-button-color: var(--fd-color-status-1); }
      .fd-button--secondary.fd-button--positive:hover[aria-disabled="true"], .fd-button--secondary.fd-button--positive:hover.is-disabled, .fd-button--secondary.fd-button--positive:hover:disabled,
      .fd-button--secondary.fd-button--positive .is-hover[aria-disabled="true"],
      .fd-button--secondary.fd-button--positive .is-hover.is-disabled,
      .fd-button--secondary.fd-button--positive .is-hover:disabled {
        --fd-button-background-color: transparent;
        --fd-button-color: var(--fd-color-status-1); }
    .fd-button--secondary.fd-button--positive:active, .fd-button--secondary.fd-button--positive.is-active, .fd-button--secondary.fd-button--positive[aria-selected="true"], .fd-button--secondary.fd-button--positive.is-selected, .fd-button--secondary.fd-button--positive[aria-pressed="true"], .fd-button--secondary.fd-button--positive.is-pressed {
      --fd-button-background-color: var(--fd-color-status-1);
      --fd-button-color: var(--fd-color-action-2); }

.fd-button--toolbar {
  --fd-button-color: var(--fd-color-text-2);
  --fd-button-border-color: var(--fd-color-neutral-3);
  --fd-button-background-color: var(--fd-color-neutral-1); }
  .fd-button--toolbar:focus, .fd-button--toolbar.is-focus {
    box-shadow: 0 0 0 1px var(--fd-color-neutral-3); }
  .fd-button--toolbar:active, .fd-button--toolbar.is-active, .fd-button--toolbar[aria-selected="true"], .fd-button--toolbar.is-selected, .fd-button--toolbar[aria-pressed="true"], .fd-button--toolbar.is-pressed {
    --fd-button-background-color: var(--fd-color-action-selected);
    --fd-button-color: var(--fd-color-action-2); }
  .fd-button--toolbar:hover,
  .fd-button--toolbar .is-hover {
    --fd-button-background-color: var(--fd-color-action-hover);
    --fd-button-color: var(--fd-color-action-2); }
    .fd-button--toolbar:hover[aria-disabled="true"], .fd-button--toolbar:hover.is-disabled, .fd-button--toolbar:hover:disabled,
    .fd-button--toolbar .is-hover[aria-disabled="true"],
    .fd-button--toolbar .is-hover.is-disabled,
    .fd-button--toolbar .is-hover:disabled {
      --fd-button-background-color: var(--fd-color-neutral-3);
      --fd-button-color: var(--fd-color-text-2); }

/* stylelint-enable */
/*
WHY THIS:
Other semantic grids don't eaily allow for fixed gutter widths
nor do they take advantage of the CSS calc function
and they can get kind of confusing.
This is meant for simple layout problems — 
i.e., you have a box and you need three cols inside of equal widths
with gutters between.

The FLOW terminology is meant to be netural outside of rows and columns
and comes from the HTML5 spec referring to elements that can contain other elements
http://w3c.github.io/html/dom.html#kinds-of-content-flow-content

USAGE:
— Outer containers should contain the `@include flow-box` base styles
— Columns get `@include flow` with `$span` and `$cols` params

EXAMPLE MARKUP:
<section>
  <div class="box">x</div>
  <div class="box">x</div>
  <div class="box">x</div>
  <div class="box">x</div>
</section>

EXAMPLE CSS:
section {
  @include flow-box()
  .box {
    @include flow(2);
    &:first-child {
      @include flow-shift(2);
    }
  }
}

OUTPUT:
This will render 4 boxes spanning 2 cols each indented 2 cols
(based on defaults)

|--| |--| |--| |--| |--| |--| |--| |--| |--| |--| |--| |--|
          |  box  | |  box  | |  box  | |  box  |

*/
/*!
.fd-breadcrumb
    .fd-breadcrumb__item
    .fd-breadcrump__link
*/
.fd-breadcrumb {
  font-size: 14px;
  line-height: 1.42857;
  color: var(--fd-color-text-1);
  font-family: '72', -apple-system, BlinkMacSystemFont, Segoe UI, Roboto, Helvetica Neue, Arial, sans-serif, Apple Color Emoji, Segoe UI Emoji, Segoe UI Symbol;
  font-size: 0.85714rem;
  line-height: 1.33333;
  font-weight: 400;
  display: flex;
  flex-wrap: wrap;
  padding-left: 0;
  margin-bottom: -12px;
  list-style: none;
  padding-right: 16px; }
  [dir="rtl"] .fd-breadcrumb, .fd-breadcrumb[dir="rtl"] {
    padding: 0 0 0 16px; }
    [dir="rtl"] .fd-breadcrumb__item::after, .fd-breadcrumb[dir="rtl"]__item::after {
      content: "/";
      margin-right: initial;
      margin-left: 16px; }
    [dir="rtl"] .fd-breadcrumb__item:last-child::after, .fd-breadcrumb[dir="rtl"]__item:last-child::after {
      content: none; }
  .fd-breadcrumb__item::after {
    content: "/";
    margin-right: 16px; }
  .fd-breadcrumb__item:last-child::after {
    content: none; }
  [dir="rtl"] .fd-breadcrumb__item::after, .fd-breadcrumb__item[dir="rtl"]::after {
    content: "/";
    margin-right: initial;
    margin-left: 16px; }
  [dir="rtl"] .fd-breadcrumb__item:last-child::after, .fd-breadcrumb__item[dir="rtl"]:last-child::after {
    content: none; }
  .fd-breadcrumb__link {
    margin-right: 16px; }
    [dir="rtl"] .fd-breadcrumb__link, .fd-breadcrumb__link[dir="rtl"] {
      margin-right: initial;
      margin-left: 16px; }

/*!
.fd-dropdown+()
    .fd-dropdown__control+([disabled])
*/
.fd-dropdown {
  font-size: 14px;
  line-height: 1.42857;
  color: var(--fd-color-text-1);
  font-family: '72', -apple-system, BlinkMacSystemFont, Segoe UI, Roboto, Helvetica Neue, Arial, sans-serif, Apple Color Emoji, Segoe UI Emoji, Segoe UI Symbol;
  position: relative;
  display: inline-block; }
  .fd-dropdown__control {
    position: relative;
    margin-left: 0;
    width: 100%;
    text-align: left; }
    .fd-dropdown__control::after {
      font-family: "SAP-icons";
      font-style: normal;
      font-weight: normal;
      text-align: center;
      display: inline-block;
      text-decoration: inherit;
      text-transform: none;
      text-rendering: optimizeLegibility;
      -webkit-font-smoothing: antialiased;
      -moz-osx-font-smoothing: grayscale;
      speak: none; }
    .fd-dropdown__control::after {
      content: "";
      transition: transform 0.125s ease-in; }
    [dir="rtl"] .fd-dropdown__control::after, .fd-dropdown__control[dir="rtl"]::after {
      border-top-left-radius: 4px;
      border-bottom-left-radius: 4px;
      border-top-right-radius: 0;
      border-bottom-right-radius: 0; }
    [dir="rtl"] .fd-dropdown__control:not(.fd-button--standard)::after, .fd-dropdown__control[dir="rtl"]:not(.fd-button--standard)::after {
      border-right-style: solid;
      border-right-width: 1px;
      border-right-color: var(--fd-color-neutral-4);
      border-left: none; }
    [dir="rtl"] .fd-dropdown__control.fd-button, .fd-dropdown__control[dir="rtl"].fd-button {
      padding-left: 0;
      padding-right: 12px; }
    .fd-dropdown__control::after {
      color: var(--fd-color-action-1);
      width: 34px;
      height: 34px;
      margin-top: -3px;
      padding-top: 10px;
      border-left-style: solid;
      border-left-width: 1px;
      border-left-color: var(--fd-color-neutral-4);
      background-color: var(--fd-color-neutral-1);
      border-top-right-radius: 4px;
      border-bottom-right-radius: 4px; }
    .fd-dropdown__control--no-border {
      border: none; }
    .fd-dropdown__control.fd-button--xs::after {
      height: 21.5px;
      padding-top: 5px; }
    .fd-dropdown__control.fd-button--s::after {
      font-size: 14px;
      line-height: 1.42857; }
    .fd-dropdown__control.fd-button--s::after {
      margin-top: -3px;
      height: 26px;
      padding-top: 4.8px; }
    .fd-dropdown__control.fd-button--compact::after {
      font-size: 14px;
      line-height: 1.42857; }
    .fd-dropdown__control.fd-button--compact::after {
      height: 26px;
      padding-top: 3px; }
    .fd-dropdown__control.fd-button--l::after {
      font-size: 14px;
      line-height: 1.42857; }
    .fd-dropdown__control.fd-button--l::after {
      margin-top: -3px;
      width: 38px;
      height: 38px;
      padding-top: 10px; }
  .fd-dropdown__control.fd-button {
    color: var(--fd-color-text-1);
    border-color: var(--fd-color-neutral-4);
    padding-right: 0; }
    .fd-dropdown__control.fd-button:hover,
    .fd-dropdown__control.fd-button .is-hover {
      color: var(--fd-color-text-1);
      background-color: var(--fd-color-background-2);
      border-color: var(--fd-color-action-hover);
      box-shadow: none; }
    .fd-dropdown__control.fd-button:active, .fd-dropdown__control.fd-button.is-active, .fd-dropdown__control.fd-button[aria-expanded="true"] {
      color: var(--fd-color-text-1);
      background-color: var(--fd-color-background-2);
      box-shadow: 0 0 0 1px var(--fd-color-action-hover); }
  .fd-dropdown__control.fd-button--standard:hover, .fd-button-group .fd-dropdown__control:hover[class*="fd-button--"],
  .fd-button-group .fd-dropdown__control.fd-button:hover, .fd-dropdown__control.fd-button--standard:active, .fd-button-group .fd-dropdown__control:active[class*="fd-button--"],
  .fd-button-group .fd-dropdown__control.fd-button:active, .fd-dropdown__control.fd-button--standard.is-active, .fd-button-group .fd-dropdown__control.is-active[class*="fd-button--"],
  .fd-button-group .fd-dropdown__control.is-active.fd-button {
    color: var(--fd-color-text-2);
    background-color: var(--fd-color-neutral-1);
    border-color: var(--fd-color-status-4);
    box-shadow: none; }
  .fd-dropdown__control.fd-button--standard::after, .fd-button-group .fd-dropdown__control[class*="fd-button--"]::after,
  .fd-button-group .fd-dropdown__control.fd-button::after {
    width: auto;
    margin-right: 10px;
    color: var(--fd-color-text-1);
    background-color: transparent;
    border-left: none; }
  [dir="rtl"] .fd-dropdown__control.fd-button--standard, [dir="rtl"] .fd-button-group .fd-dropdown__control[class*="fd-button--"], .fd-button-group [dir="rtl"] .fd-dropdown__control[class*="fd-button--"],
  [dir="rtl"] .fd-button-group .fd-dropdown__control.fd-button, .fd-button-group [dir="rtl"] .fd-dropdown__control.fd-button, .fd-dropdown__control.fd-button--standard[dir="rtl"], .fd-button-group .fd-dropdown__control[dir="rtl"][class*="fd-button--"],
  .fd-button-group .fd-dropdown__control.fd-button[dir="rtl"] {
    padding-left: 12px; }
  .fd-dropdown__group, .fd-dropdown__list {
    list-style: none;
    margin-bottom: 0; }
  .fd-dropdown__title {
    display: block;
    margin-bottom: 0;
    padding: 8px 24px;
    font-size: 0.85714rem;
    line-height: 1.33333;
    font-weight: 400;
    text-transform: uppercase;
    color: #6a6d70;
    background: #fafafa; }
  .fd-dropdown__item {
    display: block;
    padding: 10px 24px;
    color: #51555a; }
    .fd-dropdown__item:hover {
      color: #51555a;
      background-color: #fafafa; }
    .fd-dropdown__item.is-selected, .fd-dropdown__item[aria-selected="true"] {
      color: #51555a;
      background-color: rgba(10, 110, 209, 0.07); }

/*!
.fd-form
    .fd-form__set?
        .fd-form__legend
        .fd-form__group?
            .fd-form__item+(--check, --inline)
                .fd-form__label
                .fd-form__control
            .fd-form__message(--help, --error, --warning)
*/
.fd-form {
  --fd-form-label-color: var(--fd-color-text-3);
  font-size: 14px;
  line-height: 1.42857;
  color: var(--fd-color-text-1);
  font-family: '72', -apple-system, BlinkMacSystemFont, Segoe UI, Roboto, Helvetica Neue, Arial, sans-serif, Apple Color Emoji, Segoe UI Emoji, Segoe UI Symbol; }
  .fd-form__group::after {
    content: "";
    display: table;
    clear: both; }
  .fd-form__group:last-child {
    margin-bottom: 0;
    margin-right: 0; }
  .fd-form__group .fd-form__item:last-child {
    margin-bottom: 0;
    margin-right: 0; }
  .fd-form__set {
    margin-bottom: 16px; }
    .fd-form__set:last-child {
      margin-bottom: 0; }
    @media (min-width: 320px) {
      .fd-form__set .fd-form__item--inline {
        margin-bottom: 0; } }
    .fd-form__set .fd-form__message {
      margin-top: 8px; }
  .fd-form__item {
    margin-bottom: 16px; }
    .fd-form__item:last-child {
      margin-bottom: 0;
      margin-right: 0; }
    .fd-form__item--check {
      position: relative;
      display: block; }
      .fd-form__item--check::after {
        content: "";
        display: table;
        clear: both; }
      .fd-form__item--check .fd-form__label {
        box-sizing: content-box;
        font-size: 1rem;
        line-height: 1.42857;
        font-weight: 400;
        margin-bottom: 0;
        vertical-align: middle;
        display: inline-flex;
        align-items: center;
        line-height: 16px;
        cursor: pointer; }
        .fd-form__item--check .fd-form__label:focus-within {
          outline-width: 1px;
          outline-style: dotted;
          outline-color: var(--fd-color-action-focus);
          padding: 4px;
          margin: -4px; }
      .fd-form__item--check .fd-form__control {
        float: left;
        vertical-align: middle;
        margin-right: 8px; }
        [dir="rtl"] .fd-form__item--check .fd-form__control, .fd-form__item--check .fd-form__control[dir="rtl"] {
          float: right;
          margin-left: 8px;
          margin-right: 0; }
      .fd-form__item--check .fd-form__help {
        float: none;
        margin-left: 12px; }
    .fd-form__item--inline {
      float: left;
      margin-right: 12px; }
      .fd-form__item--inline .fd-form__label {
        width: auto; }
      [dir="rtl"] .fd-form__item--inline, .fd-form__item--inline[dir="rtl"] {
        float: right;
        margin-right: 0;
        margin-left: 12px; }
        [dir="rtl"] .fd-form__item--inline .fd-form__label, .fd-form__item--inline[dir="rtl"] .fd-form__label {
          width: auto; }
  .fd-form__label, .fd-form__legend {
    font-size: 14px;
    line-height: 1.42857;
    color: var(--fd-color-text-1);
    font-family: '72', -apple-system, BlinkMacSystemFont, Segoe UI, Roboto, Helvetica Neue, Arial, sans-serif, Apple Color Emoji, Segoe UI Emoji, Segoe UI Symbol;
    font-size: 1rem;
    line-height: 1.42857;
    font-weight: 400;
    display: block;
    margin-bottom: 8px;
    border: 0;
    color: var(--fd-color-text-3); }
    .fd-form__label.is-disabled, .fd-form__legend.is-disabled {
      opacity: 0.4; }
  .fd-form__control {
    min-width: 16px; }
  .fd-form__legend {
    margin-bottom: 8px; }
  .fd-form__help {
    float: right; }
    [dir="rtl"] .fd-form__help, .fd-form__help[dir="rtl"] {
      float: left; }
  .fd-form__message {
    clear: both;
    display: block;
    font-size: 0.85714rem;
    line-height: 1.33333;
    font-weight: 400;
    color: #51555a;
    padding: 8px 0;
    position: relative; }
    .fd-form__item--check + .fd-form__message {
      transform: translateY(-12px);
      margin-bottom: -12px; }
    .fd-form__item--inline.fd-form__item--check + .fd-form__message {
      transform: translateY(8px);
      margin-bottom: 8px; }
    .fd-form__message::before {
      width: 18px;
      height: 18px;
      font-style: normal;
      font-size: 1.3em;
      font-family: "SAP-icons";
      position: absolute;
      left: 0;
      color: white;
      text-align: center;
      line-height: 18px; }
    .fd-form__message--warning, .fd-form__message--error, .fd-form__message--help {
      padding-left: 24px; }
      .fd-form__message--warning::before, .fd-form__message--error::before, .fd-form__message--help::before {
        left: 0;
        top: 6px; }
    .fd-form__message--help {
      color: #32363a; }
      .fd-form__message--help::before {
        color: #32363a;
        content: ""; }
    .fd-form__message--warning {
      color: #e9730c; }
      .fd-form__message--warning::before {
        color: #e9730c;
        content: ""; }
    .fd-form__message--error {
      color: #bb0000; }
      .fd-form__message--error::before {
        content: "";
        color: #bb0000; }

/*!
.fd-input-group+(--inline)
    .fd-input-group__addon+()
        .fd-input-group__button
*/
.fd-input-group {
  font-size: 14px;
  line-height: 1.42857;
  color: var(--fd-color-text-1);
  font-family: '72', -apple-system, BlinkMacSystemFont, Segoe UI, Roboto, Helvetica Neue, Arial, sans-serif, Apple Color Emoji, Segoe UI Emoji, Segoe UI Symbol;
  display: flex;
  vertical-align: bottom; }
  .fd-input-group input[type=text], .fd-input-group input[type=password], .fd-input-group input[type=email], .fd-input-group input[type=url], .fd-input-group input[type=search], .fd-input-group input[type=tel], .fd-input-group input[type=number], .fd-input-group input[type=date], .fd-input-group input[type=time] {
    z-index: 1; }
  [dir="rtl"] .fd-input-group > * input:read-only, .fd-input-group[dir="rtl"] > * input:read-only {
    border-right: none; }
  [dir="rtl"] .fd-input-group > *:not(:first-child), .fd-input-group[dir="rtl"] > *:not(:first-child) {
    border-right: none; }
  [dir="rtl"] .fd-input-group > *:not(.fd-input-group__addon--readonly):last-child, .fd-input-group[dir="rtl"] > *:not(.fd-input-group__addon--readonly):last-child {
    border-top-left-radius: 4px;
    border-bottom-left-radius: 4px;
    border-top-right-radius: 0;
    border-bottom-right-radius: 0;
    border-left-style: solid;
    border-left-width: 1px;
    border-left-color: var(--fd-forms-border-color); }
  [dir="rtl"] .fd-input-group > *:first-child, .fd-input-group[dir="rtl"] > *:first-child {
    border-top-left-radius: 0;
    border-bottom-left-radius: 0;
    border-top-right-radius: 4px;
    border-bottom-right-radius: 4px;
    border-right-style: solid;
    border-right-width: 1px;
    border-right-color: var(--fd-forms-border-color); }
  .fd-input-group [type="number"] {
    -moz-appearance: textfield; }
    .fd-input-group [type="number"]::-webkit-outer-spin-button, .fd-input-group [type="number"]::-webkit-inner-spin-button {
      -webkit-appearance: none;
      margin: 0; }
  .fd-input-group [type="search"] {
    background-image: url("data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHdpZHRoPSIyNiIgaGVpZ2h0PSIyNiI+PHBhdGggZmlsbC1ydWxlPSJldmVub2RkIiBmaWxsPSIjNEQ1QTZDIiBkPSJNOS43NTQgMTkuNDk2YTkuNjg0IDkuNjg0IDAgMCAwIDYuMDk3LTIuMTU4bDguMjg5IDguMzRhMS4wODQgMS4wODQgMCAwIDAgMS41MzUtMS41MjlsLTguMy04LjM1YTkuNjg5IDkuNjg5IDAgMCAwIDIuMTItNi4wNTRjMC01LjM3Ny00LjM2OS05Ljc1MS05Ljc0MS05Ljc1MVMuMDEzIDQuMzY4LjAxMyA5Ljc0NXM0LjM2OSA5Ljc1MSA5Ljc0MSA5Ljc1MXptMC0xNy4zMzVjNC4xNzcgMCA3LjU3NyAzLjQwMiA3LjU3NyA3LjU4NCAwIDQuMTgyLTMuNCA3LjU4NC03LjU3NyA3LjU4NC00LjE3OCAwLTcuNTc3LTMuNDAyLTcuNTc3LTcuNTg0IDAtNC4xODIgMy4zOTktNy41ODQgNy41NzctNy41ODR6Ii8+PC9zdmc+");
    background-repeat: no-repeat;
    background-position: 16px center;
    background-size: 16px;
    padding-left: 48px;
    padding-right: 60px;
    -moz-appearance: textfield; }
    .fd-input-group [type="search"]::-webkit-search-decoration {
      -webkit-appearance: none;
      margin: 0; }
    .fd-input-group [type="search"]::-webkit-search-cancel-button {
      -webkit-appearance: none;
      margin: 0; }
    [dir="rtl"] .fd-input-group [type="search"], .fd-input-group [type="search"][dir="rtl"] {
      padding-right: 48px;
      padding-left: 60px;
      background-position: right 16px center;
      border-bottom-left-radius: 4px;
      border-top-left-radius: 4px; }
      [dir="rtl"] .fd-input-group [type="search"] + .fd-input-group__addon, .fd-input-group [type="search"][dir="rtl"] + .fd-input-group__addon {
        border-left: none; }
  .fd-input-group--inline {
    display: inline-flex; }
  .fd-input-group--no-border input {
    border-color: transparent; }
  .fd-input-group__addon {
    color: var(--fd-color-text-3);
    padding: 0 12px;
    border-style: solid;
    border-width: 1px;
    border-color: var(--fd-forms-border-color);
    background-color: var(--fd-color-neutral-1);
    justify-content: center;
    display: flex;
    flex-direction: column;
    border-radius: 4px;
    height: var(--fd-forms-height); }
    .fd-input-group__addon--readonly {
      border: none;
      border-top-color: transparent;
      border-right-color: transparent;
      border-radius: 0; }
    .fd-input-group--compact .fd-input-group__addon {
      height: var(--fd-forms-height-compact); }
      .fd-input-group--compact .fd-input-group__addon .fd-input-group__button--step-up::before, .fd-input-group--compact .fd-input-group__addon .fd-input-group__button--step-down::before {
        top: -4px; }
    .fd-input-group__addon:first-child {
      border-right-width: 0; }
    .fd-input-group__addon:last-child {
      border-left-width: 0; }
    .fd-input-group__addon--button {
      padding: 0; }
      .fd-input-group__addon--button [class*="fd-button"] {
        border-radius: 0; }
    .fd-input-group__addon--before {
      border-top-right-radius: 0;
      border-bottom-right-radius: 0; }
    .fd-input-group__addon--after {
      border-top-left-radius: 0;
      border-bottom-left-radius: 0; }
    .fd-input-group__addon--textarea {
      height: auto; }
    [readonly] + .fd-input-group__addon {
      border-top-color: transparent;
      border-right-color: transparent;
      border-radius: 0; }
    [type="search"] + .fd-input-group__addon {
      border: 0;
      width: 0; }
  .fd-input-group--before input[type=text], .fd-input-group--before input[type=password], .fd-input-group--before input[type=email], .fd-input-group--before input[type=url], .fd-input-group--before input[type=search], .fd-input-group--before input[type=tel], .fd-input-group--before input[type=number], .fd-input-group--before input[type=date], .fd-input-group--before input[type=time] {
    border-top-left-radius: 0;
    border-bottom-left-radius: 0; }
  .fd-input-group--after input[type=text], .fd-input-group--after input[type=password], .fd-input-group--after input[type=email], .fd-input-group--after input[type=url], .fd-input-group--after input[type=search], .fd-input-group--after input[type=tel], .fd-input-group--after input[type=number], .fd-input-group--after input[type=date], .fd-input-group--after input[type=time] {
    border-top-right-radius: 0;
    border-bottom-right-radius: 0; }
  .fd-input-group__button {
    display: inline-block;
    margin: 0;
    padding: 0;
    font-smoothing: antialiased;
    /* stylelint-disable-line property-no-unknown */
    appearance: none;
    outline: 0;
    border: 0;
    display: inline-block;
    text-decoration: none;
    cursor: pointer;
    user-select: none;
    vertical-align: middle;
    white-space: nowrap;
    background-color: transparent;
    border-radius: 4px;
    flex: 1;
    width: 100%;
    display: block;
    min-width: 48px;
    background-color: var(--fd-color-neutral-1); }
    .fd-input-group__button--step-up, .fd-input-group__button--step-down {
      font-size: 1rem;
      line-height: 1.42857;
      font-weight: 400;
      color: var(--fd-color-action);
      position: relative; }
      .fd-input-group__button--step-up::before, .fd-input-group__button--step-down::before {
        position: absolute;
        transform: translateX(-50%);
        top: -2px; }
      [dir="rtl"] .fd-input-group__button--step-up::before, .fd-input-group__button--step-up[dir="rtl"]::before, [dir="rtl"] .fd-input-group__button--step-down::before, .fd-input-group__button--step-down[dir="rtl"]::before {
        transform: translateX(50%); }
    .fd-input-group__button--step-up {
      border-bottom-style: solid;
      border-bottom-width: 1px;
      border-bottom-color: var(--fd-forms-border-color);
      border-bottom-left-radius: 0;
      border-bottom-right-radius: 0; }
    .fd-input-group__button--clear {
      background-color: transparent;
      background-image: url("data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHdpZHRoPSIyNiIgaGVpZ2h0PSIyNiI+PHBhdGggZmlsbC1ydWxlPSJldmVub2RkIiBmaWxsPSIjMDA5Q0RGIiBkPSJNMTMgMEM1LjgyIDAgMCA1LjgyIDAgMTNzNS44MiAxMyAxMyAxMyAxMy01LjgyIDEzLTEzUzIwLjE4IDAgMTMgMHptNS4xOTUgMTcuMzk2YS41NjQuNTY0IDAgMSAxLS43OTkuNzk5TDEzIDEzLjc5OWwtNC4zOTYgNC4zOTZhLjU2NC41NjQgMCAxIDEtLjc5OS0uNzk5TDEyLjIwMSAxMyA3LjgwNSA4LjYwNGEuNTY0LjU2NCAwIDEgMSAuNzk5LS43OTlMMTMgMTIuMjAxbDQuMzk2LTQuMzk2YS41NjQuNTY0IDAgMSAxIC43OTkuNzk5TDEzLjc5OSAxM2w0LjM5NiA0LjM5NnoiLz48L3N2Zz4=");
      background-repeat: no-repeat;
      background-position: center;
      background-size: 20px;
      position: relative;
      left: -44px; }

/*!
.fd-label+(--success | --warning | --error)
*/
.fd-label {
  --fd-label-color: var(--fd-color-text-3);
  font-size: 14px;
  line-height: 1.42857;
  color: var(--fd-color-text-1);
  font-family: '72', -apple-system, BlinkMacSystemFont, Segoe UI, Roboto, Helvetica Neue, Arial, sans-serif, Apple Color Emoji, Segoe UI Emoji, Segoe UI Symbol;
  font-size: 0.85714rem;
  line-height: 1.33333;
  font-weight: 400;
  font-weight: 700;
  color: var(--fd-label-color);
  text-transform: uppercase;
  line-height: 24px;
  vertical-align: middle;
  display: inline-block;
  padding-left: 8px;
  padding-right: 8px; }
  .fd-label--success {
    --fd-label-color: var(--fd-color-positive); }
  .fd-label--warning {
    --fd-label-color: var(--fd-color-alert); }
  .fd-label--error {
    --fd-label-color: var(--fd-color-negative); }

/*!
.fd-pagination
*/
.fd-pagination {
  --fd-pagination-link-color: var(--fd-color-action-1);
  --fd-pagination-link-color-active: var(--fd-color-text-2);
  --fd-pagination-total-color: var(--fd-color-text-2);
  font-size: 14px;
  line-height: 1.42857;
  color: var(--fd-color-text-1);
  font-family: '72', -apple-system, BlinkMacSystemFont, Segoe UI, Roboto, Helvetica Neue, Arial, sans-serif, Apple Color Emoji, Segoe UI Emoji, Segoe UI Symbol;
  font-size: 1rem;
  line-height: 1.42857;
  font-weight: 400; }
  .fd-pagination__total {
    color: var(--fd-pagination-total-color);
    margin-right: 8px; }
  .fd-pagination__nav {
    display: inline-block;
    padding-left: 0;
    margin-left: 0;
    list-style: none;
    margin-bottom: 0; }
  .fd-pagination__link {
    color: var(--fd-pagination-link-color);
    background-color: transparent;
    padding-left: 4px;
    padding-right: 4px;
    position: relative; }
    .fd-pagination__link[aria-selected="true"], .fd-pagination__link.is-selected {
      color: var(--fd-pagination-link-color-active);
      text-decoration: none;
      cursor: default;
      font-weight: 700; }
    .fd-pagination__link--previous, .fd-pagination__link--next {
      padding-left: 8px;
      padding-right: 8px; }
      .fd-pagination__link--previous::before, .fd-pagination__link--next::before {
        font-family: "SAP-icons";
        font-style: normal;
        font-weight: normal;
        text-align: center;
        display: inline-block;
        text-decoration: inherit;
        text-transform: none;
        text-rendering: optimizeLegibility;
        -webkit-font-smoothing: antialiased;
        -moz-osx-font-smoothing: grayscale;
        speak: none; }
      .fd-pagination__link--previous::before, .fd-pagination__link--next::before {
        content: ""; }
      .fd-pagination__link--previous::before, .fd-pagination__link--next::before {
        font-size: 0.85714rem;
        line-height: 1; }
      [dir="rtl"] .fd-pagination__link--previous, .fd-pagination__link--previous[dir="rtl"], [dir="rtl"] .fd-pagination__link--next, .fd-pagination__link--next[dir="rtl"] {
        transform: scaleX(-1); }
    .fd-pagination__link--next {
      transform: scaleX(-1); }
      [dir="rtl"] .fd-pagination__link--next, .fd-pagination__link--next[dir="rtl"] {
        transform: scaleX(1); }
    .fd-pagination__link--more::before {
      content: "...";
      color: var(--fd-pagination-link-color-active);
      font-weight: 700; }

/*!
.fd-table
    thead
    tbody
        tr+([aria-selected])
*/
.fd-table, .docs-table {
  --fd-table-cell-spacing: var(--fd-width-gutter);
  --fd-table-border-color: var(--fd-color-neutral-2);
  --fd-table-background-color: var(--fd-color-background-2);
  --fd-table-link-color: var(--fd-color-action-1);
  --fd-table-header-color: var(--fd-color-text-3);
  --fd-table-header-background-color: var(--fd-color-neutral-1);
  font-size: 14px;
  line-height: 1.42857;
  color: var(--fd-color-text-1);
  font-family: '72', -apple-system, BlinkMacSystemFont, Segoe UI, Roboto, Helvetica Neue, Arial, sans-serif, Apple Color Emoji, Segoe UI Emoji, Segoe UI Symbol;
  width: 100%;
  max-width: 100%;
  border-collapse: collapse;
  margin-bottom: 12px;
  background-color: var(--fd-table-background-color);
  border-style: solid;
  border-width: 1px;
  border-color: var(--fd-table-border-color); }
  .fd-table:last-child, .docs-table:last-child {
    margin-bottom: 0;
    margin-right: 0; }
  .fd-table tr, .docs-table tr {
    transition: background-color 0.125s ease-in; }
    .fd-table tr:hover, .docs-table tr:hover,
    .fd-table tr .is-hover,
    .docs-table tr .is-hover {
      background-color: var(--fd-color-background-hover); }
    .fd-table tr[aria-selected="true"], .docs-table tr[aria-selected="true"], .fd-table tr.is-selected, .docs-table tr.is-selected {
      background-color: var(--fd-color-background-selected); }
      .fd-table tr[aria-selected="true"]:hover, .docs-table tr[aria-selected="true"]:hover,
      .fd-table tr[aria-selected="true"] .is-hover,
      .docs-table tr[aria-selected="true"] .is-hover, .fd-table tr.is-selected:hover, .docs-table tr.is-selected:hover,
      .fd-table tr.is-selected .is-hover,
      .docs-table tr.is-selected .is-hover {
        background-color: var(--fd-color-background-selected-hover); }
  .fd-table thead, .docs-table thead {
    font-size: 0.85714rem;
    line-height: 1.33333;
    font-weight: 400;
    color: var(--fd-table-header-color);
    background-color: var(--fd-table-header-background-color); }
    .fd-table thead tr:hover, .docs-table thead tr:hover {
      background-color: inherit; }
    .fd-table thead td, .docs-table thead td,
    .fd-table thead th,
    .docs-table thead th {
      border: none;
      font-weight: 400; }
  .fd-table tbody tr, .docs-table tbody tr {
    border-style: solid;
    border-width: 1px;
    border-color: var(--fd-table-border-color);
    border-left: none;
    border-right: none; }
  .fd-table td, .docs-table td,
  .fd-table th,
  .docs-table th {
    text-align: left;
    --fd-table-cell-spacing: calc(var(--fd-width-gutter) / 2);
    padding-left: var(--fd-table-cell-spacing);
    padding-right: var(--fd-table-cell-spacing);
    padding-top: 16px;
    padding-bottom: 16px; }
    .fd-table td:first-child, .docs-table td:first-child,
    .fd-table th:first-child,
    .docs-table th:first-child {
      padding-left: var(--fd-width-gutter); }
    .fd-table td:last-child, .docs-table td:last-child,
    .fd-table th:last-child,
    .docs-table th:last-child {
      padding-right: var(--fd-width-gutter); }
    .fd-table td .fd-dropdown__menu, .docs-table td .fd-dropdown__menu,
    .fd-table th .fd-dropdown__menu,
    .docs-table th .fd-dropdown__menu {
      min-width: auto;
      text-align: left; }
  .fd-table__sort-column:hover {
    background-color: var(--fd-color-neutral-2);
    cursor: pointer; }
  .fd-table__sort-column::after {
    content: "";
    width: 12px;
    height: 12px;
    display: inline-block;
    background: url("data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiBlbmNvZGluZz0idXRmLTgiPz48c3ZnIHZlcnNpb249IjEuMSIgaWQ9IkxheWVyXzEiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyIgeG1sbnM6eGxpbms9Imh0dHA6Ly93d3cudzMub3JnLzE5OTkveGxpbmsiIHg9IjBweCIgeT0iMHB4IiB2aWV3Qm94PSIwIDAgOS41IDExIiBzdHlsZT0iZW5hYmxlLWJhY2tncm91bmQ6bmV3IDAgMCA5LjUgMTE7IiB4bWw6c3BhY2U9InByZXNlcnZlIj48c3R5bGUgdHlwZT0idGV4dC9jc3MiPi5zdDB7ZmlsbDojNkY3Mjc1O308L3N0eWxlPjx0aXRsZT5Tb3J0IEljb248L3RpdGxlPjxkZXNjPkNyZWF0ZWQgd2l0aCBTa2V0Y2guPC9kZXNjPjxnIGlkPSJMaXN0LUVsZW1lbnRzLS0tVGlsZXNfeDJDXy1UYWJsZXNfeDJDXy1UcmVlIj48ZyBpZD0iRnVuZGFtZW50YWxfTW9kdWxhcl9VSV9MaXN0LUVsZW1lbnRfVGFibGVfRml4YWJsZS1Db2x1bW4iIHRyYW5zZm9ybT0idHJhbnNsYXRlKC0xNDguMDAwMDAwLCAtMjQ0NC4wMDAwMDApIj48ZyBpZD0iVGFibGUtQ29weS00IiB0cmFuc2Zvcm09InRyYW5zbGF0ZSg3MS4wMDAwMDAsIDIzMDIuMDAwMDAwKSI+PHBhdGggaWQ9IkFycm93LWRvd24iIGNsYXNzPSJzdDAiIGQ9Ik04MS43LDE0Mmw0LjcsNC44SDc3TDgxLjcsMTQyeiBNODEuNywxNDNsLTMuMSwzLjFoNi4yTDgxLjcsMTQzeiIvPjxwYXRoIGlkPSJBcnJvdy1kb3duXzFfIiBjbGFzcz0ic3QwIiBkPSJNODEuOCwxNTNsLTQuNy00LjhoOS40TDgxLjgsMTUzeiBNODEuOCwxNTJsMy4xLTMuMWgtNi4yTDgxLjgsMTUyeiIvPjwvZz48L2c+PC9nPjwvc3ZnPg==") no-repeat center center;
    margin: 0 12px;
    vertical-align: text-top; }
  .fd-table__sort-column--asc, .fd-table__sort-column--dsc {
    background-color: var(--fd-color-neutral-2); }
  .fd-table__sort-column--asc::after {
    background-image: url("data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiBlbmNvZGluZz0idXRmLTgiPz48c3ZnIHZlcnNpb249IjEuMSIgaWQ9IkxheWVyXzEiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyIgeG1sbnM6eGxpbms9Imh0dHA6Ly93d3cudzMub3JnLzE5OTkveGxpbmsiIHg9IjBweCIgeT0iMHB4IiB2aWV3Qm94PSIwIDAgOS41IDExIiBzdHlsZT0iZW5hYmxlLWJhY2tncm91bmQ6bmV3IDAgMCA5LjUgMTE7IiB4bWw6c3BhY2U9InByZXNlcnZlIj48c3R5bGUgdHlwZT0idGV4dC9jc3MiPi5zdDB7ZmlsbDojNkY3Mjc1O308L3N0eWxlPjx0aXRsZT5Tb3J0IEljb248L3RpdGxlPjxkZXNjPkNyZWF0ZWQgd2l0aCBTa2V0Y2guPC9kZXNjPjxnIGlkPSJMaXN0LUVsZW1lbnRzLS0tVGlsZXNfeDJDXy1UYWJsZXNfeDJDXy1UcmVlIj48ZyBpZD0iRnVuZGFtZW50YWxfTW9kdWxhcl9VSV9MaXN0LUVsZW1lbnRfVGFibGVfRml4YWJsZS1Db2x1bW4iIHRyYW5zZm9ybT0idHJhbnNsYXRlKC0xNDguMDAwMDAwLCAtMjQ0NC4wMDAwMDApIj48ZyBpZD0iVGFibGUtQ29weS00IiB0cmFuc2Zvcm09InRyYW5zbGF0ZSg3MS4wMDAwMDAsIDIzMDIuMDAwMDAwKSI+PGcgaWQ9IlRhYmxlIiB0cmFuc2Zvcm09InRyYW5zbGF0ZSgwLjAwMDAwMCwgNzAuMDAwMDAwKSI+PGcgaWQ9IkNvbHVtbi1IZWFkZXJzIiB0cmFuc2Zvcm09InRyYW5zbGF0ZSgwLjAwMDAwMCwgNTYuMDAwMDAwKSI+PGcgaWQ9IlNvcnQtSWNvbiIgdHJhbnNmb3JtPSJ0cmFuc2xhdGUoNzcuMDAwMDAwLCAxNi4wMDAwMDApIj48cGF0aCBpZD0iQXJyb3ctZG93biIgY2xhc3M9InN0MCIgZD0iTTQuNywxMUwwLDYuMmg5LjRMNC43LDExeiBNNC43LDEwbDMuMS0zLjFIMS42TDQuNywxMHoiLz48cGF0aCBpZD0iQXJyb3ctdXAiIGNsYXNzPSJzdDAiIGQ9Ik00LjcsMGw0LjcsNC44SDBMNC43LDB6Ii8+PC9nPjwvZz48L2c+PC9nPjwvZz48L2c+PC9zdmc+"); }
  .fd-table__sort-column--dsc::after {
    background-image: url("data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiBlbmNvZGluZz0idXRmLTgiPz48c3ZnIHZlcnNpb249IjEuMSIgaWQ9IkxheWVyXzEiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyIgeG1sbnM6eGxpbms9Imh0dHA6Ly93d3cudzMub3JnLzE5OTkveGxpbmsiIHg9IjBweCIgeT0iMHB4IiB2aWV3Qm94PSIwIDAgOS41IDExIiBzdHlsZT0iZW5hYmxlLWJhY2tncm91bmQ6bmV3IDAgMCA5LjUgMTE7IiB4bWw6c3BhY2U9InByZXNlcnZlIj48c3R5bGUgdHlwZT0idGV4dC9jc3MiPi5zdDB7ZmlsbDojNkY3Mjc1O308L3N0eWxlPjx0aXRsZT5Tb3J0IEljb248L3RpdGxlPjxkZXNjPkNyZWF0ZWQgd2l0aCBTa2V0Y2guPC9kZXNjPjxnIGlkPSJMaXN0LUVsZW1lbnRzLS0tVGlsZXNfeDJDXy1UYWJsZXNfeDJDXy1UcmVlIj48ZyBpZD0iRnVuZGFtZW50YWxfTW9kdWxhcl9VSV9MaXN0LUVsZW1lbnRfVGFibGVfRml4YWJsZS1Db2x1bW4iIHRyYW5zZm9ybT0idHJhbnNsYXRlKC0xNDguMDAwMDAwLCAtMjQ0NC4wMDAwMDApIj48ZyBpZD0iVGFibGUtQ29weS00IiB0cmFuc2Zvcm09InRyYW5zbGF0ZSg3MS4wMDAwMDAsIDIzMDIuMDAwMDAwKSI+PHBhdGggaWQ9IkFycm93LWRvd24iIGNsYXNzPSJzdDAiIGQ9Ik04MS43LDE0Mmw0LjcsNC44SDc3TDgxLjcsMTQyeiBNODEuNywxNDNsLTMuMSwzLjFoNi4yTDgxLjcsMTQzeiIvPjxwYXRoIGlkPSJBcnJvdy11cCIgY2xhc3M9InN0MCIgZD0iTTgxLjcsMTUzbC00LjctNC44aDkuNEw4MS43LDE1M3oiLz48L2c+PC9nPjwvZz48L3N2Zz4="); }
  .fd-table__context-menu-label {
    display: block; }
    .fd-table__context-menu-label::after {
      content: "";
      width: 12px;
      height: 12px;
      display: inline-block;
      background: url("data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiBlbmNvZGluZz0iVVRGLTgiPz48c3ZnIHdpZHRoPSIxMHB4IiBoZWlnaHQ9IjVweCIgdmlld0JveD0iMCAwIDEwIDUiIHZlcnNpb249IjEuMSIgeG1sbnM9Imh0dHA6Ly93d3cudzMub3JnLzIwMDAvc3ZnIiB4bWxuczp4bGluaz0iaHR0cDovL3d3dy53My5vcmcvMTk5OS94bGluayI+ICAgICAgICA8dGl0bGU+QXJyb3cgZG93bjwvdGl0bGU+ICAgIDxkZXNjPkNyZWF0ZWQgd2l0aCBTa2V0Y2guPC9kZXNjPiAgICA8ZGVmcz48L2RlZnM+ICAgIDxnIGlkPSJMaXN0LUVsZW1lbnRzLS0tVGlsZXMsLVRhYmxlcywtVHJlZSIgc3Ryb2tlPSJub25lIiBzdHJva2Utd2lkdGg9IjEiIGZpbGw9Im5vbmUiIGZpbGwtcnVsZT0iZXZlbm9kZCI+ICAgICAgICA8ZyBpZD0iRnVuZGFtZW50YWxfTW9kdWxhcl9VSV9MaXN0LUVsZW1lbnRfVGFibGVfRml4YWJsZS1Db2x1bW4iIHRyYW5zZm9ybT0idHJhbnNsYXRlKC0zMTEuMDAwMDAwLCAtMjQ0Ny4wMDAwMDApIiBmaWxsPSIjNkY3Mjc1Ij4gICAgICAgICAgICA8ZyBpZD0iVGFibGUtQ29weS00IiB0cmFuc2Zvcm09InRyYW5zbGF0ZSg3MS4wMDAwMDAsIDIzMDIuMDAwMDAwKSI+ICAgICAgICAgICAgICAgIDxnIGlkPSJUYWJsZSIgdHJhbnNmb3JtPSJ0cmFuc2xhdGUoMC4wMDAwMDAsIDcwLjAwMDAwMCkiPiAgICAgICAgICAgICAgICAgICAgPGcgaWQ9IkNvbHVtbi1IZWFkZXJzIiB0cmFuc2Zvcm09InRyYW5zbGF0ZSgwLjAwMDAwMCwgNTYuMDAwMDAwKSI+ICAgICAgICAgICAgICAgICAgICAgICAgPGcgaWQ9IlNvcnQtSWNvbiIgdHJhbnNmb3JtPSJ0cmFuc2xhdGUoMjQwLjAwMDAwMCwgMTYuMDAwMDAwKSI+ICAgICAgICAgICAgICAgICAgICAgICAgICAgIDxwYXRoIGQ9Ik00LjcyNjU2MjUsOCBMMCwzLjE4NzUgTDkuNDMxNjQwNjIsMy4xODc1IEw0LjcyNjU2MjUsOCBaIiBpZD0iQXJyb3ctZG93biI+PC9wYXRoPiAgICAgICAgICAgICAgICAgICAgICAgIDwvZz4gICAgICAgICAgICAgICAgICAgIDwvZz4gICAgICAgICAgICAgICAgPC9nPiAgICAgICAgICAgIDwvZz4gICAgICAgIDwvZz4gICAgPC9nPjwvc3ZnPg==") no-repeat center center;
      margin: 0 12px;
      vertical-align: text-top; }
  .fd-table th.fd-table__context-menu:hover, .docs-table th.fd-table__context-menu:hover {
    background-color: var(--fd-color-neutral-2);
    cursor: pointer; }
  .fd-table__fixed-col {
    position: absolute;
    z-index: 1; }
  .fd-table th.fd-table__fixed-col, .docs-table th.fd-table__fixed-col {
    background-color: var(--fd-color-neutral-2);
    z-index: 2;
    box-shadow: 2px 0 0 0 var(--fd-table-border-color); }
  .fd-table td.fd-table__fixed-col, .docs-table td.fd-table__fixed-col {
    background-color: var(--fd-color-background-2);
    box-shadow: 2px 0 0 0 var(--fd-table-border-color); }
  .fd-table--fixed-wrapper {
    position: relative; }
  .fd-table--fixed {
    overflow-x: scroll;
    padding-left: 200px; }
    .fd-table--fixed td {
      min-width: 200px; }
  .fd-table--no-borders {
    border: none; }
    .fd-table--no-borders tbody tr {
      border: none; }
  .fd-table--striped tbody tr:nth-child(even) {
    background-color: var(--fd-color-background-hover); }

/*!
.fd-tabs+()
    .fd-tabs__item?
    .fd-tabs__link+((.is-selected|[aria-selected=true]),(.is-disabled|[aria-disabled=true]))
.fd-tabs__panel+([aria-expanded]|.is-expanded)
*/
.fd-tabs {
  --fd-tabs-border-color: var(--fd-color-neutral-3);
  --fd-tabs-background-color: var(--fd-color-background-2);
  --fd-tabs-link-color: var(--fd-color-text-2);
  --fd-tabs-link-border-color: var(--fd-color-action-1);
  font-size: 14px;
  line-height: 1.42857;
  color: var(--fd-color-text-1);
  font-family: '72', -apple-system, BlinkMacSystemFont, Segoe UI, Roboto, Helvetica Neue, Arial, sans-serif, Apple Color Emoji, Segoe UI Emoji, Segoe UI Symbol;
  background-color: var(--fd-tabs-background-color);
  display: flex;
  flex-wrap: wrap;
  padding-left: 0;
  margin-bottom: 12px;
  list-style: none;
  border-bottom-style: solid;
  border-bottom-width: 1px;
  border-bottom-color: var(--fd-tabs-background-color); }
  .fd-tabs__item {
    padding: 0 16px; }
  .fd-tabs__link {
    display: block;
    position: relative;
    padding: 16px 0;
    font-size: 1rem;
    line-height: 1.42857;
    font-weight: 400;
    cursor: pointer;
    color: var(--fd-tabs-link-color); }
    .fd-tabs__link:link {
      color: var(--fd-tabs-link-color); }
    .fd-tabs__link::after {
      transition: all 0.125s ease-in;
      content: "";
      position: absolute;
      bottom: 0;
      left: 0;
      display: inline-block;
      height: 3px;
      width: 100%;
      background-color: transparent;
      border-radius: 4px 4px 0 0; }
    .fd-tabs__link:hover,
    .fd-tabs__link .is-hover {
      color: var(--fd-color-action-selected); }
    .fd-tabs__link[aria-selected="true"], .fd-tabs__link.is-selected {
      color: var(--fd-color-action-1); }
      .fd-tabs__link[aria-selected="true"]::after, .fd-tabs__link.is-selected::after {
        background-color: var(--fd-tabs-link-border-color); }
    .fd-tabs__link[aria-disabled="true"], .fd-tabs__link.is-disabled, .fd-tabs__link:disabled {
      color: var(--fd-color-action-disabled);
      cursor: not-allowed; }
  .fd-tabs__panel[aria-expanded="false"] {
    display: none; }
  .fd-tabs__panel.is-expanded, .fd-tabs__panel[aria-expanded="true"] {
    display: block; }

/*!
.fd-modal
    .fd-modal__header
        .fd-form__title
    .fd-form__body
    .fd-form__footer-items
      .fd-modal__button-primary
      .fd-modal__button-secondary
*/
.fd-modal {
  --fd-modal-background-color: var(--fd-color-background-2);
  --fd-modal-border-color: var(--fd-color-neutral-2);
  --fd-modal-padding-x: var(--fd-width-gutter);
  font-size: 14px;
  line-height: 1.42857;
  color: var(--fd-color-text-1);
  font-family: '72', -apple-system, BlinkMacSystemFont, Segoe UI, Roboto, Helvetica Neue, Arial, sans-serif, Apple Color Emoji, Segoe UI Emoji, Segoe UI Symbol;
  max-width: 460px; }
  .fd-modal__content {
    border-radius: 4px;
    background-color: var(--fd-modal-background-color); }
  .fd-modal__header, .fd-modal__body, .fd-modal__footer {
    padding-left: var(--fd-modal-padding-x);
    padding-right: var(--fd-modal-padding-x);
    padding-top: 16px;
    padding-bottom: 16px; }
  .fd-modal__header {
    position: relative;
    border-bottom-style: solid;
    border-bottom-width: 1px;
    border-bottom-color: var(--fd-modal-border-color); }
  .fd-modal__title {
    font-size: 1.14286rem;
    line-height: 1.25;
    font-weight: 400;
    margin-bottom: 0;
    padding-right: 36px; }
    [dir="rtl"] .fd-modal__title, .fd-modal__title[dir="rtl"] {
      padding-left: 36px;
      padding-right: 0; }
  .fd-modal__close {
    position: absolute;
    right: 8px;
    top: 8px;
    width: 36px;
    height: 36px; }
    [dir="rtl"] .fd-modal__close, .fd-modal__close[dir="rtl"] {
      left: 8px;
      right: auto; }
    .fd-modal__close::before {
      font-family: "SAP-icons";
      font-style: normal;
      font-weight: normal;
      text-align: center;
      display: inline-block;
      text-decoration: inherit;
      text-transform: none;
      text-rendering: optimizeLegibility;
      -webkit-font-smoothing: antialiased;
      -moz-osx-font-smoothing: grayscale;
      speak: none; }
    .fd-modal__close::before {
      content: ""; }
    .fd-modal__close::before {
      font-size: 1.42857rem;
      line-height: 1; }
    .fd-modal__close:focus, .fd-modal__close.is-focus {
      box-shadow: 0 0 0 1px var(--fd-color-action-focus); }
  .fd-modal__body {
    max-height: calc(100vh - 60px - 68px);
    overflow-y: auto; }
    .fd-modal__body > p {
      padding: 0; }
  .fd-modal__footer {
    text-align: right;
    border-top-style: solid;
    border-top-width: 1px;
    border-top-color: var(--fd-modal-border-color); }
    [dir="rtl"] .fd-modal__footer, .fd-modal__footer[dir="rtl"] {
      text-align: left; }

/*!
.fd-tree+(--header)
    .fd-tree__group+(--sublevel-1...-6, ([aria-hidden] | .is-hidden))
    .fd-tree__item
        .fd-tree__row+(--header, ([aria-selected] | .is-selected))
            .fd-tree__col+(--control, --actions)
                .fd-tree__control+([aria-pressed] | .is-pressed)
*/
.fd-tree {
  --fd-tree-cell-spacing: var(--fd-width-gutter);
  --fd-tree-border-color: var(--fd-color-neutral-2);
  --fd-tree-background-color: var(--fd-color-background-2);
  --fd-tree-link-color: var(--fd-color-action-1);
  --fd-tree-header-color: var(--fd-color-text-3);
  --fd-tree-header-background-color: var(--fd-color-neutral-2);
  font-size: 14px;
  line-height: 1.42857;
  color: var(--fd-color-text-1);
  font-family: '72', -apple-system, BlinkMacSystemFont, Segoe UI, Roboto, Helvetica Neue, Arial, sans-serif, Apple Color Emoji, Segoe UI Emoji, Segoe UI Symbol;
  position: relative;
  width: 100%;
  max-width: 100%;
  background-color: var(--fd-tree-background-color);
  border-bottom-style: solid;
  border-bottom-width: 0;
  border-bottom-color: var(--fd-tree-border-color);
  padding-left: 0;
  padding-right: 0;
  margin-bottom: 12px;
  margin-left: 0; }
  .fd-tree:last-child {
    margin-bottom: 0;
    margin-right: 0; }
  .fd-tree:last-child {
    margin-bottom: 0; }
  .fd-tree--header {
    border-bottom: 0;
    border-top-style: solid;
    border-top-width: 0;
    border-top-color: var(--fd-tree-border-color);
    margin-bottom: 0;
    background-color: var(--fd-tree-header-background-color); }
  .fd-tree__group {
    transition: opacity 0.125s linear;
    max-height: auto;
    opacity: 1;
    margin-bottom: 0;
    margin-left: 0;
    padding-left: 0;
    padding-right: 0; }
    .fd-tree__group.is-hidden, .fd-tree__group[aria-hidden="true"] {
      max-height: 0;
      opacity: 0;
      overflow: hidden; }
  .fd-tree__item {
    border-top-style: solid;
    border-top-width: 0;
    border-top-color: var(--fd-tree-border-color);
    margin-bottom: 0;
    list-style: none; }
  .fd-tree__row {
    padding-left: var(--fd-tree-cell-spacing);
    padding-right: var(--fd-tree-cell-spacing);
    padding-top: 0;
    padding-bottom: 0;
    display: flex;
    align-items: center;
    position: relative;
    transition: background-color 0.125s ease-in; }
    .fd-tree__row:hover,
    .fd-tree__row .is-hover {
      background-color: var(--fd-color-background-hover); }
    .fd-tree__row--header {
      font-size: 0.85714rem;
      line-height: 1.33333;
      font-weight: 400;
      color: var(--fd-tree-header-color);
      background-color: var(--fd-tree-header-background-color);
      text-transform: uppercase; }
      .fd-tree__row--header:hover,
      .fd-tree__row--header .is-hover {
        background-color: initial; }
    .fd-tree__row[aria-selected="true"], .fd-tree__row.is-selected {
      background-color: rgba(10, 110, 209, 0.07);
      background-color: var(--fd-color-background-selected); }
  .fd-tree__col {
    flex: 1;
    padding: 12px 0;
    padding-left: 30px; }
    [dir="rtl"] .fd-tree__col, .fd-tree__col[dir="rtl"] {
      padding-left: 0;
      padding-right: 30px; }
    .fd-tree__col--control {
      flex: auto;
      width: 20%; }
      .fd-tree__group--sublevel-1 .fd-tree__col--control {
        padding-left: 60px; }
        [dir="rtl"] .fd-tree__group--sublevel-1 .fd-tree__col--control, .fd-tree__group--sublevel-1 .fd-tree__col--control[dir="rtl"] {
          padding-left: 0;
          padding-right: 60px; }
      .fd-tree__group--sublevel-2 .fd-tree__col--control {
        padding-left: 90px; }
        [dir="rtl"] .fd-tree__group--sublevel-2 .fd-tree__col--control, .fd-tree__group--sublevel-2 .fd-tree__col--control[dir="rtl"] {
          padding-left: 0;
          padding-right: 90px; }
      .fd-tree__group--sublevel-3 .fd-tree__col--control {
        padding-left: 120px; }
        [dir="rtl"] .fd-tree__group--sublevel-3 .fd-tree__col--control, .fd-tree__group--sublevel-3 .fd-tree__col--control[dir="rtl"] {
          padding-left: 0;
          padding-right: 120px; }
      .fd-tree__group--sublevel-4 .fd-tree__col--control {
        padding-left: 150px; }
        [dir="rtl"] .fd-tree__group--sublevel-4 .fd-tree__col--control, .fd-tree__group--sublevel-4 .fd-tree__col--control[dir="rtl"] {
          padding-left: 0;
          padding-right: 150px; }
      .fd-tree__group--sublevel-5 .fd-tree__col--control {
        padding-left: 180px; }
        [dir="rtl"] .fd-tree__group--sublevel-5 .fd-tree__col--control, .fd-tree__group--sublevel-5 .fd-tree__col--control[dir="rtl"] {
          padding-left: 0;
          padding-right: 180px; }
      .fd-tree__group--sublevel-6 .fd-tree__col--control {
        padding-left: 210px; }
        [dir="rtl"] .fd-tree__group--sublevel-6 .fd-tree__col--control, .fd-tree__group--sublevel-6 .fd-tree__col--control[dir="rtl"] {
          padding-left: 0;
          padding-right: 210px; }
      .fd-tree__group--sublevel-7 .fd-tree__col--control {
        padding-left: 240px; }
        [dir="rtl"] .fd-tree__group--sublevel-7 .fd-tree__col--control, .fd-tree__group--sublevel-7 .fd-tree__col--control[dir="rtl"] {
          padding-left: 0;
          padding-right: 240px; }
      .fd-tree__group--sublevel-8 .fd-tree__col--control {
        padding-left: 270px; }
        [dir="rtl"] .fd-tree__group--sublevel-8 .fd-tree__col--control, .fd-tree__group--sublevel-8 .fd-tree__col--control[dir="rtl"] {
          padding-left: 0;
          padding-right: 270px; }
    .fd-tree__col--actions {
      padding-top: 0;
      padding-bottom: 0;
      text-align: right; }
      [dir="rtl"] .fd-tree__col--actions, .fd-tree__col--actions[dir="rtl"] {
        text-align: left; }
  .fd-tree__control {
    display: inline-block;
    margin: 0;
    padding: 0;
    font-smoothing: antialiased;
    /* stylelint-disable-line property-no-unknown */
    appearance: none;
    outline: 0;
    border: 0;
    display: inline-block;
    text-decoration: none;
    cursor: pointer;
    user-select: none;
    vertical-align: middle;
    white-space: nowrap;
    background-color: transparent;
    border-radius: 4px;
    position: absolute;
    top: calc(50% - 18px/2);
    margin: -8px 12px 0 -36px;
    width: 34px;
    height: 34px;
    transform: rotate(180deg);
    vertical-align: middle;
    transition: transform 0.125s linear;
    color: var(--fd-color-action-1); }
    .fd-tree__control::before {
      font-family: "SAP-icons";
      font-style: normal;
      font-weight: normal;
      text-align: center;
      display: inline-block;
      text-decoration: inherit;
      text-transform: none;
      text-rendering: optimizeLegibility;
      -webkit-font-smoothing: antialiased;
      -moz-osx-font-smoothing: grayscale;
      speak: none; }
    .fd-tree__control::before {
      content: ""; }
    .fd-tree__control::before {
      font-size: 14px;
      line-height: 1.42857; }
    .fd-tree__control:focus, .fd-tree__control.is-focus {
      box-shadow: 0 0 0 1px var(--fd-color-action-focus); }
    [dir="rtl"] .fd-tree__control, .fd-tree__control[dir="rtl"] {
      margin-left: 12px;
      margin-right: -30px;
      transform: rotate(0deg); }
    .fd-tree__control[aria-pressed="true"], .fd-tree__control.is-pressed {
      transform: rotate(270deg); }

/*!
.fd-list-group
  .fd-list-group__item
      .fd-list-group__action
*/
.fd-list-group {
  --fd-list-group-background-color: transparent;
  font-size: 14px;
  line-height: 1.42857;
  color: var(--fd-color-text-1);
  font-family: '72', -apple-system, BlinkMacSystemFont, Segoe UI, Roboto, Helvetica Neue, Arial, sans-serif, Apple Color Emoji, Segoe UI Emoji, Segoe UI Symbol;
  margin-left: 0; }
  .fd-list-group__item {
    list-style: none;
    padding: 10px 16px;
    display: flex;
    position: relative;
    background-color: var(--fd-list-group-background-color);
    transition: background-color 0.125s ease-in; }
    .fd-list-group__item:hover {
      --fd-list-group-background-color: var(--fd-color-background-hover); }
  .fd-list-group__action {
    flex: 1;
    text-align: right;
    position: relative;
    display: inline-block;
    max-height: 40px;
    padding-top: 0;
    top: -10px;
    margin-bottom: -20px;
    right: -16px; }

/*!
.fd-tooltip
    .fd-tooltip__content+(left, right, bottom-left, bottom-right)
*/
.fd-inline-help {
  --fd-inline-help-color: var(--fd-color-text-1);
  --fd-inline-help-background-color: var(--fd-color-background-2);
  --fd-inline-help-icon-color: var(--fd-color-text-5);
  --fd-inline-help-icon-background-color: var(--fd-color-status-4);
  font-size: 14px;
  line-height: 1.42857;
  color: var(--fd-color-text-1);
  font-family: '72', -apple-system, BlinkMacSystemFont, Segoe UI, Roboto, Helvetica Neue, Arial, sans-serif, Apple Color Emoji, Segoe UI Emoji, Segoe UI Symbol;
  position: relative;
  display: inline-block;
  width: 18px;
  height: 18px;
  top: 3px; }
  .fd-inline-help::before {
    content: "?";
    width: 18px;
    height: 18px;
    font-style: normal;
    position: absolute;
    left: 0;
    border-radius: 50%;
    color: var(--fd-inline-help-icon-color);
    background-color: var(--fd-inline-help-icon-background-color);
    text-align: center; }
  .fd-inline-help__content {
    font-size: 0.85714rem;
    line-height: 1.33333;
    font-weight: 400;
    background-color: var(--fd-inline-help-background-color);
    padding: 12px;
    display: block;
    position: absolute;
    color: var(--fd-inline-help-color);
    top: 30px;
    right: -12px;
    min-width: 350px;
    transition: opacity 0.125s ease-in;
    text-align: left;
    z-index: 1;
    border-radius: 5px;
    visibility: hidden;
    opacity: 0;
    border-width: 1px;
    border-style: solid;
    border-color: var(--fd-color-status-4);
    filter: drop-shadow(rgba(0, 0, 0, 0.1) 0 2px 10px); }
    .fd-inline-help__content::before {
      height: 0;
      width: 0;
      border-style: solid;
      border-width: 0 6.5px 8px 6.5px;
      border-bottom-color: var(--fd-color-status-4);
      border-left-color: transparent;
      border-right-color: transparent;
      content: "";
      position: absolute;
      top: -8px;
      right: 10px; }
    .fd-inline-help__content::after {
      height: 0;
      width: 0;
      border-style: solid;
      border-width: 0 6.5px 8px 6.5px;
      border-bottom-color: var(--fd-color-background-2);
      border-left-color: transparent;
      border-right-color: transparent;
      content: "";
      position: absolute;
      top: -6px;
      right: 10px; }
    .fd-inline-help__content--right {
      top: -12px;
      left: 30px; }
      .fd-inline-help__content--right::before {
        top: 16px;
        left: -10px;
        transform: rotate(-90deg); }
      .fd-inline-help__content--right::after {
        top: 16px;
        left: -9px;
        transform: rotate(-90deg); }
      [dir="rtl"] .fd-inline-help__content--right, .fd-inline-help__content--right[dir="rtl"] {
        left: auto;
        right: 30px; }
        [dir="rtl"] .fd-inline-help__content--right::before, .fd-inline-help__content--right[dir="rtl"]::before {
          left: auto;
          right: -10px;
          transform: rotate(-270deg); }
        [dir="rtl"] .fd-inline-help__content--right::after, .fd-inline-help__content--right[dir="rtl"]::after {
          left: auto;
          right: -9px;
          transform: rotate(-270deg); }
    .fd-inline-help__content--left {
      top: -12px;
      right: 30px; }
      .fd-inline-help__content--left::before {
        top: 16px;
        right: -10px;
        transform: rotate(90deg); }
      .fd-inline-help__content--left::after {
        top: 16px;
        right: -9px;
        transform: rotate(90deg); }
      [dir="rtl"] .fd-inline-help__content--left, .fd-inline-help__content--left[dir="rtl"] {
        right: auto;
        left: 30px; }
        [dir="rtl"] .fd-inline-help__content--left::before, .fd-inline-help__content--left[dir="rtl"]::before {
          right: auto;
          left: -10px;
          transform: rotate(270deg); }
        [dir="rtl"] .fd-inline-help__content--left::after, .fd-inline-help__content--left[dir="rtl"]::after {
          right: auto;
          left: -9px;
          transform: rotate(270deg); }
    .fd-inline-help__content--bottom-right {
      left: -8px; }
      [dir="rtl"] .fd-inline-help__content--bottom-right, .fd-inline-help__content--bottom-right[dir="rtl"] {
        left: auto;
        right: -8px; }
      .fd-inline-help__content--bottom-right::before {
        top: -8px;
        left: 11.2px; }
      .fd-inline-help__content--bottom-right::after {
        top: -7px;
        left: 11px; }
    .fd-inline-help__content--bottom-left {
      right: -8px; }
      .fd-inline-help__content--bottom-left::before {
        top: -8px;
        right: 10px; }
      .fd-inline-help__content--bottom-left::after {
        top: -7px; }
      [dir="rtl"] .fd-inline-help__content--bottom-left, .fd-inline-help__content--bottom-left[dir="rtl"] {
        right: auto;
        left: -8px; }
        [dir="rtl"] .fd-inline-help__content--bottom-left::before, .fd-inline-help__content--bottom-left[dir="rtl"]::before {
          right: auto;
          left: 10px; }
        [dir="rtl"] .fd-inline-help__content--bottom-left::after, .fd-inline-help__content--bottom-left[dir="rtl"]::after {
          right: auto;
          left: 10px; }
    .fd-inline-help__content--bottom-center {
      right: -162px; }
      .fd-inline-help__content--bottom-center::before {
        top: -8px;
        right: 164px; }
      .fd-inline-help__content--bottom-center::after {
        top: -7px;
        right: 164px; }
  .fd-inline-help:hover .fd-inline-help__content {
    visibility: visible;
    opacity: 1;
    overflow: visible; }

/*!
.fd-nav+(--vertical)
    .fd-nav__item
    .fd-nav__link+((.is-selected|[aria-selected=true]),(.is-disabled|[aria-disabled=true]))
*/
.fd-nav {
  font-size: 14px;
  line-height: 1.42857;
  color: var(--fd-color-text-1);
  font-family: '72', -apple-system, BlinkMacSystemFont, Segoe UI, Roboto, Helvetica Neue, Arial, sans-serif, Apple Color Emoji, Segoe UI Emoji, Segoe UI Symbol;
  display: flex;
  flex-wrap: wrap;
  padding: 0;
  margin-bottom: 0;
  list-style: none; }
  .fd-nav--vertical {
    flex-direction: column; }
  .fd-nav__link {
    display: block;
    padding: 12px 16px; }
    .fd-nav__link[aria-selected="true"], .fd-nav__link.is-selected {
      color: var(--fd-color-text-1); }

/*!
.fd-tabs+()
    .fd-tabs__item?
    .fd-tabs__link+((.is-selected|[aria-selected=true]),(.is-disabled|[aria-disabled=true]))
.fd-tabs__panel+([aria-expanded]|.is-expanded)
*/
.fd-tabs {
  --fd-tabs-border-color: var(--fd-color-neutral-3);
  --fd-tabs-background-color: var(--fd-color-background-2);
  --fd-tabs-link-color: var(--fd-color-text-2);
  --fd-tabs-link-border-color: var(--fd-color-action-1);
  font-size: 14px;
  line-height: 1.42857;
  color: var(--fd-color-text-1);
  font-family: '72', -apple-system, BlinkMacSystemFont, Segoe UI, Roboto, Helvetica Neue, Arial, sans-serif, Apple Color Emoji, Segoe UI Emoji, Segoe UI Symbol;
  background-color: var(--fd-tabs-background-color);
  display: flex;
  flex-wrap: wrap;
  padding-left: 0;
  margin-bottom: 12px;
  list-style: none;
  border-bottom-style: solid;
  border-bottom-width: 1px;
  border-bottom-color: var(--fd-tabs-background-color); }
  .fd-tabs__item {
    padding: 0 16px; }
  .fd-tabs__link {
    display: block;
    position: relative;
    padding: 16px 0;
    font-size: 1rem;
    line-height: 1.42857;
    font-weight: 400;
    cursor: pointer;
    color: var(--fd-tabs-link-color); }
    .fd-tabs__link:link {
      color: var(--fd-tabs-link-color); }
    .fd-tabs__link::after {
      transition: all 0.125s ease-in;
      content: "";
      position: absolute;
      bottom: 0;
      left: 0;
      display: inline-block;
      height: 3px;
      width: 100%;
      background-color: transparent;
      border-radius: 4px 4px 0 0; }
    .fd-tabs__link:hover,
    .fd-tabs__link .is-hover {
      color: var(--fd-color-action-selected); }
    .fd-tabs__link[aria-selected="true"], .fd-tabs__link.is-selected {
      color: var(--fd-color-action-1); }
      .fd-tabs__link[aria-selected="true"]::after, .fd-tabs__link.is-selected::after {
        background-color: var(--fd-tabs-link-border-color); }
    .fd-tabs__link[aria-disabled="true"], .fd-tabs__link.is-disabled, .fd-tabs__link:disabled {
      color: var(--fd-color-action-disabled);
      cursor: not-allowed; }
  .fd-tabs__panel[aria-expanded="false"] {
    display: none; }
  .fd-tabs__panel.is-expanded, .fd-tabs__panel[aria-expanded="true"] {
    display: block; }

/*!
.fd-toggle+(--no-border)
    .fd-toggle__content+()
    .fd-toggle__title+()
*/
.fd-toggle {
  font-size: 14px;
  line-height: 1.42857;
  color: var(--fd-color-text-1);
  font-family: '72', -apple-system, BlinkMacSystemFont, Segoe UI, Roboto, Helvetica Neue, Arial, sans-serif, Apple Color Emoji, Segoe UI Emoji, Segoe UI Symbol;
  position: relative;
  display: inline-block;
  width: 48px;
  height: 20px; }
  .fd-toggle input {
    opacity: 0;
    width: 0;
    height: 0; }
    .fd-toggle input::before, .fd-toggle input::after {
      display: none; }
    .fd-toggle input:hover {
      border-color: transparent; }
    .fd-toggle input:active, .fd-toggle input:focus {
      border-color: transparent; }
    .fd-toggle input[disabled], .fd-toggle input.is-disabled, .fd-toggle input[aria-disabled="true"] {
      opacity: 1;
      background-color: #ededee; }
      .fd-toggle input[disabled] + .fd-toggle__switch, .fd-toggle input.is-disabled + .fd-toggle__switch, .fd-toggle input[aria-disabled="true"] + .fd-toggle__switch {
        opacity: 1;
        border-color: #ededee;
        box-shadow: none;
        background-color: #ededee;
        pointer-events: none; }
    .fd-toggle input:checked[disabled] + .fd-toggle__switch, .fd-toggle input:checked.is-disabled + .fd-toggle__switch, .fd-toggle input:checked[aria-disabled="true"] + .fd-toggle__switch {
      border-color: transparent;
      background-color: rgba(10, 110, 209, 0.4);
      pointer-events: none; }
    .fd-toggle input:checked[disabled] + .fd-toggle__switch::before, .fd-toggle input:checked.is-disabled + .fd-toggle__switch::before, .fd-toggle input:checked[aria-disabled="true"] + .fd-toggle__switch::before {
      border-color: transparent;
      background-color: #d8ebfd; }
  .fd-toggle__switch {
    position: absolute;
    cursor: pointer;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    background-color: var(--fd-color-neutral-3);
    -webkit-transition: 0.4s;
    transition: 0.4s;
    border-radius: 34px; }
  .fd-toggle__switch::before {
    position: absolute;
    content: "";
    height: 28px;
    width: 28px;
    left: 0;
    top: -5px;
    background-color: var(--fd-color-background-2);
    border-style: solid;
    border-width: 1px;
    border-color: var(--fd-color-neutral-3);
    -webkit-transition: 0.4s;
    transition: 0.4s;
    border-radius: 50%; }
  input:checked + .fd-toggle__switch {
    background-color: #0a6ed1; }
  input:checked + .fd-toggle__switch::before {
    -webkit-transform: translateX(26px);
    -ms-transform: translateX(26px);
    transform: translateX(26px);
    background-color: var(--fd-color-action-selected);
    border-color: var(--fd-color-action-selected);
    pointer-events: none;
    left: -6px; }
  .fd-toggle--xs {
    height: 14px;
    width: 36px; }
    .fd-toggle--xs .fd-toggle__switch::before {
      height: 20px;
      width: 20px;
      top: -3px; }
    .fd-toggle--xs input:checked + .fd-toggle__switch::before {
      left: -10px; }
  .fd-toggle--s {
    height: 17px;
    width: 40px; }
    .fd-toggle--s .fd-toggle__switch::before {
      height: 24px;
      width: 24px;
      top: -4px; }
    .fd-toggle--s input:checked + .fd-toggle__switch::before {
      left: -10px; }
  .fd-toggle--l {
    height: 22px;
    width: 56px; }
    .fd-toggle--l .fd-toggle__switch::before {
      height: 32px;
      width: 32px;
      top: -6px; }
    .fd-toggle--l input:checked + .fd-toggle__switch::before {
      left: -2px; }

/*!
.fd-spinner+(.is-hidden|[aria-hidden=true])

Inspired by line scale spinner from Load Awesome v1.1.0 (http://github.danielcardoso.net/load-awesome/)
* Copyright 2015 Daniel Cardoso <@DanielCardoso>
* Licensed under MIT
*/
.fd-spinner {
  --fd-spinner-background-color: var(--fd-color-action-1);
  font-size: 14px;
  line-height: 1.42857;
  color: var(--fd-color-text-1);
  font-family: '72', -apple-system, BlinkMacSystemFont, Segoe UI, Roboto, Helvetica Neue, Arial, sans-serif, Apple Color Emoji, Segoe UI Emoji, Segoe UI Symbol;
  position: relative;
  width: 29px;
  height: 40px;
  display: flex;
  justify-content: space-between;
  margin: 0 auto; }
  .fd-spinner.is-hidden, .fd-spinner[aria-hidden="true"] {
    display: none; }
  .is-busy,
  [aria-busy="true"] {
    position: relative;
    min-height: 40px; }
    .is-busy::before,
    [aria-busy="true"]::before {
      position: absolute;
      background-color: var(--fd-color-background-1);
      opacity: 0.95;
      top: 0;
      right: 0;
      bottom: 0;
      left: 0;
      z-index: 1;
      content: ""; }
    .is-busy .fd-spinner,
    [aria-busy="true"] .fd-spinner {
      position: absolute;
      z-index: 2;
      left: calc(50% - 29px/2);
      top: calc(50% - 40px/2); }
  .fd-spinner::before, .fd-spinner::after {
    content: "";
    position: relative;
    width: 5px;
    height: 100%;
    background-color: var(--fd-spinner-background-color); }
  .fd-spinner::before {
    animation: line-scale 1s infinite ease;
    animation-delay: -1s; }
  .fd-spinner div::before, .fd-spinner div::after {
    content: "";
    position: absolute;
    width: 5px;
    height: 100%;
    background-color: var(--fd-spinner-background-color); }
  .fd-spinner div::before {
    left: 8px;
    animation: line-scale 1s infinite ease;
    animation-delay: -0.9s; }
  .fd-spinner div::after {
    right: 8px;
    animation: line-scale 1s infinite ease;
    animation-delay: -0.8s; }
  .fd-spinner::after {
    animation: line-scale 1s infinite ease;
    animation-delay: -0.7s; }

@keyframes line-scale {
  0%,
  40%,
  100% {
    transform: scaleY(0.4); }
  80% {
    transform: scaleY(1); } }

/*!
.fd-image+((--circle), (--s|--m|--l))
*/
[class*="fd-image"] {
  font-size: 14px;
  line-height: 1.42857;
  color: var(--fd-color-text-1);
  font-family: '72', -apple-system, BlinkMacSystemFont, Segoe UI, Roboto, Helvetica Neue, Arial, sans-serif, Apple Color Emoji, Segoe UI Emoji, Segoe UI Symbol;
  display: inline-block;
  vertical-align: middle;
  background-repeat: no-repeat;
  background-size: cover;
  background-position: 50%;
  border-radius: 4px; }

.fd-image--s {
  width: 24px;
  height: 24px;
  max-width: 24px;
  max-height: 24px;
  min-width: 24px;
  min-height: 24px; }

.fd-image--m {
  width: 36px;
  height: 36px;
  max-width: 36px;
  max-height: 36px;
  min-width: 36px;
  min-height: 36px; }

.fd-image--l {
  width: 48px;
  height: 48px;
  max-width: 48px;
  max-height: 48px;
  min-width: 48px;
  min-height: 48px; }

.fd-image--circle {
  border-radius: 50%; }

/*!
.fd-global-nav+(--no-border)
    .fd-global-nav__content+()
    .fd-global-nav__title+()
*/
.fd-global-nav {
  font-size: 14px;
  line-height: 1.42857;
  color: var(--fd-color-text-1);
  font-family: '72', -apple-system, BlinkMacSystemFont, Segoe UI, Roboto, Helvetica Neue, Arial, sans-serif, Apple Color Emoji, Segoe UI Emoji, Segoe UI Symbol;
  border-bottom: solid 1px #eeeeef;
  background: white;
  height: 50px;
  display: flex;
  color: #51555a;
  position: relative; }
  .fd-global-nav__group {
    min-height: 50px; }
    .fd-global-nav__group--left {
      position: absolute;
      left: 0;
      top: 0; }
    .fd-global-nav__group--right {
      position: absolute;
      right: 0;
      top: 0;
      display: flex;
      align-items: center; }
  .fd-global-nav__side-menu, .fd-global-nav__logo, .fd-global-nav__product-name {
    display: inline-block;
    height: 50px;
    vertical-align: middle; }
  .fd-global-nav__side-menu {
    display: inline-flex;
    align-items: center; }
  .fd-global-nav__logo {
    padding-left: 16px;
    font-weight: bold;
    background-image: url(data:image/svg+xml;base64,PHN2ZyBpZD0iTGF5ZXJfMSIgZGF0YS1uYW1lPSJMYXllciAxIiB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHZpZXdCb3g9IjAgMCA0MTIuMzggMjA0Ij48ZGVmcz48c3R5bGU+LmNscy0xLC5jbHMtMntmaWxsLXJ1bGU6ZXZlbm9kZH0uY2xzLTF7ZmlsbDp1cmwoI2xpbmVhci1ncmFkaWVudCl9LmNscy0ye2ZpbGw6I2ZmZn08L3N0eWxlPjxsaW5lYXJHcmFkaWVudCBpZD0ibGluZWFyLWdyYWRpZW50IiB4MT0iMjA2LjE5IiB4Mj0iMjA2LjE5IiB5Mj0iMjA0IiBncmFkaWVudFVuaXRzPSJ1c2VyU3BhY2VPblVzZSI+PHN0b3Agb2Zmc2V0PSIwIiBzdG9wLWNvbG9yPSIjMDBiOGYxIi8+PHN0b3Agb2Zmc2V0PSIuMDIiIHN0b3AtY29sb3I9IiMwMWI2ZjAiLz48c3RvcCBvZmZzZXQ9Ii4zMSIgc3RvcC1jb2xvcj0iIzBkOTBkOSIvPjxzdG9wIG9mZnNldD0iLjU4IiBzdG9wLWNvbG9yPSIjMTc3NWM4Ii8+PHN0b3Agb2Zmc2V0PSIuODIiIHN0b3AtY29sb3I9IiMxYzY1YmYiLz48c3RvcCBvZmZzZXQ9IjEiIHN0b3AtY29sb3I9IiMxZTVmYmIiLz48L2xpbmVhckdyYWRpZW50PjwvZGVmcz48dGl0bGU+U0FQX2dyYWRfUl9zY3JuX1plaWNoZW5mbMOkY2hlIDE8L3RpdGxlPjxwYXRoIGNsYXNzPSJjbHMtMSIgZD0iTTAgMjA0aDIwOC40MUw0MTIuMzggMEgwdjIwNCIvPjxwYXRoIGNsYXNzPSJjbHMtMiIgZD0iTTI0NC43MyAzOC4zNmgtNDAuNnY5Ni41MmwtMzUuNDYtOTYuNTVoLTM1LjE2bC0zMC4yNyA4MC43MkMxMDAgOTguNyA3OSA5MS42NyA2Mi40IDg2LjQgNTEuNDYgODIuODkgMzkuODUgNzcuNzIgNDAgNzJjLjA5LTQuNjggNi4yMy05IDE4LjM4LTguMzggOC4xNy40MyAxNS4zNyAxLjA5IDI5LjcxIDhsMTQuMS0yNC41NUM4OS4wNiA0MC40MiA3MSAzNi4yMSA1Ni4xNyAzNi4xOWgtLjA5Yy0xNy4yOCAwLTMxLjY4IDUuNi00MC42IDE0LjgzQTM0LjIzIDM0LjIzIDAgMCAwIDUuNzcgNzQuN0M1LjU0IDg3LjE1IDEwLjExIDk2IDE5LjcxIDEwM2M4LjEgNS45NCAxOC40NiA5Ljc5IDI3LjYgMTIuNjIgMTEuMjcgMy40OSAyMC40NyA2LjUzIDIwLjM2IDEzQTkuNTcgOS41NyAwIDAgMSA2NSAxMzVjLTIuODEgMi45LTcuMTMgNC0xMy4wOSA0LjEtMTEuNDkuMjQtMjAtMS41Ni0zMy42MS05LjU5TDUuNzcgMTU0LjQyYTkzLjc3IDkzLjc3IDAgMCAwIDQ2IDEyLjIyaDIuMTFjMTQuMjQtLjI1IDI1Ljc0LTQuMzEgMzQuOTItMTEuNzEuNTMtLjQxIDEtLjg0IDEuNDktMS4yOGwtNC4xMiAxMC44NUgxMjNsNi4xOS0xOC44MmE2Ny40NiA2Ny40NiAwIDAgMCAyMS42OCAzLjQzIDY4LjMzIDY4LjMzIDAgMCAwIDIxLjE2LTMuMjVsNiAxOC42NGg2MC4xNHYtMzloMTMuMTFjMzEuNzEgMCA1MC40Ni0xNi4xNSA1MC40Ni00My4yIDAtMzAuMTEtMTguMjItNDMuOTQtNTcuMDEtNDMuOTR6TTE1MC45MSAxMjFhMzYuOTMgMzYuOTMgMCAwIDEtMTMtMi4yOGwxMi44Ny00MC41OWguMjJsMTIuNjUgNDAuNzFhMzguNSAzOC41IDAgMCAxLTEyLjc0IDIuMTZ6bTk2LjItMjMuMzNoLTguOTRWNjQuOTFoOC45NGMxMS45MyAwIDIxLjQ0IDQgMjEuNDQgMTYuMTQgMCAxMi42LTkuNTEgMTYuNTctMjEuNDQgMTYuNTciLz48L3N2Zz4=);
    background-repeat: no-repeat;
    width: 60px;
    margin-left: 20px;
    height: 28px;
    background-size: contain; }
  .fd-global-nav__product-name {
    padding: 20px 0 0 8px;
    font-size: 0.85714rem;
    line-height: 1.33333;
    font-weight: 400; }
  .fd-global-nav__launchpad {
    padding-top: 0;
    max-width: 400px;
    margin: 0 auto;
    position: relative; }
    .fd-global-nav__launchpad button {
      min-height: 48px;
      background-image: url(data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHdpZHRoPSIxMiIgaGVpZ2h0PSI5Ij48cGF0aCBmaWxsLXJ1bGU9ImV2ZW5vZGQiIGZpbGw9IiMyMTI2MkMiIGQ9Ik0xMS45MzUgMS40NzVMNi4xODggNy45MjdhLjI2NC4yNjQgMCAwIDEtLjM3OCAwTC4wNjUgMS40NzVhLjIzNi4yMzYgMCAwIDEgLjAyNi0uMzQzTDEuMzgxLjA1OGEuMjUzLjI1MyAwIDAgMSAuMTYzLS4wNTlMMS41NjMgMGEuMjUyLjI1MiAwIDAgMSAuMTcxLjA4NWw0LjI2NSA0Ljg4IDQuMjY3LTQuODhhLjI1Mi4yNTIgMCAwIDEgLjM1Mi0uMDI3bDEuMjkxIDEuMDc0Yy4wNS4wNDIuMDgxLjEwMi4wODYuMTY2YS4yMzYuMjM2IDAgMCAxLS4wNi4xNzd6Ii8+PC9zdmc+);
      background-repeat: no-repeat;
      background-position: calc(100% - 36px) center;
      padding-right: 30px;
      color: #51555a; }
      .fd-global-nav__launchpad button:hover {
        border-color: transparent;
        background-color: #fafafa; }
      .fd-global-nav__launchpad button:focus, .fd-global-nav__launchpad button[aria-expanded="true"] {
        border-color: transparent;
        background-color: rgba(10, 110, 209, 0.07); }
    .fd-global-nav__launchpad .fd-mega-menu {
      position: absolute;
      top: 50px;
      left: 0; }
  .fd-global-nav__context-menu {
    border-left: 1px solid #eeeeef;
    border-right: 1px solid #eeeeef;
    margin-right: 8px; }
    .fd-global-nav__context-menu button {
      min-height: 48px;
      color: #51555a;
      background: transparent;
      border-color: transparent;
      box-shadow: none;
      border-radius: 0; }
  .fd-global-nav__actions {
    display: inline-block; }
  .fd-global-nav__search {
    position: relative;
    display: inline-block; }
    .fd-global-nav__search input {
      position: absolute;
      left: -176px;
      top: 0;
      background: white;
      border-radius: 0;
      border: none;
      min-width: 176px;
      border-bottom: 1px solid #eeeeef;
      box-shadow: 0 5px #fff,  0 -5px #fff; }
      .fd-global-nav__search input[aria-hidden="true"] {
        display: none; }
  .fd-global-nav.is-disabled, .fd-global-nav[disabled] {
    opacity: 0.5; }

/*!
.fd-side-nav
    .fd-side-nav__group
        .fd-side-nav__title
        .fd-side-nav__list
            .fd-side-nav__item
                .fd-side-nav__link (.has-child, .is-active, .is-expanded)
                .fd-side-nav__sublist
                    .fd-side-nav__subitem
                    .fd-side-nav__sublink (.is-active)
*/
.fd-side-nav {
  background-color: white;
  min-width: 249px;
  margin: 0;
  padding: 0; }
  .fd-side-nav__group {
    list-style: none;
    margin-bottom: 0; }
  .fd-side-nav__title {
    display: block;
    margin-bottom: 0;
    padding: 8px 20px;
    font-size: 0.85714rem;
    line-height: 1.33333;
    font-weight: 400;
    text-transform: uppercase;
    color: #6a6d70;
    background: #fafafa; }
  .fd-side-nav__list, .fd-side-nav__sublist {
    font-size: 14px;
    line-height: 1.42857;
    color: var(--fd-color-text-1);
    font-family: '72', -apple-system, BlinkMacSystemFont, Segoe UI, Roboto, Helvetica Neue, Arial, sans-serif, Apple Color Emoji, Segoe UI Emoji, Segoe UI Symbol;
    display: flex;
    flex-wrap: wrap;
    padding-left: 0;
    margin-bottom: 0;
    list-style: none;
    flex-direction: column; }
  .fd-side-nav__sublist[aria-hidden="true"] {
    display: none; }
  .fd-side-nav__link, .fd-side-nav__sublink {
    padding: 10px 20px;
    color: #51555a;
    display: block;
    font-size: 1rem;
    line-height: 1.42857;
    font-weight: 400; }
    .fd-side-nav__link:hover, .fd-side-nav__sublink:hover {
      background-color: #fafafa; }
    .fd-side-nav__link.is-selected, .fd-side-nav__link.is-expanded, .fd-side-nav__link[aria-selected="true"], .fd-side-nav__link[aria-expanded="true"], .fd-side-nav__sublink.is-selected, .fd-side-nav__sublink.is-expanded, .fd-side-nav__sublink[aria-selected="true"], .fd-side-nav__sublink[aria-expanded="true"] {
      color: #51555a;
      background-color: rgba(10, 110, 209, 0.07);
      font-weight: 700; }
    .fd-side-nav__link.is-disabled, .fd-side-nav__link[aria-disabled="true"], .fd-side-nav__sublink.is-disabled, .fd-side-nav__sublink[aria-disabled="true"] {
      color: #6a6d70; }
  .fd-side-nav__link.has-child {
    background-image: url(data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHdpZHRoPSIxMiIgaGVpZ2h0PSI5Ij48cGF0aCBmaWxsLXJ1bGU9ImV2ZW5vZGQiIGZpbGw9IiMyMTI2MkMiIGQ9Ik0xMS45MzUgMS40NzVMNi4xODggNy45MjdhLjI2NC4yNjQgMCAwIDEtLjM3OCAwTC4wNjUgMS40NzVhLjIzNi4yMzYgMCAwIDEgLjAyNi0uMzQzTDEuMzgxLjA1OGEuMjUzLjI1MyAwIDAgMSAuMTYzLS4wNTlMMS41NjMgMGEuMjUyLjI1MiAwIDAgMSAuMTcxLjA4NWw0LjI2NSA0Ljg4IDQuMjY3LTQuODhhLjI1Mi4yNTIgMCAwIDEgLjM1Mi0uMDI3bDEuMjkxIDEuMDc0Yy4wNS4wNDIuMDgxLjEwMi4wODYuMTY2YS4yMzYuMjM2IDAgMCAxLS4wNi4xNzd6Ii8+PC9zdmc+);
    background-repeat: no-repeat;
    background-position: calc(100% - 36px) center; }
  .fd-side-nav__link.is-expanded, .fd-side-nav__link[aria-expanded="true"] {
    background-image: url(data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiBlbmNvZGluZz0iVVRGLTgiPz4KPHN2ZyB3aWR0aD0iMTJweCIgaGVpZ2h0PSIxMHB4IiB2aWV3Qm94PSIwIDAgMTIgMTAiIHZlcnNpb249IjEuMSIgeG1sbnM9Imh0dHA6Ly93d3cudzMub3JnLzIwMDAvc3ZnIiB4bWxuczp4bGluaz0iaHR0cDovL3d3dy53My5vcmcvMTk5OS94bGluayI+CiAgICA8IS0tIEdlbmVyYXRvcjogU2tldGNoIDQ5LjMgKDUxMTY3KSAtIGh0dHA6Ly93d3cuYm9oZW1pYW5jb2RpbmcuY29tL3NrZXRjaCAtLT4KICAgIDx0aXRsZT5VbnRpdGxlZDwvdGl0bGU+CiAgICA8ZGVzYz5DcmVhdGVkIHdpdGggU2tldGNoLjwvZGVzYz4KICAgIDxkZWZzPjwvZGVmcz4KICAgIDxnIGlkPSJQYWdlLTEiIHN0cm9rZT0ibm9uZSIgc3Ryb2tlLXdpZHRoPSIxIiBmaWxsPSJub25lIiBmaWxsLXJ1bGU9ImV2ZW5vZGQiPgogICAgICAgIDxnIGlkPSJkb3dubG9hZCIgdHJhbnNmb3JtPSJ0cmFuc2xhdGUoNi4wMDAwMDAsIDUuMDAwMDAwKSByb3RhdGUoLTE4MC4wMDAwMDApIHRyYW5zbGF0ZSgtNi4wMDAwMDAsIC01LjAwMDAwMCkgIiBmaWxsPSIjMjEyNjJDIj4KICAgICAgICAgICAgPHBhdGggZD0iTTExLjkzNSwyLjQ3NSBMNi4xODgsOC45MjcgQzYuMTM4MzEzODQsOC45Nzc5NDY4NyA2LjA3MDE2Mzg4LDkuMDA2Njc2OTEgNS45OTksOS4wMDY2NzY5MSBDNS45Mjc4MzYxMiw5LjAwNjY3NjkxIDUuODU5Njg2MTYsOC45Nzc5NDY4NyA1LjgxLDguOTI3IEwwLjA2NSwyLjQ3NSBDMC4wMjEwMzMzNzczLDIuNDI2OTMzNjMgLTAuMDAxMTEwMzExODMsMi4zNjI4MzE4NyAwLjAwMzgxMzQxNzEyLDIuMjk3ODc2NTMgQzAuMDA4NzM3MTQ2MDcsMi4yMzI5MjExOCAwLjA0MDI5MDM0NzcsMi4xNzI4ODk3NSAwLjA5MSwyLjEzMiBMMS4zODEsMS4wNTggQzEuNDI2NjkwMywxLjAxOTc1MjI1IDEuNDg0NDE0MTUsMC45OTg4NTgzMzkgMS41NDQsMC45OTkgTDEuNTYzLDEgQzEuNjI4OTQzNzMsMS4wMDQ4MDMxNSAxLjY5MDM1ODEyLDEuMDM1MzMwNzggMS43MzQsMS4wODUgTDUuOTk5LDUuOTY1IEwxMC4yNjYsMS4wODUgQzEwLjM1NjM3MjUsMC45ODE1ODQ0MTYgMTAuNTEyOTEyNiwwLjk2OTU3NzA4NSAxMC42MTgsMS4wNTggTDExLjkwOSwyLjEzMiBDMTEuOTU5LDIuMTc0IDExLjk5LDIuMjM0IDExLjk5NSwyLjI5OCBDMTIuMDAwMjA5MSwyLjM2Mjc0Mjc4IDExLjk3ODUwNDksMi40MjY3NzA0NCAxMS45MzUsMi40NzUgWiIgaWQ9IlNoYXBlIj48L3BhdGg+CiAgICAgICAgPC9nPgogICAgPC9nPgo8L3N2Zz4=); }
  .fd-side-nav__sublink {
    font-weight: normal;
    padding-left: 40px; }
    .fd-side-nav__sublink[aria-hidden="true"] {
      display: none; }
  .fd-side-nav__icon {
    padding-right: 10px; }
  .fd-side-nav--icons {
    min-width: auto; }
    .fd-side-nav--icons .fd-side-nav__icon {
      padding-right: 0; }

/*!
.fd-link
*/
.fd-link {
  color: var(--fd-color-action-1);
  border-bottom-style: solid;
  border-bottom-width: 1px;
  border-bottom-color: var(--fd-color-action-1); }
  .fd-link:hover,
  .fd-link .is-hover {
    color: var(--fd-color-action-hover);
    border-bottom-color: var(--fd-color-action-hover); }
  .fd-link:visited {
    color: var(--fd-color-action-visited);
    border-bottom-color: var(--fd-color-action-visited); }
  .fd-link:active, .fd-link.is-active, .fd-link[aria-selected="true"], .fd-link.is-selected, .fd-link[aria-pressed="true"], .fd-link.is-pressed {
    color: var(--fd-color-action-selected);
    border-bottom-color: var(--fd-color-action-selected); }
  .fd-link[aria-disabled="true"], .fd-link.is-disabled, .fd-link:disabled {
    color: var(--fd-color-action-disabled);
    border-bottom-color: var(--fd-color-action-disabled); }

/*!
.fd-identifier+((--circle), (--thumbnail), (--xxs|--xs|--s|--m|--l|--xl|--xxl))
*/
[class*="fd-identifier"] {
  --fd-identifier-color: var(--fd-color-text-5);
  --fd-identifier-background-color: var(--fd-color-status-4);
  font-size: 14px;
  line-height: 1.42857;
  color: var(--fd-color-text-1);
  font-family: '72', -apple-system, BlinkMacSystemFont, Segoe UI, Roboto, Helvetica Neue, Arial, sans-serif, Apple Color Emoji, Segoe UI Emoji, Segoe UI Symbol;
  display: inline-block;
  vertical-align: middle;
  text-align: center;
  background-repeat: no-repeat;
  background-size: cover;
  background-position: 50%;
  border-radius: 4px;
  background-color: var(--fd-identifier-background-color);
  color: var(--fd-identifier-color); }

.fd-identifier--xxs {
  width: 20px;
  height: 20px;
  max-width: 20px;
  max-height: 20px;
  min-width: 20px;
  min-height: 20px;
  font-size: 0.85714rem;
  line-height: 1.33333;
  font-weight: 400;
  font-weight: 400;
  font-stretch: condensed;
  line-height: 20px; }
  .fd-identifier--xxs::before {
    font-size: 0.85714rem;
    line-height: 1;
    line-height: 20px; }

.fd-identifier--xs {
  width: 28px;
  height: 28px;
  max-width: 28px;
  max-height: 28px;
  min-width: 28px;
  min-height: 28px;
  font-size: 0.85714rem;
  line-height: 1.33333;
  font-weight: 400;
  font-weight: 400;
  font-stretch: condensed;
  line-height: 28px; }
  .fd-identifier--xs::before {
    font-size: 0.85714rem;
    line-height: 1;
    line-height: 28px; }

.fd-identifier--s {
  width: 32px;
  height: 32px;
  max-width: 32px;
  max-height: 32px;
  min-width: 32px;
  min-height: 32px;
  font-size: 0.85714rem;
  line-height: 1.33333;
  font-weight: 400;
  font-weight: 400;
  font-stretch: condensed;
  line-height: 32px; }
  .fd-identifier--s::before {
    font-size: 1.14286rem;
    line-height: 1;
    line-height: 32px; }

.fd-identifier--m {
  width: 48px;
  height: 48px;
  max-width: 48px;
  max-height: 48px;
  min-width: 48px;
  min-height: 48px;
  font-size: 1rem;
  line-height: 1.42857;
  font-weight: 400;
  line-height: 48px; }
  .fd-identifier--m::before {
    font-size: 1.42857rem;
    line-height: 1;
    line-height: 48px; }

.fd-identifier--l {
  width: 64px;
  height: 64px;
  max-width: 64px;
  max-height: 64px;
  min-width: 64px;
  min-height: 64px;
  font-size: 1.28571rem;
  line-height: 1.33333;
  font-weight: 400;
  line-height: 64px; }
  .fd-identifier--l::before {
    font-size: 1.71429rem;
    line-height: 1;
    line-height: 64px; }

.fd-identifier--xl {
  width: 88px;
  height: 88px;
  max-width: 88px;
  max-height: 88px;
  min-width: 88px;
  min-height: 88px;
  font-size: 1.28571rem;
  line-height: 1.33333;
  font-weight: 400;
  line-height: 88px; }
  .fd-identifier--xl::before {
    font-size: 1.71429rem;
    line-height: 1;
    line-height: 88px; }

.fd-identifier--xxl {
  width: 112px;
  height: 112px;
  max-width: 112px;
  max-height: 112px;
  min-width: 112px;
  min-height: 112px;
  font-size: 1.28571rem;
  line-height: 1.33333;
  font-weight: 400;
  line-height: 112px; }
  .fd-identifier--xxl::before {
    font-size: 1.71429rem;
    line-height: 1;
    line-height: 112px; }

.fd-identifier--circle {
  border-radius: 50%; }

.fd-identifier--thumbnail {
  text-indent: -200%;
  overflow: hidden; }

.fd-identifier--transparent {
  --fd-identifier-color: var(--fd-color-text-1);
  --fd-identifier-background-color: transparent; }

/*!
.fd-mega-menu+(--no-border)
    .fd-mega-menu__content+()
    .fd-mega-menu__title+()
*/
.fd-mega-menu {
  font-size: 14px;
  line-height: 1.42857;
  color: var(--fd-color-text-1);
  font-family: '72', -apple-system, BlinkMacSystemFont, Segoe UI, Roboto, Helvetica Neue, Arial, sans-serif, Apple Color Emoji, Segoe UI Emoji, Segoe UI Symbol;
  background-color: white;
  width: 250px;
  margin: 0;
  padding: 0;
  background-color: white;
  box-shadow: 0 5px 20px 0 rgba(50, 54, 58, 0.08);
  border-radius: 4px;
  border: none; }
  .fd-mega-menu__header {
    box-shadow: inset 0 -1px 0 0 rgba(0, 0, 0, 0.07); }
    .fd-mega-menu__header-link {
      padding: 10px 20px;
      color: #51555a; }
      .fd-mega-menu__header-link::before {
        padding-right: 10px;
        font-size: 22px;
        vertical-align: sub; }
  .fd-mega-menu__group {
    list-style: none;
    margin-bottom: 0; }
  .fd-mega-menu__title {
    display: block;
    margin-bottom: 0;
    padding: 8px 20px;
    font-size: 0.85714rem;
    line-height: 1.33333;
    font-weight: 400;
    text-transform: uppercase;
    color: #6a6d70;
    background: #fafafa; }
  .fd-mega-menu__list, .fd-mega-menu__sublist {
    font-size: 14px;
    line-height: 1.42857;
    color: var(--fd-color-text-1);
    font-family: '72', -apple-system, BlinkMacSystemFont, Segoe UI, Roboto, Helvetica Neue, Arial, sans-serif, Apple Color Emoji, Segoe UI Emoji, Segoe UI Symbol;
    display: flex;
    flex-wrap: wrap;
    padding-left: 0;
    margin-bottom: 0;
    list-style: none;
    flex-direction: column; }
  .fd-mega-menu__item {
    position: relative; }
  .fd-mega-menu__sublist {
    width: 200px;
    background-color: white;
    box-shadow: 0 5px 20px 0 rgba(50, 54, 58, 0.08);
    border-radius: 4px;
    position: absolute;
    right: -200px;
    top: 0; }
    .fd-mega-menu__sublist[aria-hidden="true"] {
      display: none; }
  .fd-mega-menu__link, .fd-mega-menu__sublink {
    padding: 10px 20px;
    color: #51555a;
    display: block;
    font-size: 1rem;
    line-height: 1.42857;
    font-weight: 400; }
    .fd-mega-menu__link:hover, .fd-mega-menu__sublink:hover {
      background-color: #fafafa; }
    .fd-mega-menu__link.is-selected, .fd-mega-menu__link.is-expanded, .fd-mega-menu__link[aria-selected="true"], .fd-mega-menu__link[aria-expanded="true"], .fd-mega-menu__sublink.is-selected, .fd-mega-menu__sublink.is-expanded, .fd-mega-menu__sublink[aria-selected="true"], .fd-mega-menu__sublink[aria-expanded="true"] {
      color: #51555a;
      background-color: rgba(10, 110, 209, 0.07);
      font-weight: bold; }
    .fd-mega-menu__link.is-disabled, .fd-mega-menu__link[aria-disabled="true"], .fd-mega-menu__sublink.is-disabled, .fd-mega-menu__sublink[aria-disabled="true"] {
      color: #6a6d70; }
  .fd-mega-menu__link.has-child {
    background-image: url(data:image/svg+xml;base64,PHN2ZyBpZD0iTGF5ZXJfMSIgZGF0YS1uYW1lPSJMYXllciAxIiB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHZpZXdCb3g9IjAgMCA4LjAxIDExLjk5Ij48ZGVmcz48c3R5bGU+LmNscy0xe2ZpbGw6IzIxMjYyYzt9PC9zdHlsZT48L2RlZnM+PHRpdGxlPmRvd25sb2FkPC90aXRsZT48cGF0aCBjbGFzcz0iY2xzLTEiIGQ9Ik0zLjQ3LTEuOTMsOS45MiwzLjgxYS4yNy4yNywwLDAsMSwwLC4zOGgwTDMuNDcsOS45NGEuMjMuMjMsMCwwLDEtLjMzLDBoMEwyLjA1LDguNjJhLjI4LjI4LDAsMCwxLDAtLjE2djBhLjIxLjIxLDAsMCwxLC4wOC0uMTdMNyw0LDIuMDgtLjI2YS4yNy4yNywwLDAsMSwwLS4zNkwzLjEzLTEuOTFBLjIxLjIxLDAsMCwxLDMuMjktMiwuMi4yLDAsMCwxLDMuNDctMS45M1oiIHRyYW5zZm9ybT0idHJhbnNsYXRlKC0yIDEuOTkpIi8+PC9zdmc+);
    background-repeat: no-repeat;
    background-position: calc(100% - 12px) center;
    background-size: 8px; }
  .fd-mega-menu__sublink {
    font-weight: normal; }
    .fd-mega-menu__sublink[aria-hidden="true"] {
      display: none; }
  .fd-mega-menu[aria-hidden="true"] {
    display: none; }
  .fd-mega-menu.is-disabled, .fd-mega-menu[disabled] {
    opacity: 0.5; }

.fd-menu {
  --fd-menu-item-separator-color: var(--fd-color-neutral-2);
  --fd-menu-item-color: var(--fd-color-text-2);
  --fd-menu-item-background-color: var(--fd-color-background-2);
  --fd-menu-title-color: var(--fd-color-text-3);
  --fd-menu-title-background-color: var(--fd-color-neutral-1);
  font-size: 14px;
  line-height: 1.42857;
  color: var(--fd-color-text-1);
  font-family: '72', -apple-system, BlinkMacSystemFont, Segoe UI, Roboto, Helvetica Neue, Arial, sans-serif, Apple Color Emoji, Segoe UI Emoji, Segoe UI Symbol;
  position: relative;
  display: block;
  white-space: nowrap;
  padding-top: 4px;
  padding-bottom: 4px; }
  .fd-menu__group, .fd-menu__list {
    list-style: none;
    margin-bottom: 0; }
  .fd-menu__group {
    padding-left: 0; }
  .fd-menu__list {
    margin: 0;
    padding: 0;
    list-style: none; }
    .fd-menu__list--separated > *,
    .fd-menu__list--separated .fd-menu__list > * {
      border-top-style: solid;
      border-top-width: 1px;
      border-top-color: var(--fd-menu-item-separator-color); }
      .fd-menu__list--separated > *:first-child,
      .fd-menu__list--separated .fd-menu__list > *:first-child {
        border-top-width: 0; }
  .fd-menu__title {
    display: block;
    margin-bottom: 0;
    padding: 8px 24px;
    font-size: 0.85714rem;
    line-height: 1.33333;
    font-weight: 400;
    text-transform: uppercase;
    color: var(--fd-menu-title-color);
    background-color: var(--fd-menu-title-background-color); }
  .fd-menu__item {
    display: block;
    cursor: pointer;
    padding: 10px 24px;
    background-color: var(--fd-menu-item-background-color);
    color: var(--fd-menu-item-color);
    font-weight: 400; }
    .fd-menu__item > .fd-checkbox {
      margin: 0 10px 0 0; }
    .fd-menu__item:hover,
    .fd-menu__item .is-hover {
      color: var(--fd-color-text-1);
      background-color: var(--fd-color-background-hover); }
    .fd-menu__item[aria-selected="true"], .fd-menu__item.is-selected {
      background-color: var(--fd-color-background-selected); }
      .fd-menu__item[aria-selected="true"]:hover,
      .fd-menu__item[aria-selected="true"] .is-hover, .fd-menu__item.is-selected:hover,
      .fd-menu__item.is-selected .is-hover {
        background-color: var(--fd-color-background-selected-hover); }
  .fd-menu--addon-before .fd-menu__item {
    padding-left: 32px; }
  .fd-menu__addon-before {
    float: left;
    clear: left;
    height: 39px;
    display: flex;
    justify-content: center;
    align-items: center;
    width: 30px; }
    [dir="rtl"] .fd-menu__addon-before, .fd-menu__addon-before[dir="rtl"] {
      float: right;
      clear: right; }

/*!
.fd-button-group+()
    .fd-button
*/
.fd-button-group,
.fd-segmented-button {
  padding: 0;
  margin: 0;
  display: inline-flex;
  vertical-align: middle; }
  .fd-button-group > *,
  .fd-segmented-button > * {
    margin: 0; }
    .fd-button-group > *:not(:first-child):not(:last-child),
    .fd-segmented-button > *:not(:first-child):not(:last-child) {
      border-radius: 0; }
    .fd-button-group > *:not(:last-child),
    .fd-segmented-button > *:not(:last-child) {
      border-right-width: 0; }
    .fd-button-group > *:first-child,
    .fd-segmented-button > *:first-child {
      border-top-right-radius: 0;
      border-bottom-right-radius: 0; }
    .fd-button-group > *:last-child,
    .fd-segmented-button > *:last-child {
      border-top-left-radius: 0;
      border-bottom-left-radius: 0; }
    [dir="rtl"] .fd-button-group > *:not(:first-child), .fd-button-group > *[dir="rtl"]:not(:first-child), [dir="rtl"]
    .fd-segmented-button > *:not(:first-child),
    .fd-segmented-button > *[dir="rtl"]:not(:first-child) {
      border-right: none; }
    [dir="rtl"] .fd-button-group > *:last-child, .fd-button-group > *[dir="rtl"]:last-child, [dir="rtl"]
    .fd-segmented-button > *:last-child,
    .fd-segmented-button > *[dir="rtl"]:last-child {
      border-top-left-radius: 4px;
      border-bottom-left-radius: 4px;
      border-top-right-radius: 0;
      border-bottom-right-radius: 0; }
    [dir="rtl"] .fd-button-group > *:first-child, .fd-button-group > *[dir="rtl"]:first-child, [dir="rtl"]
    .fd-segmented-button > *:first-child,
    .fd-segmented-button > *[dir="rtl"]:first-child {
      border-top-left-radius: 0;
      border-bottom-left-radius: 0;
      border-top-right-radius: 4px;
      border-bottom-right-radius: 4px;
      border-right-width: 1px; }

/*!
.fd-tile+()
  .fd-tile__media+()
  .fd-tile__content+()
  .fd-tile__title+()
  .fd-tile__actions+()
*/
.fd-tile {
  --fd-tile-color: var(--fd-color-text-3);
  --fd-tile-background-color: var(--fd-color-background-2);
  --fd-tile-title-color: var(--fd-color-text-1);
  font-size: 14px;
  line-height: 1.42857;
  color: var(--fd-color-text-1);
  font-family: '72', -apple-system, BlinkMacSystemFont, Segoe UI, Roboto, Helvetica Neue, Arial, sans-serif, Apple Color Emoji, Segoe UI Emoji, Segoe UI Symbol;
  display: flex;
  color: var(--fd-tile-color);
  background-color: var(--fd-tile-background-color); }
  .fd-tile--button, .fd-tile[role="button"] {
    cursor: pointer;
    transition: box-shadow 0.125s ease-in; }
    .fd-tile--button:hover, .fd-tile[role="button"]:hover {
      box-shadow: 0 0 5px 0 rgba(106, 109, 112, 0.4);
      position: relative;
      z-index: 1; }
  .fd-tile[aria-disabled="true"], .fd-tile.is-disabled {
    opacity: 0.4; }
  .fd-tile__media {
    padding: 10px 0 10px 16px; }
    [dir="rtl"] .fd-tile__media, .fd-tile__media[dir="rtl"] {
      padding-right: 16px;
      padding-left: 0; }
  .fd-tile__content {
    flex: 1;
    padding: 10px 16px 10px 12px;
    align-self: center; }
    [dir="rtl"] .fd-tile__content, .fd-tile__content[dir="rtl"] {
      padding-right: 12px;
      padding-left: 16px; }
    .fd-tile__content:first-child {
      padding-left: 16px; }
      [dir="rtl"] .fd-tile__content:first-child, .fd-tile__content:first-child[dir="rtl"] {
        padding-right: 16px; }
  .fd-tile__title {
    font-size: 1rem;
    line-height: 1.42857;
    font-weight: 400;
    color: var(--fd-tile-title-color);
    margin-bottom: 0; }
  .fd-tile__actions {
    padding: 12px 16px 12px 12px; }

/*!
.fd-product-tile+()
  .fd-product-tile__media+()
  .fd-product-tile__title+()
*/
.fd-product-tile {
  --fd-product-tile-color: var(--fd-color-text-3);
  --fd-product-tile-background-color: var(--fd-color-background-2);
  --fd-product-tile-title-color: var(--fd-color-text-1);
  font-size: 14px;
  line-height: 1.42857;
  color: var(--fd-color-text-1);
  font-family: '72', -apple-system, BlinkMacSystemFont, Segoe UI, Roboto, Helvetica Neue, Arial, sans-serif, Apple Color Emoji, Segoe UI Emoji, Segoe UI Symbol;
  color: var(--fd-product-tile-color);
  background-color: var(--fd-product-tile-background-color); }
  .fd-product-tile--button, .fd-product-tile[role="button"] {
    cursor: pointer;
    transition: box-shadow 0.125s ease-in; }
    .fd-product-tile--button:hover, .fd-product-tile[role="button"]:hover {
      box-shadow: 0 0 5px 0 rgba(106, 109, 112, 0.4);
      position: relative;
      z-index: 1; }
  .fd-product-tile[aria-disabled="true"], .fd-product-tile.is-disabled {
    opacity: 0.4; }
  .fd-product-tile__media {
    width: 100%;
    min-height: 210px;
    background-repeat: no-repeat;
    background-position: center center;
    background-size: cover; }
  .fd-product-tile__content {
    padding: 24px 24px; }
  .fd-product-tile__title {
    font-size: 1.14286rem;
    line-height: 1.25;
    font-weight: 400;
    color: var(--fd-product-tile-title-color);
    margin-bottom: 0;
    margin-bottom: 0; }

/*!
.fd-tile-grid+(--2col | --4col | --5col | --6col)
*/
.fd-tile-grid {
  --fd-tile-grid-border-color: var(--fd-color-neutral-2);
  display: flex;
  flex-wrap: wrap;
  flex-direction: column;
  position: relative; }
  .fd-tile-grid > * {
    margin-bottom: 0;
    border-radius: 0 !important;
    position: relative;
    border-style: solid;
    border-color: var(--fd-tile-grid-border-color);
    border-width: 0 1px 1px 0;
    min-width: calc(100% / 2);
    width: auto;
    flex: 1; }
  @media (min-width: 320px) {
    .fd-tile-grid {
      display: flex;
      flex-direction: row;
      flex-wrap: wrap;
      display: grid;
      grid-template-columns: repeat(3, 1fr);
      grid-gap: 0; }
      .fd-tile-grid--2col {
        grid-template-columns: repeat(2, 1fr); }
        .fd-tile-grid--2col > * {
          min-width: calc(100% / 2); }
      .fd-tile-grid--3col {
        grid-template-columns: repeat(3, 1fr); }
        .fd-tile-grid--3col > * {
          min-width: calc(100% / 3); }
      .fd-tile-grid--4col {
        grid-template-columns: repeat(4, 1fr); }
        .fd-tile-grid--4col > * {
          min-width: calc(100% / 4); }
      .fd-tile-grid--5col {
        grid-template-columns: repeat(5, 1fr); }
        .fd-tile-grid--5col > * {
          min-width: calc(100% / 5); }
      .fd-tile-grid--6col {
        grid-template-columns: repeat(6, 1fr); }
        .fd-tile-grid--6col > * {
          min-width: calc(100% / 6); } }

/*!
.fd-token+(--no-border)
    .fd-token__content+()
    .fd-token__title+()
*/
.fd-token {
  --fd-token-color: var(--fd-color-text-2);
  --fd-token-background-color: var(--fd-color-background-information);
  --fd-token-border-color: transparent;
  font-size: 14px;
  line-height: 1.42857;
  color: var(--fd-color-text-1);
  font-family: '72', -apple-system, BlinkMacSystemFont, Segoe UI, Roboto, Helvetica Neue, Arial, sans-serif, Apple Color Emoji, Segoe UI Emoji, Segoe UI Symbol;
  font-size: 0.85714rem;
  line-height: 1.33333;
  font-weight: 400;
  color: var(--fd-token-color);
  background-color: var(--fd-token-background-color);
  line-height: 24px;
  vertical-align: middle;
  display: inline-block;
  padding-left: 8px;
  padding-right: 8px;
  border-radius: 4px;
  border-width: 1px;
  border-style: solid;
  border-color: var(--fd-token-border-color);
  cursor: pointer; }
  .fd-token::after {
    font-family: "SAP-icons";
    font-style: normal;
    font-weight: normal;
    text-align: center;
    display: inline-block;
    text-decoration: inherit;
    text-transform: none;
    text-rendering: optimizeLegibility;
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
    speak: none; }
  .fd-token::after {
    content: ""; }
  .fd-token::after {
    font-size: 0.85714rem;
    line-height: 1; }
  .fd-token::after {
    color: var(--fd-color-action-1);
    margin-left: 4px;
    vertical-align: bottom;
    line-height: 24px; }
  [dir="rtl"] .fd-token::before, .fd-token[dir="rtl"]::before {
    font-family: "SAP-icons";
    font-style: normal;
    font-weight: normal;
    text-align: center;
    display: inline-block;
    text-decoration: inherit;
    text-transform: none;
    text-rendering: optimizeLegibility;
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
    speak: none; }
  [dir="rtl"] .fd-token::before, .fd-token[dir="rtl"]::before {
    content: ""; }
  [dir="rtl"] .fd-token::before, .fd-token[dir="rtl"]::before {
    font-size: 0.85714rem;
    line-height: 1; }
  [dir="rtl"] .fd-token::before, .fd-token[dir="rtl"]::before {
    color: var(--fd-color-action-1);
    margin-left: 4px;
    vertical-align: bottom;
    line-height: 24px; }
  [dir="rtl"] .fd-token::before, .fd-token[dir="rtl"]::before {
    display: inline;
    margin-left: 0;
    margin-right: 4px; }
  [dir="rtl"] .fd-token::after, .fd-token[dir="rtl"]::after {
    content: none; }

/*!
.fd-tag+(--no-border)
    .fd-tag__content+()
    .fd-tag__title+()
*/
.fd-tag {
  font-size: 14px;
  line-height: 1.42857;
  color: var(--fd-color-text-1);
  font-family: '72', -apple-system, BlinkMacSystemFont, Segoe UI, Roboto, Helvetica Neue, Arial, sans-serif, Apple Color Emoji, Segoe UI Emoji, Segoe UI Symbol;
  font-size: 0.85714rem;
  line-height: 1.33333;
  font-weight: 400;
  color: #51555a;
  background-color: rgba(10, 110, 209, 0.07);
  line-height: 24px;
  vertical-align: middle;
  display: inline-block;
  padding-left: 8px;
  padding-right: 8px;
  border-radius: 4px;
  border-width: 1px;
  border-style: solid;
  border-color: transparent;
  cursor: pointer; }
  .fd-tag::after {
    font-family: "SAP-icons";
    font-style: normal;
    font-weight: normal;
    text-align: center;
    display: inline-block;
    text-decoration: inherit;
    text-transform: none;
    text-rendering: optimizeLegibility;
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
    speak: none; }
  .fd-tag::after {
    content: ""; }
  .fd-tag::after {
    font-size: 0.85714rem;
    line-height: 1; }
  .fd-tag::after {
    color: inherit;
    margin-left: 4px;
    vertical-align: bottom;
    line-height: 24px; }
  [dir="rtl"] .fd-tag::before, .fd-tag[dir="rtl"]::before {
    font-family: "SAP-icons";
    font-style: normal;
    font-weight: normal;
    text-align: center;
    display: inline-block;
    text-decoration: inherit;
    text-transform: none;
    text-rendering: optimizeLegibility;
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
    speak: none; }
  [dir="rtl"] .fd-tag::before, .fd-tag[dir="rtl"]::before {
    content: ""; }
  [dir="rtl"] .fd-tag::before, .fd-tag[dir="rtl"]::before {
    font-size: 0.85714rem;
    line-height: 1; }
  [dir="rtl"] .fd-tag::before, .fd-tag[dir="rtl"]::before {
    color: #0a6ed1;
    margin-left: 4px;
    vertical-align: bottom;
    line-height: 24px; }
  [dir="rtl"] .fd-tag::before, .fd-tag[dir="rtl"]::before {
    display: inline;
    margin-left: 0;
    margin-right: 4px; }
  [dir="rtl"] .fd-tag::after, .fd-tag[dir="rtl"]::after {
    content: none; }

/*
see layouts/panel-grid
*/
/*
see layouts/panel
*/
/*!
.fd-calendar+()
    .fd-calendar__header
      .fd-calendar__navigation
        .fd-calendar__action
    .fd-calendar__content
      .fd-calendar__dates(+[aria-hidden])
      .fd-calendar__months(+[aria-hidden])
      .fd-calendar__years(+[aria-hidden])
        .fd-calendar__table
        .fd-calendar__list
          .fd-calendar__item(+[--other-month,--current,--disabled,--blocked],[is-selected,is-selected-range, is-selected-range-first,is-selected-range-last])
            .fd-calendar__text
*/
.fd-calendar .fd-calendar__column-header, .fd-calendar .fd-calendar__item {
  --fd-calendar-item-color: var(--fd-color-action-selected);
  --fd-calendar-item-background-color: var(--fd-color-background-2);
  font-size: 0.85714rem;
  line-height: 1.33333;
  font-weight: 400;
  color: var(--fd-calendar-item-color);
  background-color: var(--fd-calendar-item-background-color);
  height: 36px;
  min-width: 36px;
  padding: 0;
  margin: 0;
  text-align: center;
  border-radius: 4px;
  display: flex;
  align-items: center;
  justify-content: center; }
  .fd-calendar .fd-calendar__column-header:hover, .fd-calendar .fd-calendar__item:hover {
    cursor: pointer;
    --fd-calendar-item-background-color: var(--fd-color-neutral-1); }

.fd-calendar .fd-calendar__item--other-month {
  --fd-calendar-item-color: var(--fd-color-text-1);
  opacity: 0.4; }

.fd-calendar .fd-calendar__item--disabled, .fd-calendar .fd-calendar__item.is-disabled, .fd-calendar .fd-calendar__item[aria-disabled="true"] {
  --fd-calendar-item-color: var(--fd-color-action-disabled); }
  .fd-calendar .fd-calendar__item--disabled:hover, .fd-calendar .fd-calendar__item.is-disabled:hover, .fd-calendar .fd-calendar__item:hover[aria-disabled="true"] {
    cursor: not-allowed;
    --fd-calendar-item-background-color: var(--fd-color-background-2); }

.fd-calendar .fd-calendar__item--current {
  position: relative;
  --fd-calendar-item-color: var(--fd-color-action-selected); }
  .fd-calendar .fd-calendar__item--current::after {
    content: "";
    position: absolute;
    top: 0;
    right: 0;
    bottom: 0;
    left: 0;
    height: 36px;
    border-style: solid;
    border-width: 2px;
    border-color: var(--fd-color-action);
    border-radius: 4px; }

.fd-calendar .fd-calendar__item--blocked, .fd-calendar .fd-calendar__item.is-blocked {
  text-decoration: line-through;
  --fd-calendar-item-color: var(--fd-color-text-1); }
  .fd-calendar .fd-calendar__item--blocked:hover, .fd-calendar .fd-calendar__item.is-blocked:hover {
    cursor: not-allowed;
    background-color: white; }

.fd-calendar .fd-calendar__item.is-selected {
  --fd-calendar-item-background-color: var(--fd-color-action-selected);
  --fd-calendar-item-color: var(--fd-color-text-5); }

.fd-calendar .fd-calendar__item.is-selected-range {
  --fd-calendar-item-background-color: var(--fd-color-background-selected);
  border-radius: 0; }

.fd-calendar .fd-calendar__item.is-selected-range-first {
  border-radius: 4px 0 0 4px; }

.fd-calendar .fd-calendar__item.is-selected-range-last {
  border-radius: 0 4px 4px 0; }

.fd-calendar .fd-calendar__dates[aria-hidden="true"], .fd-calendar .fd-calendar__months[aria-hidden="true"], .fd-calendar .fd-calendar__years[aria-hidden="true"], .fd-calendar .is-hidden.fd-calendar__dates, .fd-calendar .is-hidden.fd-calendar__months, .fd-calendar .is-hidden.fd-calendar__years {
  display: none; }

.fd-calendar {
  font-size: 14px;
  line-height: 1.42857;
  color: var(--fd-color-text-1);
  font-family: '72', -apple-system, BlinkMacSystemFont, Segoe UI, Roboto, Helvetica Neue, Arial, sans-serif, Apple Color Emoji, Segoe UI Emoji, Segoe UI Symbol;
  width: 252px; }

.fd-calendar .fd-calendar__months {
  display: grid; }

.fd-calendar .fd-calendar__years {
  display: flex;
  flex-wrap: wrap;
  display: grid; }

.fd-calendar .fd-calendar__header {
  box-shadow: inset 0 -1px 0 0 var(--fd-color-neutral-2);
  height: 52px;
  display: flex;
  align-items: center; }

[dir="rtl"] .fd-calendar .fd-calendar__action [class*="sap-icon"], .fd-calendar .fd-calendar__action [class*="sap-icon"][dir="rtl"] {
  transform: scaleX(-1); }

.fd-calendar .fd-calendar__content {
  padding: 12px 0; }

.fd-calendar .fd-calendar__navigation {
  display: flex;
  flex: 1;
  justify-content: space-between;
  align-items: center; }

.fd-calendar .fd-calendar__table {
  display: table;
  border-collapse: collapse; }
  .fd-calendar .fd-calendar__table .fd-calendar__item {
    display: table-cell; }

.fd-calendar .fd-calendar__group {
  display: table-row-group; }

.fd-calendar .fd-calendar__row {
  display: table-row; }

.fd-calendar .fd-calendar__column-header {
  display: table-cell;
  vertical-align: middle; }
  .fd-calendar .fd-calendar__column-header:hover {
    cursor: default;
    --fd-calendar-item-background-color: var(--fd-color-background-2); }

.fd-calendar .fd-calendar__list {
  width: 100%;
  display: flex;
  flex-wrap: wrap;
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  padding-left: 0;
  padding-right: 0; }
  .fd-calendar .fd-calendar__list > * {
    min-width: 25%; }

.fd-calendar .fd-calendar__day-of-week {
  font-size: 0.85714rem;
  line-height: 1.33333;
  font-weight: 400;
  color: var(--fd-color-text-1); }

/*!
.fd-status-label+(--available, --away, --busy, --offline, --success, --warning, --error)
*/
.fd-status-label--available, .fd-status-label--away, .fd-status-label--busy, .fd-status-label--offline {
  padding-left: 20px; }
  .fd-status-label--available::before, .fd-status-label--away::before, .fd-status-label--busy::before, .fd-status-label--offline::before {
    position: absolute;
    z-index: 1;
    background-repeat: no-repeat;
    content: "";
    line-height: 1; }
  .fd-status-label--available::after, .fd-status-label--away::after, .fd-status-label--busy::after, .fd-status-label--offline::after {
    width: 16px;
    height: 16px;
    display: inline-block;
    content: "";
    line-height: 1;
    border-radius: 50%;
    position: absolute;
    top: 0;
    left: 0;
    background-color: var(--fd-status-label-icon-background-color); }
  [dir="rtl"] .fd-status-label--available, [dir="rtl"] .fd-status-label--away, [dir="rtl"] .fd-status-label--busy, [dir="rtl"] .fd-status-label--offline, .fd-status-label--available[dir="rtl"], .fd-status-label--away[dir="rtl"], .fd-status-label--busy[dir="rtl"], .fd-status-label--offline[dir="rtl"] {
    padding-left: initial;
    padding-right: 20px; }
    [dir="rtl"] .fd-status-label--available::before, [dir="rtl"] .fd-status-label--away::before, [dir="rtl"] .fd-status-label--busy::before, [dir="rtl"] .fd-status-label--offline::before, .fd-status-label--available[dir="rtl"]::before, .fd-status-label--away[dir="rtl"]::before, .fd-status-label--busy[dir="rtl"]::before, .fd-status-label--offline[dir="rtl"]::before {
      left: initial; }
    [dir="rtl"] .fd-status-label--available::after, [dir="rtl"] .fd-status-label--away::after, [dir="rtl"] .fd-status-label--busy::after, [dir="rtl"] .fd-status-label--offline::after, .fd-status-label--available[dir="rtl"]::after, .fd-status-label--away[dir="rtl"]::after, .fd-status-label--busy[dir="rtl"]::after, .fd-status-label--offline[dir="rtl"]::after {
      left: initial;
      right: 0; }

.fd-status-label {
  --fd-status-label-color: var(--fd-color-text-2);
  --fd-status-label-icon-background-color: var(--fd-color-text-2);
  position: relative;
  font-size: 14px;
  line-height: 1.42857;
  color: var(--fd-color-text-1);
  font-family: '72', -apple-system, BlinkMacSystemFont, Segoe UI, Roboto, Helvetica Neue, Arial, sans-serif, Apple Color Emoji, Segoe UI Emoji, Segoe UI Symbol;
  color: var(--fd-status-label-color); }
  .fd-status-label::before {
    vertical-align: -8%;
    width: 20px;
    height: 16px;
    line-height: 1; }
  .fd-status-label--success {
    --fd-status-label-color: var(--fd-color-positive); }
  .fd-status-label--warning {
    --fd-status-label-color: var(--fd-color-alert); }
  .fd-status-label--error {
    --fd-status-label-color: var(--fd-color-negative); }
  .fd-status-label--available {
    --fd-status-label-icon-background-color: var(--fd-color-positive); }
    .fd-status-label--available::before {
      width: 7px;
      height: 7px;
      top: 4px;
      left: 4px;
      background-image: url("data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiBlbmNvZGluZz0idXRmLTgiPz4KPHN2ZyB2ZXJzaW9uPSIxLjEiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyIgeG1sbnM6eGxpbms9Imh0dHA6Ly93d3cudzMub3JnLzE5OTkveGxpbmsiIHg9IjBweCIgeT0iMHB4IgoJIHZpZXdCb3g9IjAgMCA2IDUuOSIgc3R5bGU9ImVuYWJsZS1iYWNrZ3JvdW5kOm5ldyAwIDAgNiA1Ljk7IiB4bWw6c3BhY2U9InByZXNlcnZlIj4KPHN0eWxlIHR5cGU9InRleHQvY3NzIj4KCS5zdDB7ZmlsbDojRkZGRkZGO30KPC9zdHlsZT4KPHBhdGggY2xhc3M9InN0MCIgZD0iTTIuNywzLjJsMS40LTIuOEM0LjQsMCw1LTAuMSw1LjUsMC4xYzAuNCwwLjMsMC42LDAuOCwwLjQsMS4ybC0yLDRDMy42LDUuOSwzLDYuMSwyLjYsNS44CgljLTAuMSwwLTAuMi0wLjEtMC4zLTAuMmwtMi0yYy0wLjQtMC40LTAuNC0xLDAtMS40YzAuNC0wLjQsMS0wLjQsMS40LDBsMCwwTDIuNywzLjJ6Ii8+Cjwvc3ZnPg=="); }
    [dir="rtl"] .fd-status-label--available::before, .fd-status-label--available[dir="rtl"]::before {
      right: 4px; }
  .fd-status-label--away {
    --fd-status-label-icon-background-color: var(--fd-color-alert); }
    .fd-status-label--away::before {
      width: 6px;
      height: 6px;
      top: 4px;
      left: 6px;
      background-image: url("data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiBlbmNvZGluZz0idXRmLTgiPz4KPHN2ZyB2ZXJzaW9uPSIxLjEiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyIgeG1sbnM6eGxpbms9Imh0dHA6Ly93d3cudzMub3JnLzE5OTkveGxpbmsiIHg9IjBweCIgeT0iMHB4IgoJIHZpZXdCb3g9IjAgMCA1IDUiIHN0eWxlPSJlbmFibGUtYmFja2dyb3VuZDpuZXcgMCAwIDUgNTsiIHhtbDpzcGFjZT0icHJlc2VydmUiPgo8c3R5bGUgdHlwZT0idGV4dC9jc3MiPgoJLnN0MHtmaWxsOiNGRkZGRkY7fQo8L3N0eWxlPgo8cGF0aCBjbGFzcz0ic3QwIiBkPSJNMSw1QzAuNCw1LDAsNC42LDAsNFYxYzAtMC42LDAuNC0xLDEtMXMxLDAuNCwxLDF2MmgyYzAuNiwwLDEsMC40LDEsMVM0LjYsNSw0LDVIMXoiLz4KPC9zdmc+"); }
    [dir="rtl"] .fd-status-label--away::before, .fd-status-label--away[dir="rtl"]::before {
      right: 4px; }
  .fd-status-label--busy {
    --fd-status-label-icon-background-color: var(--fd-color-negative); }
    .fd-status-label--busy::before {
      width: 4px;
      height: 4px;
      top: 6px;
      left: 6px;
      background-image: url("data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiBlbmNvZGluZz0idXRmLTgiPz4KPHN2ZyB2ZXJzaW9uPSIxLjEiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyIgeG1sbnM6eGxpbms9Imh0dHA6Ly93d3cudzMub3JnLzE5OTkveGxpbmsiIHg9IjBweCIgeT0iMHB4IgoJIHZpZXdCb3g9IjAgMCA0IDQiIHN0eWxlPSJlbmFibGUtYmFja2dyb3VuZDpuZXcgMCAwIDQgNDsiIHhtbDpzcGFjZT0icHJlc2VydmUiPgo8c3R5bGUgdHlwZT0idGV4dC9jc3MiPgoJLnN0MHtmaWxsOiNGRkZGRkY7fQo8L3N0eWxlPgo8cGF0aCBjbGFzcz0ic3QwIiBkPSJNNCwyYzAsMS4xLTAuOSwyLTIsMlMwLDMuMSwwLDJzMC45LTIsMi0yUzQsMC45LDQsMiIvPgo8L3N2Zz4="); }
    [dir="rtl"] .fd-status-label--busy::before, .fd-status-label--busy[dir="rtl"]::before {
      right: 6px; }
  .fd-status-label--offline::before {
    width: 8px;
    height: 8px;
    top: 4px;
    left: 4px;
    background-image: url("data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiBlbmNvZGluZz0idXRmLTgiPz4KPHN2ZyB2ZXJzaW9uPSIxLjEiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyIgeG1sbnM6eGxpbms9Imh0dHA6Ly93d3cudzMub3JnLzE5OTkveGxpbmsiIHg9IjBweCIgeT0iMHB4IgoJIHZpZXdCb3g9IjAgMCA3LjkgNy45IiBzdHlsZT0iZW5hYmxlLWJhY2tncm91bmQ6bmV3IDAgMCA3LjkgNy45OyIgeG1sOnNwYWNlPSJwcmVzZXJ2ZSI+CjxzdHlsZSB0eXBlPSJ0ZXh0L2NzcyI+Cgkuc3Qwe2ZpbGw6I0ZGRkZGRjt9Cjwvc3R5bGU+CjxwYXRoIGNsYXNzPSJzdDAiIGQ9Ik03LjksNGMwLDIuMi0xLjgsNC00LDRTMCw2LjIsMCw0czEuOC00LDQtNFM3LjksMS44LDcuOSw0Ii8+Cjwvc3ZnPg=="); }
  [dir="rtl"] .fd-status-label--offline::before, .fd-status-label--offline[dir="rtl"]::before {
    right: 4px; }

.fd-popover {
  position: relative;
  display: inline-block; }
  .fd-popover__control {
    position: relative;
    margin-left: 0;
    cursor: pointer; }
  .fd-popover__body {
    border: solid 1px #89919a;
    position: absolute;
    white-space: nowrap;
    z-index: 1000;
    border-radius: 4px;
    background-color: var(--fd-color-background-2);
    box-shadow: 0 5px 20px 0 var(--fd-color-neutral-3), 0 2px 8px 0 var(--fd-color-neutral-2);
    opacity: 1;
    visibility: visible;
    transition: all 0.125s;
    left: 0;
    top: 120%;
    transform: translateY(0); }
    [dir="rtl"] .fd-popover__body, .fd-popover__body[dir="rtl"] {
      left: auto;
      right: -3px; }
      [dir="rtl"] .fd-popover__body::before, .fd-popover__body[dir="rtl"]::before {
        right: 10px; }
      [dir="rtl"] .fd-popover__body::after, .fd-popover__body[dir="rtl"]::after {
        right: 10px; }
    .fd-popover__body::before {
      height: 0;
      width: 0;
      border-style: solid;
      border-width: 0 6.5px 8px 6.5px;
      border-bottom-color: var(--fd-color-background-2);
      border-left-color: transparent;
      border-right-color: transparent;
      content: "";
      position: absolute;
      top: -8px;
      left: 10px;
      z-index: 1002; }
    .fd-popover__body::after {
      height: 0;
      width: 0;
      border-style: solid;
      border-width: 0 6.5px 8px 6.5px;
      border-bottom-color: var(--fd-color-neutral-4);
      border-left-color: transparent;
      border-right-color: transparent;
      content: "";
      position: absolute;
      top: -9px;
      left: 10px;
      z-index: 1001; }
    .fd-popover__body--left {
      right: auto;
      left: -3px; }
      [dir="rtl"] .fd-popover__body--left, .fd-popover__body--left[dir="rtl"] {
        right: -3px;
        left: auto; }
        [dir="rtl"] .fd-popover__body--left::before, [dir="rtl"] .fd-popover__body--left::after, .fd-popover__body--left[dir="rtl"]::before, .fd-popover__body--left[dir="rtl"]::after {
          right: 14px;
          left: unset; }
      .fd-popover__body--left::before, .fd-popover__body--left::after {
        left: 10px; }
    .fd-popover__body--right {
      left: auto;
      right: -3px; }
      [dir="rtl"] .fd-popover__body--right, .fd-popover__body--right[dir="rtl"] {
        right: auto;
        left: -3px; }
        [dir="rtl"] .fd-popover__body--right::before, [dir="rtl"] .fd-popover__body--right::after, .fd-popover__body--right[dir="rtl"]::before, .fd-popover__body--right[dir="rtl"]::after {
          left: 14px;
          right: unset; }
      .fd-popover__body--right::before, .fd-popover__body--right::after {
        left: auto;
        right: 10px; }
    .fd-popover__body--no-arrow {
      top: 100%; }
      .fd-popover__body--no-arrow::before, .fd-popover__body--no-arrow::after {
        display: none; }
    .fd-popover__body[aria-hidden="true"], .fd-popover__body.is-hidden {
      z-index: 1;
      opacity: 0;
      visibility: hidden;
      transform: translateY(-15px); }
  .fd-popover__popper {
    border: solid 1px #89919a;
    position: absolute;
    white-space: nowrap;
    z-index: 1000;
    border-radius: 4px;
    background-color: var(--fd-color-background-2);
    box-shadow: 0 5px 20px 0 var(--fd-color-neutral-3), 0 2px 8px 0 var(--fd-color-neutral-2);
    opacity: 1; }
    .fd-popover__popper--no-arrow {
      margin: 0 !important; }
      .fd-popover__popper--no-arrow .fd-popover__arrow {
        display: none; }
    .fd-popover__popper .fd-popover__arrow {
      position: absolute;
      width: 0;
      height: 0;
      border-style: solid;
      border-color: transparent; }
      .fd-popover__popper .fd-popover__arrow::after {
        position: absolute;
        content: "";
        border-style: solid;
        border-color: transparent; }
    .fd-popover__popper[x-out-of-boundaries] {
      display: none; }
    .fd-popover__popper[x-placement^="top"] {
      margin-bottom: 8px; }
      .fd-popover__popper[x-placement^="top"] .fd-popover__arrow {
        bottom: -8px;
        margin: 0 6.5px;
        border-width: 8px 6.5px 0 6.5px;
        border-top-color: var(--fd-color-neutral-4); }
        .fd-popover__popper[x-placement^="top"] .fd-popover__arrow::after {
          bottom: 1px;
          margin: 0 -6.5px;
          border-width: 8px 6.5px 0 6.5px;
          border-top-color: var(--fd-color-background-2); }
    .fd-popover__popper[x-placement^="bottom"] {
      margin-top: 8px; }
      .fd-popover__popper[x-placement^="bottom"] .fd-popover__arrow {
        top: -8px;
        margin: 0 6.5px;
        border-width: 0 6.5px 8px 6.5px;
        border-bottom-color: var(--fd-color-neutral-4); }
        .fd-popover__popper[x-placement^="bottom"] .fd-popover__arrow::after {
          top: 1px;
          margin: 0 -6.5px;
          border-width: 0 6.5px 8px 6.5px;
          border-bottom-color: var(--fd-color-background-2); }
    .fd-popover__popper[x-placement^="left"] {
      margin-right: 8px; }
      .fd-popover__popper[x-placement^="left"] .fd-popover__arrow {
        right: -8px;
        margin: 6.5px 0;
        border-width: 6.5px 0 6.5px 8px;
        border-left-color: var(--fd-color-neutral-4); }
        .fd-popover__popper[x-placement^="left"] .fd-popover__arrow::after {
          right: 1px;
          margin: -6.5px 0;
          border-width: 6.5px 0 6.5px 8px;
          border-left-color: var(--fd-color-background-2); }
    .fd-popover__popper[x-placement^="right"] {
      margin-left: 8px; }
      .fd-popover__popper[x-placement^="right"] .fd-popover__arrow {
        left: -8px;
        margin: 6.5px 0;
        border-width: 6.5px 8px 6.5px 0;
        border-right-color: var(--fd-color-neutral-4); }
        .fd-popover__popper[x-placement^="right"] .fd-popover__arrow::after {
          left: 1px;
          margin: -6.5px 0;
          border-width: 6.5px 8px 6.5px 0;
          border-right-color: var(--fd-color-background-2); }

/*!
.fd-date-picker+(--no-border)
    .fd-date-picker__content+()
    .fd-date-picker__title+()
*/
.fd-date-picker .fd-popover__body {
  padding: 0 12px; }

.fd-time {
  width: 184px; }
  .fd-time__item {
    display: inline-block;
    max-width: 40px;
    text-align: center;
    margin-right: 4px; }
    .fd-time__item:last-child {
      margin-right: 0; }
  .fd-time__input {
    margin: 8px 0; }
    .fd-time__input input {
      padding-left: 8px;
      padding-right: 8px;
      text-align: center; }

/*!
.fd-time-picker+(--no-border)
    .fd-time-picker__content+()
    .fd-time-picker__title+()
*/
.fd-time-picker .fd-popover__body {
  padding: 16px; }

.fd-popover__popper .fd-time {
  padding: 16px; }

/*!
.fd-localization-editor+(--no-border)
    .fd-localization-editor__content+()
    .fd-localization-editor__title+()
*/
.fd-localization-editor {
  font-size: 14px;
  line-height: 1.42857;
  color: var(--fd-color-text-1);
  font-family: '72', -apple-system, BlinkMacSystemFont, Segoe UI, Roboto, Helvetica Neue, Arial, sans-serif, Apple Color Emoji, Segoe UI Emoji, Segoe UI Symbol; }
  .fd-localization-editor__list li {
    padding: 8px; }
    .fd-localization-editor__list li > .fd-input-group > input, .fd-localization-editor__list li > .fd-input-group textarea {
      width: 81%; }
  .fd-localization-editor__button {
    height: 100% !important;
    max-height: 100% !important; }
  .fd-localization-editor .fd-popover__body {
    width: 100%; }
  .fd-localization-editor .fd-menu {
    display: block; }
  .fd-localization-editor.is-disabled, .fd-localization-editor[disabled] {
    opacity: 0.5; }

/*!
.fd-combobox
*/
.fd-combobox-input .fd-popover {
  display: block; }
  .fd-combobox-input .fd-popover__body {
    width: 100%; }

.fd-combobox-input .fd-menu {
  display: block; }

/*!
.fd-search-input
*/
.fd-search-input__control {
  position: relative; }
  .fd-search-input__control > .fd-button--shell[aria-expanded="true"] {
    position: relative;
    z-index: 2;
    --fd-button-border-color: transparent;
    --fd-button-background-color: transparent; }
    .fd-search-input__control > .fd-button--shell[aria-expanded="true"]:focus {
      box-shadow: none; }

.fd-search-input__closedcontrol {
  position: absolute;
  top: 0;
  right: 0;
  transition: all 0.125s;
  opacity: 1;
  visibility: visible;
  width: 300px;
  z-index: 1; }
  [dir="rtl"] .fd-search-input__closedcontrol, .fd-search-input__closedcontrol[dir="rtl"] {
    right: auto;
    left: 0; }
  .fd-search-input__closedcontrol[aria-hidden="true"], .fd-search-input__closedcontrol.is-hidden {
    opacity: 0;
    visibility: hidden;
    width: 300px; }

.fd-search-input .fd-popover {
  display: block; }
  .fd-search-input .fd-popover__body {
    width: 100%; }

.fd-search-input .fd-menu {
  display: block;
  text-align: left; }
  [dir="rtl"] .fd-search-input .fd-menu, .fd-search-input .fd-menu[dir="rtl"] {
    text-align: right; }

.fd-search-input--closed .fd-popover__body {
  width: 300px;
  left: -264px; }
  [dir="rtl"] .fd-search-input--closed .fd-popover__body, .fd-search-input--closed .fd-popover__body[dir="rtl"] {
    left: 0;
    right: auto; }

/*!
.fd-multi-input
*/
.fd-multi-input .fd-popover {
  display: block; }
  .fd-multi-input .fd-popover__body {
    width: 100%; }

.fd-multi-input .fd-menu {
  display: block; }

.fd-multi-input-field {
  margin: 0 0 10px 0; }

/*!
.fd-product-switcher
*/
.fd-product-switcher {
  position: relative;
  display: inline-block; }
  .fd-product-switcher__body {
    padding: 20px 10px 0 10px;
    color: initial; }
    .fd-product-switcher__body > nav > ul {
      margin: 0;
      padding: 0;
      list-style: none;
      overflow: hidden;
      width: 450px; }
      .fd-product-switcher__body > nav > ul > li {
        float: left;
        width: 150px;
        text-align: center;
        padding: 0 5px;
        margin: 0 0 30px 0; }
        [dir="rtl"] .fd-product-switcher__body > nav > ul > li, .fd-product-switcher__body > nav > ul > li[dir="rtl"] {
          float: right; }
  .fd-product-switcher__product-icon {
    display: block;
    height: 40px;
    margin: 0 0 10px 0; }
    .fd-product-switcher__product-icon > img {
      display: block;
      max-width: 140px;
      margin: 0 auto; }
  .fd-product-switcher__product-title {
    display: block; }

.fd-shellbar {
  --fd-shellbar-color: var(--fd-color-text-5);
  --fd-shellbar-background-color: var(--fd-color-shell-1);
  --fd-shellbar-link-color: var(--fd-color-shell-2);
  font-size: 14px;
  line-height: 1.42857;
  color: var(--fd-color-text-1);
  font-family: '72', -apple-system, BlinkMacSystemFont, Segoe UI, Roboto, Helvetica Neue, Arial, sans-serif, Apple Color Emoji, Segoe UI Emoji, Segoe UI Symbol;
  background-color: var(--fd-shellbar-background-color);
  height: 48px;
  display: flex;
  align-items: center;
  color: var(--fd-shellbar-color);
  position: relative;
  padding: 4px 32px;
  justify-content: space-between; }
  .fd-shellbar__group--start {
    display: flex;
    align-items: center; }
  .fd-shellbar__group--start, .fd-shellbar__group--end {
    flex: 1; }
  .fd-shellbar__group--middle {
    width: 30px; }
  .fd-shellbar__group--end {
    text-align: right; }
    [dir="rtl"] .fd-shellbar__group--end, .fd-shellbar__group--end[dir="rtl"] {
      text-align: left; }
  .fd-shellbar__logo, .fd-shellbar__product, .fd-shellbar__subtitle {
    display: inline-block;
    vertical-align: middle; }
  .fd-shellbar__logo {
    display: flex;
    align-items: center;
    vertical-align: middle;
    max-height: 40px;
    background-repeat: no-repeat;
    background-size: contain; }
    @media (min-width: 600px) {
      .fd-shellbar__logo {
        display: inline-block;
        margin-right: 8px; }
        [dir="rtl"] .fd-shellbar__logo, .fd-shellbar__logo[dir="rtl"] {
          margin-right: 0;
          margin-left: 8px; } }
    .fd-shellbar__logo--control {
      display: inline-block; }
      @media (min-width: 600px) {
        .fd-shellbar__logo--control {
          display: none !important; } }
    .fd-shellbar__logo img,
    .fd-shellbar__logo svg {
      max-height: 40px;
      width: auto;
      display: block; }
    .fd-shellbar__logo--image-replaced {
      background-image: url(data:image/svg+xml;base64,PHN2ZyBpZD0iTGF5ZXJfMSIgZGF0YS1uYW1lPSJMYXllciAxIiB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHZpZXdCb3g9IjAgMCA0MTIuMzggMjA0Ij48ZGVmcz48c3R5bGU+LmNscy0xLC5jbHMtMntmaWxsLXJ1bGU6ZXZlbm9kZH0uY2xzLTF7ZmlsbDp1cmwoI2xpbmVhci1ncmFkaWVudCl9LmNscy0ye2ZpbGw6I2ZmZn08L3N0eWxlPjxsaW5lYXJHcmFkaWVudCBpZD0ibGluZWFyLWdyYWRpZW50IiB4MT0iMjA2LjE5IiB4Mj0iMjA2LjE5IiB5Mj0iMjA0IiBncmFkaWVudFVuaXRzPSJ1c2VyU3BhY2VPblVzZSI+PHN0b3Agb2Zmc2V0PSIwIiBzdG9wLWNvbG9yPSIjMDBiOGYxIi8+PHN0b3Agb2Zmc2V0PSIuMDIiIHN0b3AtY29sb3I9IiMwMWI2ZjAiLz48c3RvcCBvZmZzZXQ9Ii4zMSIgc3RvcC1jb2xvcj0iIzBkOTBkOSIvPjxzdG9wIG9mZnNldD0iLjU4IiBzdG9wLWNvbG9yPSIjMTc3NWM4Ii8+PHN0b3Agb2Zmc2V0PSIuODIiIHN0b3AtY29sb3I9IiMxYzY1YmYiLz48c3RvcCBvZmZzZXQ9IjEiIHN0b3AtY29sb3I9IiMxZTVmYmIiLz48L2xpbmVhckdyYWRpZW50PjwvZGVmcz48dGl0bGU+U0FQX2dyYWRfUl9zY3JuX1plaWNoZW5mbMOkY2hlIDE8L3RpdGxlPjxwYXRoIGNsYXNzPSJjbHMtMSIgZD0iTTAgMjA0aDIwOC40MUw0MTIuMzggMEgwdjIwNCIvPjxwYXRoIGNsYXNzPSJjbHMtMiIgZD0iTTI0NC43MyAzOC4zNmgtNDAuNnY5Ni41MmwtMzUuNDYtOTYuNTVoLTM1LjE2bC0zMC4yNyA4MC43MkMxMDAgOTguNyA3OSA5MS42NyA2Mi40IDg2LjQgNTEuNDYgODIuODkgMzkuODUgNzcuNzIgNDAgNzJjLjA5LTQuNjggNi4yMy05IDE4LjM4LTguMzggOC4xNy40MyAxNS4zNyAxLjA5IDI5LjcxIDhsMTQuMS0yNC41NUM4OS4wNiA0MC40MiA3MSAzNi4yMSA1Ni4xNyAzNi4xOWgtLjA5Yy0xNy4yOCAwLTMxLjY4IDUuNi00MC42IDE0LjgzQTM0LjIzIDM0LjIzIDAgMCAwIDUuNzcgNzQuN0M1LjU0IDg3LjE1IDEwLjExIDk2IDE5LjcxIDEwM2M4LjEgNS45NCAxOC40NiA5Ljc5IDI3LjYgMTIuNjIgMTEuMjcgMy40OSAyMC40NyA2LjUzIDIwLjM2IDEzQTkuNTcgOS41NyAwIDAgMSA2NSAxMzVjLTIuODEgMi45LTcuMTMgNC0xMy4wOSA0LjEtMTEuNDkuMjQtMjAtMS41Ni0zMy42MS05LjU5TDUuNzcgMTU0LjQyYTkzLjc3IDkzLjc3IDAgMCAwIDQ2IDEyLjIyaDIuMTFjMTQuMjQtLjI1IDI1Ljc0LTQuMzEgMzQuOTItMTEuNzEuNTMtLjQxIDEtLjg0IDEuNDktMS4yOGwtNC4xMiAxMC44NUgxMjNsNi4xOS0xOC44MmE2Ny40NiA2Ny40NiAwIDAgMCAyMS42OCAzLjQzIDY4LjMzIDY4LjMzIDAgMCAwIDIxLjE2LTMuMjVsNiAxOC42NGg2MC4xNHYtMzloMTMuMTFjMzEuNzEgMCA1MC40Ni0xNi4xNSA1MC40Ni00My4yIDAtMzAuMTEtMTguMjItNDMuOTQtNTcuMDEtNDMuOTR6TTE1MC45MSAxMjFhMzYuOTMgMzYuOTMgMCAwIDEtMTMtMi4yOGwxMi44Ny00MC41OWguMjJsMTIuNjUgNDAuNzFhMzguNSAzOC41IDAgMCAxLTEyLjc0IDIuMTZ6bTk2LjItMjMuMzNoLTguOTRWNjQuOTFoOC45NGMxMS45MyAwIDIxLjQ0IDQgMjEuNDQgMTYuMTQgMCAxMi42LTkuNTEgMTYuNTctMjEuNDQgMTYuNTciLz48L3N2Zz4=);
      width: 48px;
      height: 24px; }
  .fd-shellbar__product {
    padding: 0 8px 0 0;
    text-overflow: ellipsis;
    min-width: 0; }
    @media (min-width: 320px) {
      .fd-shellbar__product {
        max-width: 60%; } }
    @media (min-width: 600px) {
      .fd-shellbar__product {
        max-width: 60%; } }
    [dir="rtl"] .fd-shellbar__product, .fd-shellbar__product[dir="rtl"] {
      padding: 0 0 0 8px; }
  .fd-shellbar__title {
    font-size: 1.14286rem;
    line-height: 1.25;
    font-weight: 400;
    font-weight: 700;
    line-height: 1;
    color: var(--fd-shellbar-color);
    white-space: nowrap;
    overflow: hidden;
    max-width: 100%;
    text-overflow: ellipsis;
    display: none; }
    @media (min-width: 600px) {
      .fd-shellbar__title {
        display: inline-block; } }
  .fd-shellbar__subtitle {
    font-size: 0.85714rem;
    line-height: 1.33333;
    font-weight: 400;
    font-weight: 400;
    line-height: 1;
    padding: 0 16px; }
    @media (min-width: 320px) {
      .fd-shellbar__subtitle {
        display: none; } }
    @media (min-width: 600px) {
      .fd-shellbar__subtitle {
        display: none; } }
    @media (min-width: 1024px) {
      .fd-shellbar__subtitle {
        display: inline-block; } }
  .fd-shellbar__copilot {
    display: inline-block;
    vertical-align: middle;
    width: 30px;
    height: 30px; }
    .fd-shellbar__copilot > img {
      display: block;
      max-width: 100%; }
  .fd-shellbar__actions, .fd-shellbar__action {
    display: inline-block; }
    .fd-shellbar__actions > *, .fd-shellbar__action > * {
      vertical-align: middle; }
  .fd-shellbar__action {
    position: relative;
    padding-right: 0;
    padding-left: 12px; }
    [dir="rtl"] .fd-shellbar__action, .fd-shellbar__action[dir="rtl"] {
      padding-right: 12px;
      padding-left: 0; }
    @media (min-width: 320px) {
      .fd-shellbar__action--collapse {
        display: inline-block; } }
    @media (min-width: 600px) {
      .fd-shellbar__action--collapse {
        display: inline-block; } }
    @media (min-width: 1024px) {
      .fd-shellbar__action--collapse {
        display: none; } }
    @media (min-width: 320px) {
      .fd-shellbar__action--collapsible {
        display: none; } }
    @media (min-width: 600px) {
      .fd-shellbar__action--collapsible {
        display: none; } }
    @media (min-width: 1024px) {
      .fd-shellbar__action--collapsible {
        display: inline-block; } }
    @media (min-width: 320px) {
      .fd-shellbar__action--show-always {
        display: inline-block; } }
    @media (min-width: 600px) {
      .fd-shellbar__action--show-always {
        display: inline-block; } }
    @media (min-width: 1024px) {
      .fd-shellbar__action--show-always {
        display: inline-block; } }
  .fd-shellbar .fd-search-input .fd-input {
    border-style: solid;
    border-width: 1px;
    border-color: var(--fd-shellbar-link-color);
    background-color: var(--fd-shellbar-background-color);
    color: var(--fd-shellbar-link-color); }
    .fd-shellbar .fd-search-input .fd-input:focus {
      box-shadow: none; }
  @media (min-width: 320px) {
    .fd-shellbar {
      padding: 4px 8px; } }
  @media (min-width: 600px) {
    .fd-shellbar {
      padding: 4px 16px; } }
  @media (min-width: 1024px) {
    .fd-shellbar {
      padding: 4px 32px; } }
  @media (min-width: 1440px) {
    .fd-shellbar {
      padding: 4px 32px; } }
  @media (min-width: 1920px) {
    .fd-shellbar {
      padding: 4px 32px; } }

/*!
.fd-user-menu
*/
.fd-user-menu {
  font-size: 14px;
  line-height: 1.42857;
  color: var(--fd-color-text-1);
  font-family: '72', -apple-system, BlinkMacSystemFont, Segoe UI, Roboto, Helvetica Neue, Arial, sans-serif, Apple Color Emoji, Segoe UI Emoji, Segoe UI Symbol;
  text-align: left; }
  .fd-user-menu__control {
    padding: 4px; }

/*!
.fd-product-menu+()
*/
.fd-product-menu {
  padding-right: 8px; }
  [dir="rtl"] .fd-product-menu, .fd-product-menu[dir="rtl"] {
    padding-right: 0;
    padding-left: 8px; }
  .fd-product-menu__control {
    color: inherit;
    position: relative;
    display: inline-block;
    margin: 0;
    padding: 0;
    font-smoothing: antialiased;
    /* stylelint-disable-line property-no-unknown */
    appearance: none;
    outline: 0;
    border: 0;
    display: inline-block;
    text-decoration: none;
    cursor: pointer;
    user-select: none;
    vertical-align: middle;
    white-space: nowrap;
    background-color: transparent;
    border-radius: 4px;
    height: var(--fd-forms-height);
    position: relative;
    padding-right: 20px;
    padding-left: 0; }
    [dir="rtl"] .fd-product-menu__control, .fd-product-menu__control[dir="rtl"] {
      padding-right: 0;
      padding-left: 20px; }
    .fd-product-menu__control::after {
      height: 0;
      width: 0;
      border-style: solid;
      border-width: 5px 5px 0 5px;
      border-top-color: var(--fd-color-shell-2);
      border-left-color: transparent;
      border-right-color: transparent;
      content: "";
      position: absolute;
      top: calc(50% - 2.5px);
      margin-left: 8px;
      margin-right: 8px; }
  .fd-product-menu .fd-popover__body--right {
    right: -10px; }
    [dir="rtl"] .fd-product-menu .fd-popover__body--right, .fd-product-menu .fd-popover__body--right[dir="rtl"] {
      right: auto;
      left: -14px; }

/*!
.fd-counter+(--notification)
*/
.fd-counter {
  --fd-counter-color: var(--fd-color-text-5);
  --fd-counter-background-color: var(--fd-color-status-4);
  border-radius: 4px;
  color: var(--fd-counter-color);
  background-color: var(--fd-counter-background-color);
  font-size: 0.78571em;
  line-height: 1;
  display: inline-block;
  text-align: center;
  padding: 4px; }
  .fd-counter--notification {
    --fd-counter-background-color: var(--fd-color-status-3);
    position: absolute;
    transform: translate(-40%, -50%); }
    [dir="rtl"] .fd-counter--notification, .fd-counter--notification[dir="rtl"] {
      transform: translate(40%, -50%); }

.fd-has-type-minus-1 {
  font-size: 0.85714rem;
  line-height: 1.33333;
  font-weight: 400; }

.fd-has-type-0 {
  font-size: 1rem;
  line-height: 1.42857;
  font-weight: 400; }

.fd-has-type-1 {
  font-size: 1.14286rem;
  line-height: 1.25;
  font-weight: 400; }

.fd-has-type-2 {
  font-size: 1.28571rem;
  line-height: 1.33333;
  font-weight: 400; }

.fd-has-type-3 {
  font-size: 1.42857rem;
  line-height: 1.4;
  font-weight: 400; }

.fd-has-type-4 {
  font-size: 1.71429rem;
  line-height: 1.33333;
  font-weight: 400; }

.fd-has-type-5 {
  font-size: 2.57143rem;
  line-height: 1.11111;
  font-weight: 400; }

.fd-has-type-6 {
  font-size: 3.42857rem;
  line-height: 1.08333;
  font-weight: 400; }

.fd-has-font-family-body {
  font-family: '72', -apple-system, BlinkMacSystemFont, Segoe UI, Roboto, Helvetica Neue, Arial, sans-serif, Apple Color Emoji, Segoe UI Emoji, Segoe UI Symbol !important; }

.fd-has-font-family-header {
  font-family: '72', -apple-system, BlinkMacSystemFont, Segoe UI, Roboto, Helvetica Neue, Arial, sans-serif, Apple Color Emoji, Segoe UI Emoji, Segoe UI Symbol !important; }

.fd-has-font-family-code {
  font-family: monospace !important; }

.fd-has-font-weight-light {
  font-weight: 300 !important; }

.fd-has-font-weight-normal {
  font-weight: 400 !important; }

.fd-has-font-weight-bold {
  font-weight: 700 !important; }

.fd-has-font-style-italic {
  font-style: italic !important; }

.fd-has-text-transform-none {
  text-transform: none !important; }

.fd-has-text-transform-uppercase {
  text-transform: uppercase !important; }

.fd-has-text-transform-lowercase {
  text-transform: lowercase !important; }

.fd-has-text-align-center {
  text-align: center !important; }

.fd-has-text-align-right {
  text-align: right !important; }

.fd-has-color-action,
.fd-has-color-action-1 {
  color: var(--fd-color-action-1) !important; }

.fd-has-color-action-2 {
  color: var(--fd-color-action-2) !important; }

.fd-has-color-action-3 {
  color: var(--fd-color-action-3) !important; }

.fd-has-color-text,
.fd-has-color-text-1 {
  color: var(--fd-color-text-1) !important; }

.fd-has-color-text-2 {
  color: var(--fd-color-text-2) !important; }

.fd-has-color-text-3 {
  color: var(--fd-color-text-3) !important; }

.fd-has-color-text-4 {
  color: var(--fd-color-text-4) !important; }

.fd-has-color-text-5 {
  color: var(--fd-color-text-5) !important; }

.fd-has-color-background,
.fd-has-color-background-1 {
  color: var(--fd-color-background-1) !important; }

.fd-has-color-background-2 {
  color: var(--fd-color-background-2) !important; }

.fd-has-color-background-3 {
  color: var(--fd-color-background-3) !important; }

.fd-has-color-background-4 {
  color: var(--fd-color-background-4) !important; }

.fd-has-color-background-5 {
  color: var(--fd-color-background-5) !important; }

.fd-has-color-background-6 {
  color: var(--fd-color-background-6) !important; }

.fd-has-color-background-7 {
  color: var(--fd-color-background-7) !important; }

.fd-has-color-neutral,
.fd-has-color-neutral-1 {
  color: var(--fd-color-neutral-1) !important; }

.fd-has-color-neutral-2 {
  color: var(--fd-color-neutral-2) !important; }

.fd-has-color-neutral-3 {
  color: var(--fd-color-neutral-3) !important; }

.fd-has-color-neutral-4 {
  color: var(--fd-color-neutral-4) !important; }

.fd-has-color-neutral-5 {
  color: var(--fd-color-neutral-5) !important; }

.fd-has-color-neutral-6 {
  color: var(--fd-color-neutral-6) !important; }

.fd-has-color-status,
.fd-has-color-status-1 {
  color: var(--fd-color-status-1) !important; }

.fd-has-color-status-2 {
  color: var(--fd-color-status-2) !important; }

.fd-has-color-status-3 {
  color: var(--fd-color-status-3) !important; }

.fd-has-color-status-4 {
  color: var(--fd-color-status-4) !important; }

.fd-has-color-status-5 {
  color: var(--fd-color-status-5) !important; }

.fd-has-color-accent,
.fd-has-color-accent-1 {
  color: var(--fd-color-accent-1) !important; }

.fd-has-color-accent-2 {
  color: var(--fd-color-accent-2) !important; }

.fd-has-color-accent-3 {
  color: var(--fd-color-accent-3) !important; }

.fd-has-color-accent-4 {
  color: var(--fd-color-accent-4) !important; }

.fd-has-color-accent-5 {
  color: var(--fd-color-accent-5) !important; }

.fd-has-color-accent-6 {
  color: var(--fd-color-accent-6) !important; }

.fd-has-color-accent-7 {
  color: var(--fd-color-accent-7) !important; }

.fd-has-color-accent-8 {
  color: var(--fd-color-accent-8) !important; }

.fd-has-color-accent-9 {
  color: var(--fd-color-accent-9) !important; }

.fd-has-color-accent-10 {
  color: var(--fd-color-accent-10) !important; }

.fd-has-color-accent-11 {
  color: var(--fd-color-accent-11) !important; }

.fd-has-color-accent-12 {
  color: var(--fd-color-accent-12) !important; }

.fd-has-color-accent-13 {
  color: var(--fd-color-accent-13) !important; }

.fd-has-color-accent-14 {
  color: var(--fd-color-accent-14) !important; }

.fd-has-color-accent-15 {
  color: var(--fd-color-accent-15) !important; }

.fd-has-color-shell,
.fd-has-color-shell-1 {
  color: var(--fd-color-shell-1) !important; }

.fd-has-color-shell-2 {
  color: var(--fd-color-shell-2) !important; }

.fd-has-color-shell-3 {
  color: var(--fd-color-shell-3) !important; }

.fd-has-color-shell-4 {
  color: var(--fd-color-shell-4) !important; }

.fd-has-color-shell-5 {
  color: var(--fd-color-shell-5) !important; }

.fd-has-color-action-hover {
  color: var(--fd-color-action-hover) !important; }

.fd-has-color-action-selected {
  color: var(--fd-color-action-selected) !important; }

.fd-has-color-action-disabled {
  color: var(--fd-color-action-disabled) !important; }

.fd-has-color-action-visited {
  color: var(--fd-color-action-visited) !important; }

.fd-has-color-background-hover {
  color: var(--fd-color-background-hover) !important; }

.fd-has-color-background-selected {
  color: var(--fd-color-background-selected) !important; }

.fd-has-color-background-selected-hover {
  color: var(--fd-color-background-selected-hover) !important; }

.fd-has-color-background-positive {
  color: var(--fd-color-background-positive) !important; }

.fd-has-color-background-negative {
  color: var(--fd-color-background-negative) !important; }

.fd-has-color-background-alert {
  color: var(--fd-color-background-alert) !important; }

.fd-has-color-background-information {
  color: var(--fd-color-background-information) !important; }

.fd-has-background-image {
  background-repeat: no-repeat;
  background-position: center;
  background-size: contain; }

.fd-has-background-fixed {
  background-repeat: no-repeat;
  background-position: center;
  background-attachment: fixed; }

.fd-has-background-size-contain {
  background-size: contain !important; }

.fd-has-background-size-cover {
  background-size: cover !important; }

.fd-has-background-color-transparent,
.fd-has-background-color-none {
  background-color: transparent !important; }

.fd-has-background-color-action,
.fd-has-background-color-action-1 {
  background-color: var(--fd-color-action-1) !important; }

.fd-has-background-color-action-2 {
  background-color: var(--fd-color-action-2) !important; }

.fd-has-background-color-action-3 {
  background-color: var(--fd-color-action-3) !important; }

.fd-has-background-color-text,
.fd-has-background-color-text-1 {
  background-color: var(--fd-color-text-1) !important; }

.fd-has-background-color-text-2 {
  background-color: var(--fd-color-text-2) !important; }

.fd-has-background-color-text-3 {
  background-color: var(--fd-color-text-3) !important; }

.fd-has-background-color-text-4 {
  background-color: var(--fd-color-text-4) !important; }

.fd-has-background-color-text-5 {
  background-color: var(--fd-color-text-5) !important; }

.fd-has-background-color-background,
.fd-has-background-color-background-1 {
  background-color: var(--fd-color-background-1) !important; }

.fd-has-background-color-background-2 {
  background-color: var(--fd-color-background-2) !important; }

.fd-has-background-color-background-3 {
  background-color: var(--fd-color-background-3) !important; }

.fd-has-background-color-background-4 {
  background-color: var(--fd-color-background-4) !important; }

.fd-has-background-color-background-5 {
  background-color: var(--fd-color-background-5) !important; }

.fd-has-background-color-background-6 {
  background-color: var(--fd-color-background-6) !important; }

.fd-has-background-color-background-7 {
  background-color: var(--fd-color-background-7) !important; }

.fd-has-background-color-neutral,
.fd-has-background-color-neutral-1 {
  background-color: var(--fd-color-neutral-1) !important; }

.fd-has-background-color-neutral-2 {
  background-color: var(--fd-color-neutral-2) !important; }

.fd-has-background-color-neutral-3 {
  background-color: var(--fd-color-neutral-3) !important; }

.fd-has-background-color-neutral-4 {
  background-color: var(--fd-color-neutral-4) !important; }

.fd-has-background-color-neutral-5 {
  background-color: var(--fd-color-neutral-5) !important; }

.fd-has-background-color-neutral-6 {
  background-color: var(--fd-color-neutral-6) !important; }

.fd-has-background-color-status,
.fd-has-background-color-status-1 {
  background-color: var(--fd-color-status-1) !important; }

.fd-has-background-color-status-2 {
  background-color: var(--fd-color-status-2) !important; }

.fd-has-background-color-status-3 {
  background-color: var(--fd-color-status-3) !important; }

.fd-has-background-color-status-4 {
  background-color: var(--fd-color-status-4) !important; }

.fd-has-background-color-status-5 {
  background-color: var(--fd-color-status-5) !important; }

.fd-has-background-color-accent,
.fd-has-background-color-accent-1 {
  background-color: var(--fd-color-accent-1) !important; }

.fd-has-background-color-accent-2 {
  background-color: var(--fd-color-accent-2) !important; }

.fd-has-background-color-accent-3 {
  background-color: var(--fd-color-accent-3) !important; }

.fd-has-background-color-accent-4 {
  background-color: var(--fd-color-accent-4) !important; }

.fd-has-background-color-accent-5 {
  background-color: var(--fd-color-accent-5) !important; }

.fd-has-background-color-accent-6 {
  background-color: var(--fd-color-accent-6) !important; }

.fd-has-background-color-accent-7 {
  background-color: var(--fd-color-accent-7) !important; }

.fd-has-background-color-accent-8 {
  background-color: var(--fd-color-accent-8) !important; }

.fd-has-background-color-accent-9 {
  background-color: var(--fd-color-accent-9) !important; }

.fd-has-background-color-accent-10 {
  background-color: var(--fd-color-accent-10) !important; }

.fd-has-background-color-accent-11 {
  background-color: var(--fd-color-accent-11) !important; }

.fd-has-background-color-accent-12 {
  background-color: var(--fd-color-accent-12) !important; }

.fd-has-background-color-accent-13 {
  background-color: var(--fd-color-accent-13) !important; }

.fd-has-background-color-accent-14 {
  background-color: var(--fd-color-accent-14) !important; }

.fd-has-background-color-accent-15 {
  background-color: var(--fd-color-accent-15) !important; }

.fd-has-background-color-shell,
.fd-has-background-color-shell-1 {
  background-color: var(--fd-color-shell-1) !important; }

.fd-has-background-color-shell-2 {
  background-color: var(--fd-color-shell-2) !important; }

.fd-has-background-color-shell-3 {
  background-color: var(--fd-color-shell-3) !important; }

.fd-has-background-color-shell-4 {
  background-color: var(--fd-color-shell-4) !important; }

.fd-has-background-color-shell-5 {
  background-color: var(--fd-color-shell-5) !important; }

.fd-has-background-color-action-hover {
  background-color: var(--fd-color-action-hover) !important; }

.fd-has-background-color-action-selected {
  background-color: var(--fd-color-action-selected) !important; }

.fd-has-background-color-action-disabled {
  background-color: var(--fd-color-action-disabled) !important; }

.fd-has-background-color-action-visited {
  background-color: var(--fd-color-action-visited) !important; }

.fd-has-background-color-background-hover {
  background-color: var(--fd-color-background-hover) !important; }

.fd-has-background-color-background-selected {
  background-color: var(--fd-color-background-selected) !important; }

.fd-has-background-color-background-selected-hover {
  background-color: var(--fd-color-background-selected-hover) !important; }

.fd-has-background-color-background-positive {
  background-color: var(--fd-color-background-positive) !important; }

.fd-has-background-color-background-negative {
  background-color: var(--fd-color-background-negative) !important; }

.fd-has-background-color-background-alert {
  background-color: var(--fd-color-background-alert) !important; }

.fd-has-background-color-background-information {
  background-color: var(--fd-color-background-information) !important; }

.fd-has-border-radius-0 {
  border-radius: 0 !important; }

.fd-has-border-radius-50percent {
  border-radius: 50% !important; }

.fd-has-border-none {
  border: none !important; }

.fd-has-top-border-none {
  border: none !important; }

.fd-has-right-border-none {
  border: none !important; }

.fd-has-bottom-border-none {
  border: none !important; }

.fd-has-left-border-none {
  border: none !important; }

.fd-has-border-begin-none {
  border-left: none !important; }
  [direction="rtl"] .fd-has-border-begin-none, .fd-has-border-begin-none[direction="rtl"] {
    border-right: none !important; }

.fd-has-border-after-none {
  border-right: none !important; }
  [direction="rtl"] .fd-has-border-after-none, .fd-has-border-after-none[direction="rtl"] {
    border-left: none !important; }

.fd-has-border-color-action,
.fd-has-border-color-action-1 {
  border-color: var(--fd-color-action-1) !important; }

.fd-has-border-color-action-2 {
  border-color: var(--fd-color-action-2) !important; }

.fd-has-border-color-action-3 {
  border-color: var(--fd-color-action-3) !important; }

.fd-has-border-color-text,
.fd-has-border-color-text-1 {
  border-color: var(--fd-color-text-1) !important; }

.fd-has-border-color-text-2 {
  border-color: var(--fd-color-text-2) !important; }

.fd-has-border-color-text-3 {
  border-color: var(--fd-color-text-3) !important; }

.fd-has-border-color-text-4 {
  border-color: var(--fd-color-text-4) !important; }

.fd-has-border-color-text-5 {
  border-color: var(--fd-color-text-5) !important; }

.fd-has-border-color-background,
.fd-has-border-color-background-1 {
  border-color: var(--fd-color-background-1) !important; }

.fd-has-border-color-background-2 {
  border-color: var(--fd-color-background-2) !important; }

.fd-has-border-color-background-3 {
  border-color: var(--fd-color-background-3) !important; }

.fd-has-border-color-background-4 {
  border-color: var(--fd-color-background-4) !important; }

.fd-has-border-color-background-5 {
  border-color: var(--fd-color-background-5) !important; }

.fd-has-border-color-background-6 {
  border-color: var(--fd-color-background-6) !important; }

.fd-has-border-color-background-7 {
  border-color: var(--fd-color-background-7) !important; }

.fd-has-border-color-neutral,
.fd-has-border-color-neutral-1 {
  border-color: var(--fd-color-neutral-1) !important; }

.fd-has-border-color-neutral-2 {
  border-color: var(--fd-color-neutral-2) !important; }

.fd-has-border-color-neutral-3 {
  border-color: var(--fd-color-neutral-3) !important; }

.fd-has-border-color-neutral-4 {
  border-color: var(--fd-color-neutral-4) !important; }

.fd-has-border-color-neutral-5 {
  border-color: var(--fd-color-neutral-5) !important; }

.fd-has-border-color-neutral-6 {
  border-color: var(--fd-color-neutral-6) !important; }

.fd-has-border-color-status,
.fd-has-border-color-status-1 {
  border-color: var(--fd-color-status-1) !important; }

.fd-has-border-color-status-2 {
  border-color: var(--fd-color-status-2) !important; }

.fd-has-border-color-status-3 {
  border-color: var(--fd-color-status-3) !important; }

.fd-has-border-color-status-4 {
  border-color: var(--fd-color-status-4) !important; }

.fd-has-border-color-status-5 {
  border-color: var(--fd-color-status-5) !important; }

.fd-has-border-color-accent,
.fd-has-border-color-accent-1 {
  border-color: var(--fd-color-accent-1) !important; }

.fd-has-border-color-accent-2 {
  border-color: var(--fd-color-accent-2) !important; }

.fd-has-border-color-accent-3 {
  border-color: var(--fd-color-accent-3) !important; }

.fd-has-border-color-accent-4 {
  border-color: var(--fd-color-accent-4) !important; }

.fd-has-border-color-accent-5 {
  border-color: var(--fd-color-accent-5) !important; }

.fd-has-border-color-accent-6 {
  border-color: var(--fd-color-accent-6) !important; }

.fd-has-border-color-accent-7 {
  border-color: var(--fd-color-accent-7) !important; }

.fd-has-border-color-accent-8 {
  border-color: var(--fd-color-accent-8) !important; }

.fd-has-border-color-accent-9 {
  border-color: var(--fd-color-accent-9) !important; }

.fd-has-border-color-accent-10 {
  border-color: var(--fd-color-accent-10) !important; }

.fd-has-border-color-accent-11 {
  border-color: var(--fd-color-accent-11) !important; }

.fd-has-border-color-accent-12 {
  border-color: var(--fd-color-accent-12) !important; }

.fd-has-border-color-accent-13 {
  border-color: var(--fd-color-accent-13) !important; }

.fd-has-border-color-accent-14 {
  border-color: var(--fd-color-accent-14) !important; }

.fd-has-border-color-accent-15 {
  border-color: var(--fd-color-accent-15) !important; }

.fd-has-border-color-shell,
.fd-has-border-color-shell-1 {
  border-color: var(--fd-color-shell-1) !important; }

.fd-has-border-color-shell-2 {
  border-color: var(--fd-color-shell-2) !important; }

.fd-has-border-color-shell-3 {
  border-color: var(--fd-color-shell-3) !important; }

.fd-has-border-color-shell-4 {
  border-color: var(--fd-color-shell-4) !important; }

.fd-has-border-color-shell-5 {
  border-color: var(--fd-color-shell-5) !important; }

.fd-has-border-color-action-hover {
  border-color: var(--fd-color-action-hover) !important; }

.fd-has-border-color-action-selected {
  border-color: var(--fd-color-action-selected) !important; }

.fd-has-border-color-action-disabled {
  border-color: var(--fd-color-action-disabled) !important; }

.fd-has-border-color-action-visited {
  border-color: var(--fd-color-action-visited) !important; }

.fd-has-border-color-background-hover {
  border-color: var(--fd-color-background-hover) !important; }

.fd-has-border-color-background-selected {
  border-color: var(--fd-color-background-selected) !important; }

.fd-has-border-color-background-selected-hover {
  border-color: var(--fd-color-background-selected-hover) !important; }

.fd-has-border-color-background-positive {
  border-color: var(--fd-color-background-positive) !important; }

.fd-has-border-color-background-negative {
  border-color: var(--fd-color-background-negative) !important; }

.fd-has-border-color-background-alert {
  border-color: var(--fd-color-background-alert) !important; }

.fd-has-border-color-background-information {
  border-color: var(--fd-color-background-information) !important; }

.fd-has-display-none {
  display: none !important; }

.fd-has-display-block {
  display: block !important; }

.fd-has-display-inline-block {
  display: inline-block !important; }

.fd-has-display-grid {
  display: grid !important; }

.fd-has-display-inline-grid {
  display: inline-grid !important; }

.fd-has-display-flex {
  display: flex !important; }

.fd-has-display-inline-flex {
  display: inline-flex !important; }

.fd-has-display-table {
  display: table !important; }

.fd-has-display-table-row {
  display: table-row !important; }

.fd-has-display-table-cell {
  display: table-cell !important; }

.fd-display-s-none {
  display: none !important; }

.fd-display-s-inline {
  display: inline !important; }

.fd-display-s-inline-block {
  display: inline-block !important; }

.fd-display-s-block {
  display: block !important; }

.fd-display-s-table {
  display: table !important; }

.fd-display-s-table-row {
  display: table-row !important; }

.fd-display-s-table-cell {
  display: table-cell !important; }

.fd-display-s-flex {
  display: flex !important; }

.fd-display-s-inline-flex {
  display: inline-flex !important; }

.fd-has-display-none--s {
  display: none !important; }

.fd-has-display-block--s {
  display: block !important; }

.fd-has-display-inline-block--s {
  display: inline-block !important; }

.fd-has-display-grid--s {
  display: grid !important; }

.fd-has-display-inline-grid--s {
  display: inline-grid !important; }

.fd-has-display-flex--s {
  display: flex !important; }

.fd-has-display-inline-flex--s {
  display: inline-flex !important; }

.fd-has-display-table--s {
  display: table !important; }

.fd-has-display-table-row--s {
  display: table-row !important; }

.fd-has-display-table-cell--s {
  display: table-cell !important; }

.fd-display-m-none {
  display: none !important; }

.fd-display-m-inline {
  display: inline !important; }

.fd-display-m-inline-block {
  display: inline-block !important; }

.fd-display-m-block {
  display: block !important; }

.fd-display-m-table {
  display: table !important; }

.fd-display-m-table-row {
  display: table-row !important; }

.fd-display-m-table-cell {
  display: table-cell !important; }

.fd-display-m-flex {
  display: flex !important; }

.fd-display-m-inline-flex {
  display: inline-flex !important; }

.fd-has-display-none--m {
  display: none !important; }

.fd-has-display-block--m {
  display: block !important; }

.fd-has-display-inline-block--m {
  display: inline-block !important; }

.fd-has-display-grid--m {
  display: grid !important; }

.fd-has-display-inline-grid--m {
  display: inline-grid !important; }

.fd-has-display-flex--m {
  display: flex !important; }

.fd-has-display-inline-flex--m {
  display: inline-flex !important; }

.fd-has-display-table--m {
  display: table !important; }

.fd-has-display-table-row--m {
  display: table-row !important; }

.fd-has-display-table-cell--m {
  display: table-cell !important; }

.fd-display-l-none {
  display: none !important; }

.fd-display-l-inline {
  display: inline !important; }

.fd-display-l-inline-block {
  display: inline-block !important; }

.fd-display-l-block {
  display: block !important; }

.fd-display-l-table {
  display: table !important; }

.fd-display-l-table-row {
  display: table-row !important; }

.fd-display-l-table-cell {
  display: table-cell !important; }

.fd-display-l-flex {
  display: flex !important; }

.fd-display-l-inline-flex {
  display: inline-flex !important; }

.fd-has-display-none--l {
  display: none !important; }

.fd-has-display-block--l {
  display: block !important; }

.fd-has-display-inline-block--l {
  display: inline-block !important; }

.fd-has-display-grid--l {
  display: grid !important; }

.fd-has-display-inline-grid--l {
  display: inline-grid !important; }

.fd-has-display-flex--l {
  display: flex !important; }

.fd-has-display-inline-flex--l {
  display: inline-flex !important; }

.fd-has-display-table--l {
  display: table !important; }

.fd-has-display-table-row--l {
  display: table-row !important; }

.fd-has-display-table-cell--l {
  display: table-cell !important; }

.fd-display-xl-none {
  display: none !important; }

.fd-display-xl-inline {
  display: inline !important; }

.fd-display-xl-inline-block {
  display: inline-block !important; }

.fd-display-xl-block {
  display: block !important; }

.fd-display-xl-table {
  display: table !important; }

.fd-display-xl-table-row {
  display: table-row !important; }

.fd-display-xl-table-cell {
  display: table-cell !important; }

.fd-display-xl-flex {
  display: flex !important; }

.fd-display-xl-inline-flex {
  display: inline-flex !important; }

.fd-has-display-none--xl {
  display: none !important; }

.fd-has-display-block--xl {
  display: block !important; }

.fd-has-display-inline-block--xl {
  display: inline-block !important; }

.fd-has-display-grid--xl {
  display: grid !important; }

.fd-has-display-inline-grid--xl {
  display: inline-grid !important; }

.fd-has-display-flex--xl {
  display: flex !important; }

.fd-has-display-inline-flex--xl {
  display: inline-flex !important; }

.fd-has-display-table--xl {
  display: table !important; }

.fd-has-display-table-row--xl {
  display: table-row !important; }

.fd-has-display-table-cell--xl {
  display: table-cell !important; }

.fd-display-xxl-none {
  display: none !important; }

.fd-display-xxl-inline {
  display: inline !important; }

.fd-display-xxl-inline-block {
  display: inline-block !important; }

.fd-display-xxl-block {
  display: block !important; }

.fd-display-xxl-table {
  display: table !important; }

.fd-display-xxl-table-row {
  display: table-row !important; }

.fd-display-xxl-table-cell {
  display: table-cell !important; }

.fd-display-xxl-flex {
  display: flex !important; }

.fd-display-xxl-inline-flex {
  display: inline-flex !important; }

.fd-has-display-none--xxl {
  display: none !important; }

.fd-has-display-block--xxl {
  display: block !important; }

.fd-has-display-inline-block--xxl {
  display: inline-block !important; }

.fd-has-display-grid--xxl {
  display: grid !important; }

.fd-has-display-inline-grid--xxl {
  display: inline-grid !important; }

.fd-has-display-flex--xxl {
  display: flex !important; }

.fd-has-display-inline-flex--xxl {
  display: inline-flex !important; }

.fd-has-display-table--xxl {
  display: table !important; }

.fd-has-display-table-row--xxl {
  display: table-row !important; }

.fd-has-display-table-cell--xxl {
  display: table-cell !important; }

.fd-has-height-base {
  height: 4px !important; }

.fd-has-margin-base {
  margin: 4px !important; }

.fd-has-padding-base {
  padding: 4px !important; }

.fd-has-margin-top-base {
  margin-top: 4px !important; }

.fd-has-padding-top-base {
  padding-top: 4px !important; }

.fd-has-margin-right-base {
  margin-right: 4px !important; }

.fd-has-padding-right-base {
  padding-right: 4px !important; }

.fd-has-margin-bottom-base {
  margin-bottom: 4px !important; }

.fd-has-padding-bottom-base {
  padding-bottom: 4px !important; }

.fd-has-margin-left-base {
  margin-left: 4px !important; }

.fd-has-padding-left-base {
  padding-left: 4px !important; }

.fd-has-height-xxs {
  height: 8px !important; }

.fd-has-margin-xxs {
  margin: 8px !important; }

.fd-has-padding-xxs {
  padding: 8px !important; }

.fd-has-margin-top-xxs {
  margin-top: 8px !important; }

.fd-has-padding-top-xxs {
  padding-top: 8px !important; }

.fd-has-margin-right-xxs {
  margin-right: 8px !important; }

.fd-has-padding-right-xxs {
  padding-right: 8px !important; }

.fd-has-margin-bottom-xxs {
  margin-bottom: 8px !important; }

.fd-has-padding-bottom-xxs {
  padding-bottom: 8px !important; }

.fd-has-margin-left-xxs {
  margin-left: 8px !important; }

.fd-has-padding-left-xxs {
  padding-left: 8px !important; }

.fd-has-height-xs {
  height: 12px !important; }

.fd-has-margin-xs {
  margin: 12px !important; }

.fd-has-padding-xs, .docs-component > p {
  padding: 12px !important; }

.fd-has-margin-top-xs {
  margin-top: 12px !important; }

.fd-has-padding-top-xs {
  padding-top: 12px !important; }

.fd-has-margin-right-xs {
  margin-right: 12px !important; }

.fd-has-padding-right-xs {
  padding-right: 12px !important; }

.fd-has-margin-bottom-xs {
  margin-bottom: 12px !important; }

.fd-has-padding-bottom-xs {
  padding-bottom: 12px !important; }

.fd-has-margin-left-xs {
  margin-left: 12px !important; }

.fd-has-padding-left-xs {
  padding-left: 12px !important; }

.fd-has-height-s {
  height: 16px !important; }

.fd-has-margin-s {
  margin: 16px !important; }

.fd-has-padding-s {
  padding: 16px !important; }

.fd-has-margin-top-s {
  margin-top: 16px !important; }

.fd-has-padding-top-s {
  padding-top: 16px !important; }

.fd-has-margin-right-s {
  margin-right: 16px !important; }

.fd-has-padding-right-s {
  padding-right: 16px !important; }

.fd-has-margin-bottom-s {
  margin-bottom: 16px !important; }

.fd-has-padding-bottom-s {
  padding-bottom: 16px !important; }

.fd-has-margin-left-s {
  margin-left: 16px !important; }

.fd-has-padding-left-s {
  padding-left: 16px !important; }

.fd-has-height-reg {
  height: 24px !important; }

.fd-has-margin-reg {
  margin: 24px !important; }

.fd-has-padding-reg {
  padding: 24px !important; }

.fd-has-margin-top-reg {
  margin-top: 24px !important; }

.fd-has-padding-top-reg {
  padding-top: 24px !important; }

.fd-has-margin-right-reg {
  margin-right: 24px !important; }

.fd-has-padding-right-reg {
  padding-right: 24px !important; }

.fd-has-margin-bottom-reg {
  margin-bottom: 24px !important; }

.fd-has-padding-bottom-reg {
  padding-bottom: 24px !important; }

.fd-has-margin-left-reg {
  margin-left: 24px !important; }

.fd-has-padding-left-reg {
  padding-left: 24px !important; }

.fd-has-height-m {
  height: 32px !important; }

.fd-has-margin-m {
  margin: 32px !important; }

.fd-has-padding-m {
  padding: 32px !important; }

.fd-has-margin-top-m {
  margin-top: 32px !important; }

.fd-has-padding-top-m {
  padding-top: 32px !important; }

.fd-has-margin-right-m {
  margin-right: 32px !important; }

.fd-has-padding-right-m {
  padding-right: 32px !important; }

.fd-has-margin-bottom-m {
  margin-bottom: 32px !important; }

.fd-has-padding-bottom-m {
  padding-bottom: 32px !important; }

.fd-has-margin-left-m {
  margin-left: 32px !important; }

.fd-has-padding-left-m {
  padding-left: 32px !important; }

.fd-has-height-l {
  height: 36px !important; }

.fd-has-margin-l {
  margin: 36px !important; }

.fd-has-padding-l {
  padding: 36px !important; }

.fd-has-margin-top-l {
  margin-top: 36px !important; }

.fd-has-padding-top-l {
  padding-top: 36px !important; }

.fd-has-margin-right-l {
  margin-right: 36px !important; }

.fd-has-padding-right-l {
  padding-right: 36px !important; }

.fd-has-margin-bottom-l {
  margin-bottom: 36px !important; }

.fd-has-padding-bottom-l {
  padding-bottom: 36px !important; }

.fd-has-margin-left-l {
  margin-left: 36px !important; }

.fd-has-padding-left-l {
  padding-left: 36px !important; }

.fd-has-height-xl {
  height: 40px !important; }

.fd-has-margin-xl {
  margin: 40px !important; }

.fd-has-padding-xl {
  padding: 40px !important; }

.fd-has-margin-top-xl {
  margin-top: 40px !important; }

.fd-has-padding-top-xl {
  padding-top: 40px !important; }

.fd-has-margin-right-xl {
  margin-right: 40px !important; }

.fd-has-padding-right-xl {
  padding-right: 40px !important; }

.fd-has-margin-bottom-xl {
  margin-bottom: 40px !important; }

.fd-has-padding-bottom-xl {
  padding-bottom: 40px !important; }

.fd-has-margin-left-xl {
  margin-left: 40px !important; }

.fd-has-padding-left-xl {
  padding-left: 40px !important; }

.fd-has-height-xxl {
  height: 48px !important; }

.fd-has-margin-xxl {
  margin: 48px !important; }

.fd-has-padding-xxl {
  padding: 48px !important; }

.fd-has-margin-top-xxl {
  margin-top: 48px !important; }

.fd-has-padding-top-xxl {
  padding-top: 48px !important; }

.fd-has-margin-right-xxl {
  margin-right: 48px !important; }

.fd-has-padding-right-xxl {
  padding-right: 48px !important; }

.fd-has-margin-bottom-xxl {
  margin-bottom: 48px !important; }

.fd-has-padding-bottom-xxl {
  padding-bottom: 48px !important; }

.fd-has-margin-left-xxl {
  margin-left: 48px !important; }

.fd-has-padding-left-xxl {
  padding-left: 48px !important; }

.fd-has-height-tiny {
  height: 8px !important; }

.fd-has-margin-tiny {
  margin: 8px !important; }

.fd-has-margin-y-tiny {
  margin-top: 8px !important;
  margin-bottom: 8px !important; }

.fd-has-margin-x-tiny {
  margin-left: 8px !important;
  margin-right: 8px !important; }

.fd-has-padding-tiny {
  padding: 8px !important; }

.fd-has-padding-y-tiny {
  padding-top: 8px !important;
  padding-bottom: 8px !important; }

.fd-has-padding-x-tiny {
  padding-left: 8px !important;
  padding-right: 8px !important; }

.fd-has-margin-top-tiny {
  margin-top: 8px !important; }

.fd-has-padding-top-tiny {
  padding-top: 8px !important; }

.fd-has-margin-right-tiny {
  margin-right: 8px !important; }

.fd-has-padding-right-tiny {
  padding-right: 8px !important; }

.fd-has-margin-bottom-tiny {
  margin-bottom: 8px !important; }

.fd-has-padding-bottom-tiny {
  padding-bottom: 8px !important; }

.fd-has-margin-left-tiny {
  margin-left: 8px !important; }

.fd-has-padding-left-tiny {
  padding-left: 8px !important; }

.fd-has-margin-begin-tiny {
  margin-left: 8px !important; }
  [direction="rtl"] .fd-has-margin-begin-tiny, .fd-has-margin-begin-tiny[direction="rtl"] {
    margin-right: 8px !important; }

.fd-has-padding-begin-tiny {
  padding-left: 8px !important; }
  [direction="rtl"] .fd-has-padding-begin-tiny, .fd-has-padding-begin-tiny[direction="rtl"] {
    padding-right: 8px !important; }

.fd-has-margin-after-tiny {
  margin-left: 8px !important; }
  [direction="rtl"] .fd-has-margin-after-tiny, .fd-has-margin-after-tiny[direction="rtl"] {
    margin-right: 8px !important; }

.fd-has-padding-after-tiny {
  padding-left: 8px !important; }
  [direction="rtl"] .fd-has-padding-after-tiny, .fd-has-padding-after-tiny[direction="rtl"] {
    padding-right: 8px !important; }

.fd-has-margin-none {
  margin: 0 !important; }

.fd-has-padding-none {
  padding: 0 !important; }

.fd-has-margin-top-none {
  margin-top: 0 !important; }

.fd-has-padding-top-none {
  padding-top: 0 !important; }

.fd-has-margin-right-none {
  margin-right: 0 !important; }

.fd-has-padding-right-none {
  padding-right: 0 !important; }

.fd-has-margin-bottom-none {
  margin-bottom: 0 !important; }

.fd-has-padding-bottom-none {
  padding-bottom: 0 !important; }

.fd-has-margin-left-none {
  margin-left: 0 !important; }

.fd-has-padding-left-none {
  padding-left: 0 !important; }

.fd-has-height-small {
  height: 16px !important; }

.fd-has-margin-small {
  margin: 16px !important; }

.fd-has-margin-y-small {
  margin-top: 16px !important;
  margin-bottom: 16px !important; }

.fd-has-margin-x-small {
  margin-left: 16px !important;
  margin-right: 16px !important; }

.fd-has-padding-small {
  padding: 16px !important; }

.fd-has-padding-y-small {
  padding-top: 16px !important;
  padding-bottom: 16px !important; }

.fd-has-padding-x-small {
  padding-left: 16px !important;
  padding-right: 16px !important; }

.fd-has-margin-top-small {
  margin-top: 16px !important; }

.fd-has-padding-top-small {
  padding-top: 16px !important; }

.fd-has-margin-right-small {
  margin-right: 16px !important; }

.fd-has-padding-right-small {
  padding-right: 16px !important; }

.fd-has-margin-bottom-small {
  margin-bottom: 16px !important; }

.fd-has-padding-bottom-small {
  padding-bottom: 16px !important; }

.fd-has-margin-left-small {
  margin-left: 16px !important; }

.fd-has-padding-left-small {
  padding-left: 16px !important; }

.fd-has-margin-begin-small {
  margin-left: 16px !important; }
  [direction="rtl"] .fd-has-margin-begin-small, .fd-has-margin-begin-small[direction="rtl"] {
    margin-right: 16px !important; }

.fd-has-padding-begin-small {
  padding-left: 16px !important; }
  [direction="rtl"] .fd-has-padding-begin-small, .fd-has-padding-begin-small[direction="rtl"] {
    padding-right: 16px !important; }

.fd-has-margin-after-small {
  margin-left: 16px !important; }
  [direction="rtl"] .fd-has-margin-after-small, .fd-has-margin-after-small[direction="rtl"] {
    margin-right: 16px !important; }

.fd-has-padding-after-small {
  padding-left: 16px !important; }
  [direction="rtl"] .fd-has-padding-after-small, .fd-has-padding-after-small[direction="rtl"] {
    padding-right: 16px !important; }

.fd-has-margin-none {
  margin: 0 !important; }

.fd-has-padding-none {
  padding: 0 !important; }

.fd-has-margin-top-none {
  margin-top: 0 !important; }

.fd-has-padding-top-none {
  padding-top: 0 !important; }

.fd-has-margin-right-none {
  margin-right: 0 !important; }

.fd-has-padding-right-none {
  padding-right: 0 !important; }

.fd-has-margin-bottom-none {
  margin-bottom: 0 !important; }

.fd-has-padding-bottom-none {
  padding-bottom: 0 !important; }

.fd-has-margin-left-none {
  margin-left: 0 !important; }

.fd-has-padding-left-none {
  padding-left: 0 !important; }

.fd-has-height-regular {
  height: 24px !important; }

.fd-has-margin-regular {
  margin: 24px !important; }

.fd-has-margin-y-regular {
  margin-top: 24px !important;
  margin-bottom: 24px !important; }

.fd-has-margin-x-regular {
  margin-left: 24px !important;
  margin-right: 24px !important; }

.fd-has-padding-regular {
  padding: 24px !important; }

.fd-has-padding-y-regular {
  padding-top: 24px !important;
  padding-bottom: 24px !important; }

.fd-has-padding-x-regular {
  padding-left: 24px !important;
  padding-right: 24px !important; }

.fd-has-margin-top-regular {
  margin-top: 24px !important; }

.fd-has-padding-top-regular {
  padding-top: 24px !important; }

.fd-has-margin-right-regular {
  margin-right: 24px !important; }

.fd-has-padding-right-regular {
  padding-right: 24px !important; }

.fd-has-margin-bottom-regular {
  margin-bottom: 24px !important; }

.fd-has-padding-bottom-regular {
  padding-bottom: 24px !important; }

.fd-has-margin-left-regular {
  margin-left: 24px !important; }

.fd-has-padding-left-regular {
  padding-left: 24px !important; }

.fd-has-margin-begin-regular {
  margin-left: 24px !important; }
  [direction="rtl"] .fd-has-margin-begin-regular, .fd-has-margin-begin-regular[direction="rtl"] {
    margin-right: 24px !important; }

.fd-has-padding-begin-regular {
  padding-left: 24px !important; }
  [direction="rtl"] .fd-has-padding-begin-regular, .fd-has-padding-begin-regular[direction="rtl"] {
    padding-right: 24px !important; }

.fd-has-margin-after-regular {
  margin-left: 24px !important; }
  [direction="rtl"] .fd-has-margin-after-regular, .fd-has-margin-after-regular[direction="rtl"] {
    margin-right: 24px !important; }

.fd-has-padding-after-regular {
  padding-left: 24px !important; }
  [direction="rtl"] .fd-has-padding-after-regular, .fd-has-padding-after-regular[direction="rtl"] {
    padding-right: 24px !important; }

.fd-has-margin-none {
  margin: 0 !important; }

.fd-has-padding-none {
  padding: 0 !important; }

.fd-has-margin-top-none {
  margin-top: 0 !important; }

.fd-has-padding-top-none {
  padding-top: 0 !important; }

.fd-has-margin-right-none {
  margin-right: 0 !important; }

.fd-has-padding-right-none {
  padding-right: 0 !important; }

.fd-has-margin-bottom-none {
  margin-bottom: 0 !important; }

.fd-has-padding-bottom-none {
  padding-bottom: 0 !important; }

.fd-has-margin-left-none {
  margin-left: 0 !important; }

.fd-has-padding-left-none {
  padding-left: 0 !important; }

.fd-has-height-medium {
  height: 32px !important; }

.fd-has-margin-medium {
  margin: 32px !important; }

.fd-has-margin-y-medium {
  margin-top: 32px !important;
  margin-bottom: 32px !important; }

.fd-has-margin-x-medium {
  margin-left: 32px !important;
  margin-right: 32px !important; }

.fd-has-padding-medium {
  padding: 32px !important; }

.fd-has-padding-y-medium {
  padding-top: 32px !important;
  padding-bottom: 32px !important; }

.fd-has-padding-x-medium {
  padding-left: 32px !important;
  padding-right: 32px !important; }

.fd-has-margin-top-medium {
  margin-top: 32px !important; }

.fd-has-padding-top-medium {
  padding-top: 32px !important; }

.fd-has-margin-right-medium {
  margin-right: 32px !important; }

.fd-has-padding-right-medium {
  padding-right: 32px !important; }

.fd-has-margin-bottom-medium {
  margin-bottom: 32px !important; }

.fd-has-padding-bottom-medium {
  padding-bottom: 32px !important; }

.fd-has-margin-left-medium {
  margin-left: 32px !important; }

.fd-has-padding-left-medium {
  padding-left: 32px !important; }

.fd-has-margin-begin-medium {
  margin-left: 32px !important; }
  [direction="rtl"] .fd-has-margin-begin-medium, .fd-has-margin-begin-medium[direction="rtl"] {
    margin-right: 32px !important; }

.fd-has-padding-begin-medium {
  padding-left: 32px !important; }
  [direction="rtl"] .fd-has-padding-begin-medium, .fd-has-padding-begin-medium[direction="rtl"] {
    padding-right: 32px !important; }

.fd-has-margin-after-medium {
  margin-left: 32px !important; }
  [direction="rtl"] .fd-has-margin-after-medium, .fd-has-margin-after-medium[direction="rtl"] {
    margin-right: 32px !important; }

.fd-has-padding-after-medium {
  padding-left: 32px !important; }
  [direction="rtl"] .fd-has-padding-after-medium, .fd-has-padding-after-medium[direction="rtl"] {
    padding-right: 32px !important; }

.fd-has-margin-none {
  margin: 0 !important; }

.fd-has-padding-none {
  padding: 0 !important; }

.fd-has-margin-top-none {
  margin-top: 0 !important; }

.fd-has-padding-top-none {
  padding-top: 0 !important; }

.fd-has-margin-right-none {
  margin-right: 0 !important; }

.fd-has-padding-right-none {
  padding-right: 0 !important; }

.fd-has-margin-bottom-none {
  margin-bottom: 0 !important; }

.fd-has-padding-bottom-none {
  padding-bottom: 0 !important; }

.fd-has-margin-left-none {
  margin-left: 0 !important; }

.fd-has-padding-left-none {
  padding-left: 0 !important; }

.fd-has-height-large {
  height: 48px !important; }

.fd-has-margin-large {
  margin: 48px !important; }

.fd-has-margin-y-large {
  margin-top: 48px !important;
  margin-bottom: 48px !important; }

.fd-has-margin-x-large {
  margin-left: 48px !important;
  margin-right: 48px !important; }

.fd-has-padding-large {
  padding: 48px !important; }

.fd-has-padding-y-large {
  padding-top: 48px !important;
  padding-bottom: 48px !important; }

.fd-has-padding-x-large {
  padding-left: 48px !important;
  padding-right: 48px !important; }

.fd-has-margin-top-large {
  margin-top: 48px !important; }

.fd-has-padding-top-large {
  padding-top: 48px !important; }

.fd-has-margin-right-large {
  margin-right: 48px !important; }

.fd-has-padding-right-large {
  padding-right: 48px !important; }

.fd-has-margin-bottom-large {
  margin-bottom: 48px !important; }

.fd-has-padding-bottom-large {
  padding-bottom: 48px !important; }

.fd-has-margin-left-large {
  margin-left: 48px !important; }

.fd-has-padding-left-large {
  padding-left: 48px !important; }

.fd-has-margin-begin-large {
  margin-left: 48px !important; }
  [direction="rtl"] .fd-has-margin-begin-large, .fd-has-margin-begin-large[direction="rtl"] {
    margin-right: 48px !important; }

.fd-has-padding-begin-large {
  padding-left: 48px !important; }
  [direction="rtl"] .fd-has-padding-begin-large, .fd-has-padding-begin-large[direction="rtl"] {
    padding-right: 48px !important; }

.fd-has-margin-after-large {
  margin-left: 48px !important; }
  [direction="rtl"] .fd-has-margin-after-large, .fd-has-margin-after-large[direction="rtl"] {
    margin-right: 48px !important; }

.fd-has-padding-after-large {
  padding-left: 48px !important; }
  [direction="rtl"] .fd-has-padding-after-large, .fd-has-padding-after-large[direction="rtl"] {
    padding-right: 48px !important; }

.fd-has-margin-none {
  margin: 0 !important; }

.fd-has-padding-none {
  padding: 0 !important; }

.fd-has-margin-top-none {
  margin-top: 0 !important; }

.fd-has-padding-top-none {
  padding-top: 0 !important; }

.fd-has-margin-right-none {
  margin-right: 0 !important; }

.fd-has-padding-right-none {
  padding-right: 0 !important; }

.fd-has-margin-bottom-none {
  margin-bottom: 0 !important; }

.fd-has-padding-bottom-none {
  padding-bottom: 0 !important; }

.fd-has-margin-left-none {
  margin-left: 0 !important; }

.fd-has-padding-left-none {
  padding-left: 0 !important; }

.fd-has-clearfix::after {
  content: "";
  display: table;
  clear: both; }

.fd-has-float-left {
  float: left !important; }

.fd-has-float-right {
  float: right !important; }

.fd-has-grid-row-span-2 {
  grid-row: span 2; }

.fd-has-grid-column-span-2 {
  grid-column: span 2; }

.fd-has-grid-row-span-3 {
  grid-row: span 3; }

.fd-has-grid-column-span-3 {
  grid-column: span 3; }

.fd-has-grid-row-span-4 {
  grid-row: span 4; }

.fd-has-grid-column-span-4 {
  grid-column: span 4; }

.fd-has-grid-row-span-5 {
  grid-row: span 5; }

.fd-has-grid-column-span-5 {
  grid-column: span 5; }

.fd-has-grid-row-span-6 {
  grid-row: span 6; }

.fd-has-grid-column-span-6 {
  grid-column: span 6; }

.fd-has-grid-gap-0,
.fd-has-grid-gap-none {
  grid-gap: 0 !important; }

.fd-has-grid-gap-1 {
  grid-gap: 1px !important; }

.fd-has-align-items-flex-start {
  align-items: flex-start !important; }

.fd-has-align-items-flex-end {
  align-items: flex-end !important; }

.fd-has-align-items-center {
  align-items: center !important; }

.fd-has-align-items-baseline {
  align-items: baseline !important; }

.fd-has-align-items-stretch {
  align-items: stretch !important; }

.fd-has-flex-grow-1 {
  flex-grow: 1 !important; }

.fd-table.fd-has-first-child-text-align-right th:first-child, .fd-has-first-child-text-align-right.docs-table th:first-child,
.fd-table.fd-has-first-child-text-align-right td:first-child,
.fd-has-first-child-text-align-right.docs-table td:first-child {
  text-align: right !important; }

.fd-table.fd-has-last-child-text-align-right th:last-child, .fd-has-last-child-text-align-right.docs-table th:last-child,
.fd-table.fd-has-last-child-text-align-right td:last-child,
.fd-has-last-child-text-align-right.docs-table td:last-child {
  text-align: right !important; }

.fd-table.fd-has-nth-child-2-text-align-right th:nth-child(2), .fd-has-nth-child-2-text-align-right.docs-table th:nth-child(2),
.fd-table.fd-has-nth-child-2-text-align-right td:nth-child(2),
.fd-has-nth-child-2-text-align-right.docs-table td:nth-child(2) {
  text-align: right !important; }

.fd-table.fd-has-nth-child-3-text-align-right th:nth-child(3), .fd-has-nth-child-3-text-align-right.docs-table th:nth-child(3),
.fd-table.fd-has-nth-child-3-text-align-right td:nth-child(3),
.fd-has-nth-child-3-text-align-right.docs-table td:nth-child(3) {
  text-align: right !important; }

.fd-table.fd-has-nth-child-4-text-align-right th:nth-child(4), .fd-has-nth-child-4-text-align-right.docs-table th:nth-child(4),
.fd-table.fd-has-nth-child-4-text-align-right td:nth-child(4),
.fd-has-nth-child-4-text-align-right.docs-table td:nth-child(4) {
  text-align: right !important; }

.fd-table.fd-has-nth-child-5-text-align-right th:nth-child(5), .fd-has-nth-child-5-text-align-right.docs-table th:nth-child(5),
.fd-table.fd-has-nth-child-5-text-align-right td:nth-child(5),
.fd-has-nth-child-5-text-align-right.docs-table td:nth-child(5) {
  text-align: right !important; }

.fd-table.fd-has-nth-child-6-text-align-right th:nth-child(6), .fd-has-nth-child-6-text-align-right.docs-table th:nth-child(6),
.fd-table.fd-has-nth-child-6-text-align-right td:nth-child(6),
.fd-has-nth-child-6-text-align-right.docs-table td:nth-child(6) {
  text-align: right !important; }

.fd-table.fd-has-nth-child-7-text-align-right th:nth-child(7), .fd-has-nth-child-7-text-align-right.docs-table th:nth-child(7),
.fd-table.fd-has-nth-child-7-text-align-right td:nth-child(7),
.fd-has-nth-child-7-text-align-right.docs-table td:nth-child(7) {
  text-align: right !important; }

.fd-table.fd-has-nth-child-8-text-align-right th:nth-child(8), .fd-has-nth-child-8-text-align-right.docs-table th:nth-child(8),
.fd-table.fd-has-nth-child-8-text-align-right td:nth-child(8),
.fd-has-nth-child-8-text-align-right.docs-table td:nth-child(8) {
  text-align: right !important; }

.fd-table.fd-has-nth-child-9-text-align-right th:nth-child(9), .fd-has-nth-child-9-text-align-right.docs-table th:nth-child(9),
.fd-table.fd-has-nth-child-9-text-align-right td:nth-child(9),
.fd-has-nth-child-9-text-align-right.docs-table td:nth-child(9) {
  text-align: right !important; }

.has-accent-color {
  color: #5FA8EF; }

.has-accent-background {
  background-color: #5FA8EF; }

.img-fluid {
  max-width: 100%;
  height: auto; }

body {
  font-family: '72', sans-serif;
  background-color: white; }

a, a:visited {
  color: #5FA8EF; }
  a:hover, a:visited:hover {
    color: #5FA8EF; }

ul, ol {
  margin-left: 40px; }

hr {
  margin: 36px 0;
  float: none;
  clear: both; }

.highlight {
  max-width: 1440px;
  margin: 25px 0 0 0; }

.docs-tiles {
  margin: 0 -20px;
  grid-auto-rows: 1fr; }
  .docs-tiles .fd-tile[role="button"] {
    border: 1px solid #cfdbe7;
    margin: 20px;
    padding-top: 10px;
    padding-bottom: 20px;
    text-decoration: none; }
    .docs-tiles .fd-tile[role="button"]:hover {
      border-color: #5FA8EF; }
    .docs-tiles .fd-tile[role="button"]:active, .docs-tiles .fd-tile[role="button"] :focus {
      border-color: #5FA8EF;
      text-decoration: none; }
  .docs-tiles .fd-tile__header {
    color: #5FA8EF !important;
    font-weight: normal;
    font-size: 20px;
    margin-top: 10px;
    margin-bottom: 10px; }
    .docs-tiles .fd-tile__header:last-child {
      margin-bottom: 0; }
  .docs-tiles .fd-tile__content {
    align-self: auto; }
  .docs-tiles .fd-tile__description {
    color: #424e5a; }
  .docs-tiles a:hover {
    color: inherit;
    text-decoration: none; }

hr {
  margin: 36px 0; }

pre {
  display: block;
  padding: 10px;
  margin: 0 0 20px;
  word-break: break-all;
  word-wrap: break-word;
  color: #666;
  background-color: #fff;
  border: 1px solid #ccc;
  border-radius: 5px; }
  pre code {
    padding: 0;
    font-size: inherit;
    color: inherit;
    white-space: pre-wrap;
    background-color: transparent;
    border-radius: 0; }

code {
  padding: 2px 4px;
  font-size: 90%;
  color: #c7254e;
  background-color: #f9f2f4;
  border-radius: 4px; }

blockquote {
  margin: 15px 0;
  padding: 10px;
  border: 1px solid #ccc;
  border-left-width: 5px;
  border-radius: 5px;
  background: #fffde4; }

.docs-container {
  margin-left: 0;
  width: 100%;
  display: flex;
  min-height: calc(100vh - 87px - 89px); }
  @media (max-width: 768px) {
    .docs-container {
      display: inline; } }

.docs-landing-page {
  width: 100%;
  min-width: 1024px; }

.docs-table {
  border: 1px solid #d9d9d9;
  width: 100%; }
  .docs-table td {
    vertical-align: top; }

.docs-status {
  padding: 10px 0;
  margin-bottom: 30px;
  border: solid 1px #d9d9d9;
  border-width: 1px 0; }

.docs-intro {
  font-size: 1.42857rem;
  line-height: 1.4;
  font-weight: 400; }

.docs-alert {
  margin: 0 0 30px 0; }

#mobile-sidenav-btn {
  display: none; }
  @media (max-width: 768px) {
    #mobile-sidenav-btn {
      display: block; } }

.docs-top-nav {
  background-color: #000;
  height: 87px; }
  .docs-top-nav__logo {
    margin-top: 25px;
    margin-left: 35px;
    display: inline-block;
    font-size: 24px;
    font-weight: bold;
    color: white !important; }
    .docs-top-nav__logo:hover {
      text-decoration: none;
      color: white !important; }
    .docs-top-nav__logo__accent {
      font-weight: 100; }
  .docs-top-nav__support {
    font-size: 1.14286rem;
    line-height: 1.25;
    font-weight: 400;
    color: white !important;
    padding: 30px 20px 0 0;
    display: inline-block; }
    @media (max-width: 768px) {
      .docs-top-nav__support {
        display: none; } }
    .docs-top-nav__support--link {
      display: inline-block;
      vertical-align: top; }
  @media (max-width: 768px) {
    .docs-top-nav__mobile {
      display: flex;
      justify-content: space-around;
      align-items: baseline; } }

.side-nav {
  background-color: #EEEEEE;
  padding: 20px 40px;
  float: none;
  vertical-align: top;
  width: 290px;
  min-width: 290px; }
  @media (max-width: 768px) {
    .side-nav {
      width: auto;
      display: none; } }
  .side-nav__headers {
    font-size: 28px;
    font-weight: bold;
    list-style: none; }
    .side-nav__headers:last-child hr {
      display: none; }
    .side-nav__headers > ul {
      display: none; }
    .side-nav__headers.active > ul {
      display: block; }
    .side-nav__headers-link {
      color: #424e5a !important;
      font-family: '72', sans-serif;
      padding: 20px 20px 5px 20px;
      display: block; }
      .side-nav__headers-link:hover {
        color: #424e5a; }
    .side-nav__headers ol, .side-nav__headers ul {
      margin-left: 0; }
  .side-nav__links-container {
    margin: 0 -20px; }
  .side-nav__links {
    list-style: none;
    font-weight: normal; }
    .side-nav__links-link {
      color: #424e5a !important;
      display: block;
      padding: 12px 30px;
      font-weight: lighter;
      font-size: 18px;
      font-family: '72', sans-serif; }
      .side-nav__links-link:hover {
        color: #424e5a;
        text-decoration: none;
        background-color: #fbfbfb; }
    .side-nav__links.active a {
      padding-left: 30px;
      color: red;
      font-weight: bold; }
  .side-nav .search-box {
    margin-bottom: 20px; }
  .side-nav__seperator {
    margin: 15px 20px 0 20px;
    border-bottom: 1px solid #242424;
    opacity: .3; }

.right-nav {
  background-color: #f1f3f6; }

.search-box {
  position: relative; }
  .search-box__icon {
    position: absolute;
    top: 8px;
    left: 8px;
    font-size: 20px;
    color: #cfdbe7; }
  .search-box__input {
    height: 40px !important;
    border-color: #cfdbe7 !important;
    background-color: #ffffff !important;
    padding-left: 36px !important;
    border-radius: 0 !important; }
  .search-box__results {
    list-style: none;
    font-size: 12px;
    background-color: white;
    position: absolute;
    top: 40px;
    z-index: 1;
    width: 100%;
    margin-left: 0;
    border: 1px solid #cfdbe7; }
    .search-box__results-links a {
      color: #424e5a;
      display: block;
      padding: 10px; }
      .search-box__results-links a:hover {
        background-color: #f1f3f6; }

.main-content {
  vertical-align: top;
  flex-grow: 1;
  display: flex;
  flex-direction: column; }

.docs-content {
  padding: 40px 40px 80px 60px;
  min-width: 1024px;
  max-width: 1440px;
  width: 80%; }
  @media (max-width: 768px) {
    .docs-content {
      padding: 10px;
      min-width: auto;
      width: 100%; } }
  .docs-content > ol li,
  .docs-content > ul li {
    margin: 10px 0px 10px 0; }

.docs-content-full-width {
  padding: 40px 40px 80px 40px;
  width: 100%; }
  @media (max-width: 768px) {
    .docs-content-full-width {
      text-align: center;
      padding-top: 20px; } }

.docs-home_hero {
  background-image: url("../images/home-hero-bg.png");
  background-size: cover;
  background-position: -190px -350px;
  background-repeat: no-repeat;
  background-color: #242424;
  color: #d4d4d4;
  padding-top: 100px; }
  @media (max-width: 768px) {
    .docs-home_hero {
      padding-top: 0; } }
  .docs-home_hero-heading {
    font-size: 70px;
    font-weight: 100;
    line-height: 1.1;
    text-shadow: 1px 3px 6px rgba(0, 0, 0, 0.09); }
    @media (max-width: 768px) {
      .docs-home_hero-heading {
        font-size: 40px; } }
  .docs-home_hero-bold {
    font-weight: bold; }
  .docs-home_hero-img {
    float: right; }
    @media (max-width: 768px) {
      .docs-home_hero-img {
        width: 100%; } }
  .docs-home_hero-content {
    padding: 100px; }
    @media (max-width: 768px) {
      .docs-home_hero-content {
        padding: 20px; } }
  .docs-home_hero-description {
    font-size: 20px;
    line-height: 1.2;
    margin-top: 20px;
    margin-bottom: 0;
    max-width: 520px; }
  .docs-home_hero-btn {
    font-size: 16px;
    font-weight: bold;
    background-color: #424e5a;
    color: white !important;
    display: inline-block;
    margin-top: 36px;
    margin-bottom: 32px;
    line-height: 0;
    padding: 20px;
    border: none; }
    @media (max-width: 768px) {
      .docs-home_hero-btn {
        margin-top: 20px;
        margin-bottom: 20px; } }
    .docs-home_hero-btn:hover {
      background-color: #5FA8EF;
      text-decoration: none;
      box-shadow: none; }
  .docs-home_hero-version {
    display: inline-block;
    text-transform: none;
    border-radius: 20px;
    font-weight: normal;
    color: #5FA8EF;
    font-size: 15px; }

.docs-home_panel {
  padding: 100px;
  background: #181818; }
  @media (max-width: 768px) {
    .docs-home_panel {
      padding: 20px; } }
  .docs-home_panel--alt {
    background: #242424; }
  .docs-home_panel-title {
    color: #DFDFDF;
    font-size: 60px;
    border-bottom: 1px solid #979797;
    padding-bottom: 20px;
    margin-bottom: 50px; }
    .docs-home_panel-title a {
      color: #DFDFDF; }
    .docs-home_panel-title a:hover {
      color: #5FA8EF;
      text-decoration: none; }
  .docs-home_panel-heading {
    color: #C7C7C7;
    font-size: 30px;
    margin-top: 20px;
    margin-bottom: 30px;
    font-weight: 100; }
  .docs-home_panel-description {
    color: #8F8F8F;
    font-size: 16px;
    margin-bottom: 30px; }
  .docs-home_panel-action {
    font-size: 15px;
    font-weight: bold;
    margin-bottom: 20px;
    display: inline-block; }
  .docs-home_panel-img {
    float: right; }
  .docs-home_panel-search-box {
    margin-bottom: 40px; }
    .docs-home_panel-search-box .search-box__input {
      border-radius: 40px !important;
      font-size: 22px;
      padding: 30px;
      padding-left: 60px !important;
      border-color: #9B9B9B !important;
      background-color: transparent !important;
      color: white !important; }
    .docs-home_panel-search-box .search-box__icon {
      font-size: 30px;
      color: #9B9B9B;
      padding-left: 10px; }
    .docs-home_panel-search-box .search-box__results {
      border: none;
      top: 65px;
      padding: 0;
      margin-left: 50px;
      width: calc(100% - 100px); }
    .docs-home_panel-search-box .search-box__results-links a {
      font-size: 20px; }
    .docs-home_panel-search-box .search-box__results-links a:hover {
      color: #5FA8EF;
      background: transparent;
      text-decoration: none; }
  .docs-home_panel-resources-link {
    display: block;
    color: #c7c7c7;
    font-size: 20px;
    margin-bottom: 30px;
    position: relative;
    padding-left: 30px; }
    .docs-home_panel-resources-link span {
      position: absolute;
      left: 0px;
      top: 0; }

.docs-home_getting-started {
  width: 50%;
  float: left;
  padding: 100px 50px;
  background-size: cover;
  background-position: center;
  text-align: center;
  display: inline-block;
  transition: all 0.5s ease;
  color: #424e5a; }
  .docs-home_getting-started:hover {
    color: #424e5a; }
  .docs-home_getting-started-label {
    margin-top: 40px;
    display: block;
    font-weight: bold;
    text-transform: uppercase;
    font-size: 16px; }
  .docs-home_getting-started--designer {
    background-image: url("../images/home-designers-bg.png");
    border-right: 1px solid #e4eaf1; }
  .docs-home_getting-started--developer {
    background-image: url("../images/home-developers-bg.png"); }

.docs-home_ui-guidelines {
  text-align: center;
  background-color: #313c46;
  color: #ffffff;
  padding: 100px 0; }
  .docs-home_ui-guidelines-heading {
    font-size: 28px;
    font-weight: 900;
    margin-bottom: 12px; }
  .docs-home_ui-guidelines-description {
    font-size: 14px; }
  .docs-home_ui-guidelines-img {
    height: 120px;
    vertical-align: baseline;
    position: relative;
    margin-bottom: 30px; }
    .docs-home_ui-guidelines-img img {
      position: absolute;
      bottom: 0;
      left: 0;
      right: 0;
      margin-left: auto;
      margin-right: auto; }
  .docs-home_ui-guidelines-link {
    width: 200px;
    display: inline-block;
    font-size: 16px;
    font-weight: bold;
    text-transform: uppercase;
    color: #ffffff !important; }
    .docs-home_ui-guidelines-link:hover {
      color: #ffffff; }

.docs-home_support {
  width: 60%;
  margin: 160px auto;
  display: flex; }
  .docs-home_support-link {
    width: 50%;
    float: left;
    text-align: center;
    color: #313c46; }
    .docs-home_support-link:hover {
      color: #313c46; }
    .docs-home_support-link img {
      display: block;
      margin: 30px auto;
      width: 80px; }

.docs-ui-kit_hero {
  background-image: url("../images/ui-kit/hero-bg.png");
  background-size: contain;
  background-repeat: no-repeat;
  background-color: #242424;
  color: #d4d4d4;
  margin: 30px -60px 10px -60px; }
  @media (max-width: 768px) {
    .docs-ui-kit_hero {
      margin: 0 -20px 10px -10px; } }
  .docs-ui-kit_hero-heading {
    font-size: 32px;
    font-weight: 100;
    line-height: 1.1;
    text-shadow: 1px 3px 6px rgba(0, 0, 0, 0.09); }
    @media (max-width: 768px) {
      .docs-ui-kit_hero-heading {
        font-size: 40px; } }
  .docs-ui-kit_hero-description {
    max-width: 500px;
    margin: 0 auto; }
  .docs-ui-kit_hero-content {
    padding: 60px; }
    @media (max-width: 768px) {
      .docs-ui-kit_hero-content {
        padding: 20px; } }
  .docs-ui-kit_hero-btn {
    font-size: 16px;
    font-weight: bold;
    background-color: #424e5a;
    color: white !important;
    display: inline-block;
    margin-top: 16px;
    margin-bottom: 32px;
    line-height: 0;
    padding: 20px;
    border: none; }
    @media (max-width: 768px) {
      .docs-ui-kit_hero-btn {
        margin-top: 20px;
        margin-bottom: 20px; } }
    .docs-ui-kit_hero-btn:hover {
      background-color: #5FA8EF;
      text-decoration: none;
      box-shadow: none; }

.docs-ui-kit .docs-header-h3, .docs-ui-kit .docs-content > h3 {
  margin-top: 20px;
  text-transform: unset; }

.docs-ui-kit .fd-col--6,
.docs-ui-kit .fd-col--4 {
  padding-right: 20px; }

.docs-header-h1 {
  font-size: 36px;
  font-weight: bold;
  line-height: 1.06;
  text-align: left; }
  @media (max-width: 768px) {
    .docs-header-h1 {
      margin-bottom: 24px; } }

.docs-header-h2, .docs-content > h2 {
  font-size: 28px;
  font-weight: 100;
  line-height: 1.14;
  margin-top: 40px; }

.docs-header-h3, .docs-content > h3 {
  font-size: 16px;
  font-weight: bold;
  line-height: 1.88;
  text-transform: uppercase;
  margin-bottom: 10px;
  margin-top: 40px; }

.docs-header-h4 {
  font-size: 16px;
  font-weight: bold;
  line-height: 1.88;
  margin-bottom: 10px;
  margin-top: 40px; }

.docs-colors_plaque {
  list-style: none;
  margin-left: 0; }
  .docs-colors_plaque_color {
    display: inline-block;
    float: left;
    width: calc(25% - 20px);
    padding: 10px;
    margin-bottom: 20px;
    min-height: 115px;
    display: flex;
    flex-direction: column;
    vertical-align: middle;
    margin-right: 10px; }
    .docs-colors_plaque_color:nth-child(4n) {
      clear: right; }
    .docs-colors_plaque_color-name {
      font-size: 2rem;
      margin-bottom: 5px; }
    .docs-colors_plaque_color-value {
      display: block;
      margin-bottom: 5px; }
    .docs-colors_plaque_color-code {
      display: block; }

.docs-colors_example {
  text-align: center; }
  .docs-colors_example--1 {
    background-color: #edeff0;
    color: #32363a; }
  .docs-colors_example--2 {
    background-color: #0a6ed1;
    color: white; }
  .docs-colors_example--3 {
    background-color: #354a5f;
    color: #d1e8ff; }
  .docs-colors_example--4 {
    background-color: #edeff0;
    color: white; }

.docs-breakpoints-table {
  border: 1px solid #cfdbe7; }
  .docs-breakpoints-table th {
    background-color: #cfdbe7;
    font-size: 14px;
    text-transform: uppercase;
    color: #424e5a;
    font-weight: bold;
    position: relative; }
  .docs-breakpoints-table td {
    font-size: 14px; }
  .docs-breakpoints-table_col-legend {
    position: relative !important; }

.docs-spacing-example {
  background-color: #f1f3f6;
  border: 1px solid #cfdbe7; }

.docs-type_header {
  font-size: 13px;
  font-weight: bold; }

.docs-type_drop-cap {
  float: left;
  font-size: 150px;
  padding: 16px 20px 10px 0;
  margin-left: -10px;
  line-height: 80px;
  font-weight: bold; }

.docs-type_SAP {
  font-size: 20px;
  font-weight: bold; }
  .docs-type_SAP--1 {
    font-size: 30px;
    font-weight: normal;
    line-height: 36px; }
  .docs-type_SAP--2 {
    font-size: 24px;
    font-weight: normal;
    line-height: 32px; }
  .docs-type_SAP--3 {
    font-size: 18px;
    font-weight: normal;
    line-height: 24px; }
  .docs-type_SAP--4 {
    font-size: 16px;
    font-weight: normal;
    line-height: 20px; }
  .docs-type_SAP--5 {
    font-size: 14px;
    font-weight: normal;
    line-height: 20px; }
  .docs-type_SAP--6 {
    font-size: 13px;
    font-weight: normal;
    line-height: 16px; }
  .docs-type_SAP--7 {
    font-size: 12px;
    font-weight: normal;
    line-height: 8px; }
  .docs-type_SAP--8 {
    font-size: 11px;
    font-weight: normal;
    line-height: 8px; }

.docs-type__scale--preview {
  text-align: center;
  vertical-align: bottom;
  padding: 0 20px 10px; }

.docs-type__scale--info {
  text-align: center;
  vertical-align: bottom;
  padding: 10px 20px 0;
  border-top: solid 1px lightgray; }

.docs-component-grid {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  grid-gap: 1px;
  background: #cfdbe7;
  border: 1px solid #cfdbe7;
  border-left: none;
  border-right: none;
  margin: 0 -40px -100px -40px; }
  @media (max-width: 768px) {
    .docs-component-grid {
      grid-template-columns: auto; } }
  .docs-component-grid--item {
    background: white;
    padding: 40px 10px;
    display: block;
    text-align: center;
    position: relative;
    height: 280px;
    z-index: 1;
    transition: all ease-in-out 100ms; }
    .docs-component-grid--item:hover {
      background-color: white;
      box-shadow: 0 0 20px 0 rgba(138, 143, 161, 0.4);
      text-decoration: none;
      z-index: 2;
      transition: all ease-in-out 100ms; }
  .docs-component-grid--label {
    font-size: 18px;
    font-weight: 600;
    line-height: 1.56;
    text-align: center;
    color: #21262c;
    margin-top: 30px;
    position: absolute;
    bottom: 60px;
    left: 0;
    right: 0;
    margin: 0 auto; }
  .docs-component-grid--img__action-bar {
    width: 300px;
    margin-top: 60px; }
  .docs-component-grid--img__alert {
    width: 250px;
    margin-top: 20px; }
  .docs-component-grid--img__status-indicators {
    width: 250px;
    margin-top: 60px; }
  .docs-component-grid--img__button {
    width: 150px;
    margin-top: 40px; }
  .docs-component-grid--img__combobox-input {
    margin-top: 10px; }
  .docs-component-grid--img__contextual-menu {
    width: 100px;
    margin-top: 10px; }
  .docs-component-grid--img__dropdown {
    width: 250px;
    margin-top: 20px; }
  .docs-component-grid--img__icons {
    width: 250px;
    margin-top: 70px; }
  .docs-component-grid--img__identifier {
    width: 200px;
    margin-top: 50px; }
  .docs-component-grid--img__image {
    width: 100px;
    margin-top: 20px; }
  .docs-component-grid--img__inline-help {
    width: 250px;
    margin-top: 30px; }
  .docs-component-grid--img__link {
    width: 100px;
    margin-top: 60px; }
  .docs-component-grid--img__localization-editor {
    margin-top: 60px; }
  .docs-component-grid--img__form {
    width: 250px;
    margin-top: 30px; }
  .docs-component-grid--img__input-group {
    width: 250px;
    margin-top: 30px; }
  .docs-component-grid--img__list-group {
    width: 300px;
    margin-top: 40px; }
  .docs-component-grid--img__loading-spinner {
    width: 50px;
    margin-top: 50px; }
  .docs-component-grid--img__mega-menu {
    width: 110px;
    margin-top: 0px; }
  .docs-component-grid--img__modal {
    width: 230px;
    margin-top: 0px; }
  .docs-component-grid--img__multi-input {
    width: 230px;
    margin-top: 50px; }
  .docs-component-grid--img__pagination {
    width: 300px;
    margin-top: 60px; }
  .docs-component-grid--img__search-input {
    margin-top: 50px; }
  .docs-component-grid--img__side-navigation {
    width: 100px;
    margin-top: 0px; }
  .docs-component-grid--img__shellbar {
    width: 300px;
    margin-top: 50px; }
  .docs-component-grid--img__table {
    width: 300px;
    margin-top: 0px; }
  .docs-component-grid--img__tabs {
    width: 300px;
    margin-top: 60px; }
  .docs-component-grid--img__tag {
    width: 150px;
    margin-top: 50px; }
  .docs-component-grid--img__tile {
    width: 300px;
    margin-top: 40px; }
  .docs-component-grid--img__tile-grid {
    width: 300px;
    margin-top: 20px; }
  .docs-component-grid--img__toggle {
    width: 40px;
    margin-top: 30px; }
  .docs-component-grid--img__toolbar {
    width: 320px;
    margin-top: 60px; }
  .docs-component-grid--img__tree {
    width: 300px;
    margin-top: 0px; }

.docs-component {
  margin-bottom: -28px;
  border-radius: 4px;
  border-bottom-left-radius: 0;
  border-bottom-right-radius: 0;
  padding-bottom: 8px;
  border: 1px solid #ccc;
  position: relative;
  background-color: #f3f4f5;
  transition: background-color .25s; }
  .docs-component > .fd-tile__content {
    padding: 60px 20px;
    overflow: visible; }
  .docs-component pre {
    background-color: #fff !important;
    margin: 25px 0px; }
  .docs-component ul {
    list-style: none;
    margin-left: 0;
    padding-left: 0;
    text-align: left; }
    .docs-component ul a:hover {
      text-decoration: none;
      color: inherit; }
  .docs-component .fd-identifier--s {
    display: inline-block;
    background: transperant; }
  .docs-component .fd-mega-menu__header-link,
  .docs-component .fd-mega-menu__link,
  .docs-component .fd-mega-menu__sublink,
  .docs-component .fd-dropdown__item,
  .docs-component .fd-breadcrumb__link,
  .docs-component .fd-side-nav__link {
    color: inherit; }
    .docs-component .fd-mega-menu__header-link:hover,
    .docs-component .fd-mega-menu__link:hover,
    .docs-component .fd-mega-menu__sublink:hover,
    .docs-component .fd-dropdown__item:hover,
    .docs-component .fd-breadcrumb__link:hover,
    .docs-component .fd-side-nav__link:hover {
      text-decoration: none;
      color: inherit; }
  .docs-component .fd-mega-menu__list,
  .docs-component .fd-mega-menu__sublist {
    margin-left: 0; }
  .docs-component .fd-tabs__link:hover,
  .docs-component .fd-tabs__link:focus {
    text-decoration: none; }
  .docs-component__app {
    height: 500px;
    color: white;
    position: relative; }
    .docs-component__app .fd-shell {
      width: 100%;
      max-width: 100%;
      min-height: 410px;
      max-height: 410px;
      position: relative; }
    .docs-component__app .fd-shell__app {
      height: calc(100%  - 48px);
      margin-top: 0; }
    .docs-component__app .fd-app__navigation {
      height: calc(100%  - 48px);
      margin-top: 48px; }
    .docs-component__app .fd-shell__app,
    .docs-component__app .fd-shell,
    .docs-component__app .fd-app {
      width: 100%;
      max-width: 100%;
      min-height: 410px;
      max-height: 410px; }
    .docs-component__app .fd-shell__header,
    .docs-component__app .fd-app__navigation,
    .docs-component__app .fd-shell__footer,
    .docs-component__app .fd-app__main {
      padding: 10px;
      text-align: center;
      color: #000; }
    .docs-component__app .fd-shell__header, .docs-component__app .fd-shell__footer {
      background-color: #d9d9d9; }
    .docs-component__app .fd-app__navigation {
      background-color: white; }
    .docs-component__app .fd-app__main {
      background-color: #fafafa;
      padding-top: 50px; }
    .docs-component__app .fd-overlay {
      position: absolute;
      width: 100%;
      height: 100%; }
    .docs-component__app .fd-overlay--alert .fd-alert {
      margin-top: -410px; }
    .docs-component__app .docs-component__bg-toggle {
      display: none; }
  .docs-component__app-example {
    color: white;
    position: relative; }
    .docs-component__app-example .fd-shell__app, .docs-component__app-example .fd-shell, .docs-component__app-example .fd-app {
      width: 100%;
      min-height: 410px;
      position: relative;
      margin-top: 0; }
    .docs-component__app-example .fd-app__navigation {
      padding-top: 50px; }
    .docs-component__app-example .fd-app__navigation--vertical {
      width: 250px; }
    .docs-component__app-example .fd-app__main {
      background-color: #fafafa;
      padding-top: 50px; }
    .docs-component__app-example .fd-overlay {
      position: absolute;
      width: 100%;
      height: 100%;
      left: 0;
      top: 0; }
    .docs-component__app-example .fd-side-nav__list,
    .docs-component__app-example .fd-side-nav__sublist,
    .docs-component__app-example .fd-breadcrumb {
      margin-left: 0; }
    .docs-component__app-example .fd-action-bar__description {
      padding: 0; }
  .docs-component__page .fd-page,
  .docs-component__page .fd-page__header,
  .docs-component__page .fd-page__intro,
  .docs-component__page .fd-page__content {
    padding: 10px; }
  .docs-component__page .fd-tile__content {
    padding: 20px 20px; }
  .docs-component__page .docs-component__bg-toggle {
    display: none; }
  .docs-component__section .fd-section {
    background-color: white; }
  .docs-component__section .fd-section__header {
    background-color: #edeff0; }
  .docs-component__section .fd-section__title {
    background-color: white; }
  .docs-component__section .fd-section__actions {
    background-color: white;
    padding: 14px 10px; }
  .docs-component__section .fd-section__footer {
    background-color: #edeff0; }
  .docs-component__section .fd-container {
    background-color: #edeff0; }
  .docs-component__panel .fd-panel,
  .docs-component__panel .fd-panel__header,
  .docs-component__panel .fd-panel__title,
  .docs-component__panel .fd-panel__actions,
  .docs-component__panel .fd-panel__footer,
  .docs-component__panel .fd-container {
    padding: 10px; }
  .docs-component__panel .fd-panel {
    background-color: white; }
  .docs-component__panel .fd-panel__header {
    background-color: #edeff0; }
  .docs-component__panel .fd-panel__title {
    background-color: white; }
  .docs-component__panel .fd-panel__actions {
    background-color: white;
    padding: 14px 10px; }
  .docs-component__panel .fd-panel__footer {
    background-color: #edeff0; }
  .docs-component__panel .fd-container {
    background-color: #edeff0; }
  .docs-component__container .fd-container {
    background-color: white;
    padding: 20px;
    max-width: 800px; }
  .docs-component__container .fd-container--fluid {
    max-width: 100%; }
  .docs-component__container [class^="fd-col"] {
    background-color: #edeff0;
    height: 70px;
    border: 1px solid #d9d9d9;
    text-align: center;
    padding: 10px 5px; }
  .docs-component__global-nav .fd-dropdown__list {
    margin-left: 0; }
  .docs-component__bg-toggle {
    position: absolute;
    right: 10px;
    top: 10px; }
  .docs-component .fd-breadcrumb__link {
    color: #0a6ed1; }
    .docs-component .fd-breadcrumb__link:hover {
      color: #0a6ed1;
      text-decoration: none; }
  .docs-component .fd-side-nav {
    max-width: 250px; }
  .docs-component .fd-side-nav__link {
    color: inherit; }
  .docs-component .fd-side-nav--icons {
    max-width: 65px; }
  .docs-component .fd-dropdown {
    margin-right: 20px; }
  .docs-component > [class*="fd-identifier"] {
    margin-right: 20px; }
  .docs-component > .fd-product-tile {
    min-width: 30%;
    float: left;
    margin-right: 20px; }
  .docs-component .fd-tile-grid .fd-product-tile {
    margin-right: 0; }
  .docs-component a[aria-disabled="true"]:hover,
  .docs-component a[aria-disabled="true"]:visited,
  .docs-component a[aria-disabled="true"]:active,
  .docs-component a[aria-disabled="true"]:focus,
  .docs-component a.is-disabled {
    color: rgba(10, 110, 209, 0.4);
    cursor: not-allowed;
    text-decoration: none; }
  .docs-component .fd-link:hover,
  .docs-component .fd-link:active,
  .docs-component .fd-link:focus {
    text-decoration: none; }
  .docs-component .fd-panel__description, .docs-component .fd-action-bar__description {
    padding: 0; }
  .docs-component .fd-calendar__content {
    background: white; }
  .docs-component .fd-toggle input {
    border-radius: 15px; }
  .docs-component__spacing-example .fd-tile__content [class^="fd-has"] {
    border: 1px solid #ccc;
    background: white;
    margin-bottom: 10px;
    text-align: center; }
  .docs-component__spacing-example .fd-tile__content [class^="fd-has-margin"] {
    padding: 10px; }
  .docs-component__margin-padding-helpers .fd-tile__content [class^="fd-has"] {
    display: block;
    background: white;
    border: 1px solid #ccc;
    padding: 10px; }
  .docs-component__margin-padding-helpers .fd-tile__content [class^="fd-has-padding"] {
    margin: 10px; }
  .docs-component__color-examples .fd-tile__content p {
    padding: 10px;
    display: inline-block;
    width: calc(33%); }

.fd-tile__content--responsive-display {
  padding: 60px 10px 30px 10px !important;
  text-align: center; }

.docs-component--responsive-display__frame {
  border: 1px solid #ccc;
  margin: 0 auto;
  transition: width .25s, height .25s; }

.docs-component--responsive-display__controls {
  position: absolute;
  right: 10px;
  top: 10px; }

.docs-component--responsive-display__full-screen {
  padding: 5px 9px;
  font-size: 1.14286rem;
  color: #6d7678 !important; }
  .docs-component--responsive-display__full-screen:hover {
    color: white !important; }

.docs-footer {
  background: #EAEAEA;
  border-top: 1px solid #cfdbe7;
  bottom: 0;
  padding: 32px;
  width: 100%;
  font-size: 16px; }
  .docs-footer .row {
    margin: 0; }
  .docs-footer__link {
    margin-left: 20px; }

.demo-icon-wrapper {
  padding: 10px;
  float: left;
  width: 16%;
  text-align: center;
  height: 120px; }
  .demo-icon-wrapper span {
    padding: 10px;
    display: inline-block; }
    .demo-icon-wrapper span:before {
      font-size: 35px; }
  .demo-icon-wrapper h5 {
    margin-bottom: 0; }

.docs-officehours {
  padding: 80px 20px 20px 20px;
  color: white; }
  .docs-officehours._one {
    background: #925ace; }
  .docs-officehours._two {
    background: #5c819d; }