diff --git a/.gitignore b/.gitignore index cb742fce1..d5d9fff45 100644 --- a/.gitignore +++ b/.gitignore @@ -10,7 +10,6 @@ npm-debug.log # Fabric files *.sublime-workspace docs.css -dist # Docs files docs/app diff --git a/dist/css/fabric.css b/dist/css/fabric.css new file mode 100644 index 000000000..3af20b561 --- /dev/null +++ b/dist/css/fabric.css @@ -0,0 +1,5616 @@ +/* Copyright (c) Microsoft. All rights reserved. Licensed under the MIT license. See LICENSE in the project root for license information. */ +/** + * Office UI Fabric 4.0.0 + * The front-end framework for building experiences for Office 365. + **/ +.ms-u-borderBox, +.ms-u-borderBox::before, +.ms-u-borderBox::after { + box-sizing: border-box; +} + +.ms-u-borderBase { + border: 1px solid; +} + +.ms-u-clearfix { + *zoom: 1; +} + +.ms-u-clearfix::before, +.ms-u-clearfix::after { + display: table; + content: ''; + line-height: 0; +} + +.ms-u-clearfix::after { + clear: both; +} + +.ms-u-normalize { + box-sizing: border-box; + margin: 0; + padding: 0; + box-shadow: none; +} + +.ms-u-textAlignLeft { + text-align: left; +} + +.ms-u-textAlignCenter { + text-align: center; +} + +.ms-u-textAlignRight { + text-align: right; +} + +.ms-u-screenReaderOnly { + position: absolute; + width: 1px; + height: 1px; + padding: 0; + margin: -1px; + overflow: hidden; + clip: rect(0, 0, 0, 0); + border: 0; +} + +.ms-u-textTruncate { + overflow: hidden; + text-overflow: ellipsis; + white-space: nowrap; + word-wrap: normal; +} + +.ms-u-noWrap { + white-space: nowrap; +} + +.ms-bgColor-themeDark, +.ms-bgColor-themeDark--hover:hover { + background-color: #005a9e; +} + +.ms-bgColor-themeDarkAlt, +.ms-bgColor-themeDarkAlt--hover:hover { + background-color: #106ebe; +} + +.ms-bgColor-themeDarker, +.ms-bgColor-themeDarker--hover:hover { + background-color: #004578; +} + +.ms-bgColor-themePrimary, +.ms-bgColor-themePrimary--hover:hover { + background-color: #0078d7; +} + +.ms-bgColor-themeSecondary, +.ms-bgColor-themeSecondary--hover:hover { + background-color: #2488d8; +} + +.ms-bgColor-themeTertiary, +.ms-bgColor-themeTertiary--hover:hover { + background-color: #69afe5; +} + +.ms-bgColor-themeLight, +.ms-bgColor-themeLight--hover:hover { + background-color: #b3d6f2; +} + +.ms-bgColor-themeLighter, +.ms-bgColor-themeLighter--hover:hover { + background-color: #deecf9; +} + +.ms-bgColor-themeLighterAlt, +.ms-bgColor-themeLighterAlt--hover:hover { + background-color: #eff6fc; +} + +.ms-bgColor-black, +.ms-bgColor-black--hover:hover { + background-color: #000000; +} + +.ms-bgColor-neutralDark, +.ms-bgColor-neutralDark--hover:hover { + background-color: #212121; +} + +.ms-bgColor-neutralPrimary, +.ms-bgColor-neutralPrimary--hover:hover { + background-color: #333333; +} + +.ms-bgColor-neutralPrimaryAlt, +.ms-bgColor-neutralPrimaryAlt--hover:hover { + background-color: #3c3c3c; +} + +.ms-bgColor-neutralSecondary, +.ms-bgColor-neutralSecondary--hover:hover { + background-color: #666666; +} + +.ms-bgColor-neutralSecondaryAlt, +.ms-bgColor-neutralSecondaryAlt--hover:hover { + background-color: #767676; +} + +.ms-bgColor-neutralTertiary, +.ms-bgColor-neutralTertiary--hover:hover { + background-color: #a6a6a6; +} + +.ms-bgColor-neutralTertiaryAlt, +.ms-bgColor-neutralTertiaryAlt--hover:hover { + background-color: #c8c8c8; +} + +.ms-bgColor-neutralLight, +.ms-bgColor-neutralLight--hover:hover { + background-color: #eaeaea; +} + +.ms-bgColor-neutralLighter, +.ms-bgColor-neutralLighter--hover:hover { + background-color: #f4f4f4; +} + +.ms-bgColor-neutralLighterAlt, +.ms-bgColor-neutralLighterAlt--hover:hover { + background-color: #f8f8f8; +} + +.ms-bgColor-white, +.ms-bgColor-white--hover:hover { + background-color: #ffffff; +} + +.ms-bgColor-yellow { + background-color: #ffb900; +} + +.ms-bgColor-yellowLight { + background-color: #fff100; +} + +.ms-bgColor-orange { + background-color: #d83b01; +} + +.ms-bgColor-orangeLight { + background-color: #ea4300; +} + +.ms-bgColor-orangeLighter { + background-color: #ff8c00; +} + +.ms-bgColor-redDark { + background-color: #a80000; +} + +.ms-bgColor-red { + background-color: #e81123; +} + +.ms-bgColor-magentaDark { + background-color: #5c005c; +} + +.ms-bgColor-magenta { + background-color: #b4009e; +} + +.ms-bgColor-magentaLight { + background-color: #e3008c; +} + +.ms-bgColor-purpleDark { + background-color: #32145a; +} + +.ms-bgColor-purple { + background-color: #5c2d91; +} + +.ms-bgColor-purpleLight { + background-color: #b4a0ff; +} + +.ms-bgColor-blueDark { + background-color: #002050; +} + +.ms-bgColor-blueMid { + background-color: #00188f; +} + +.ms-bgColor-blue { + background-color: #0078d7; +} + +.ms-bgColor-blueLight { + background-color: #00bcf2; +} + +.ms-bgColor-tealDark { + background-color: #004b50; +} + +.ms-bgColor-teal { + background-color: #008272; +} + +.ms-bgColor-tealLight { + background-color: #00b294; +} + +.ms-bgColor-greenDark { + background-color: #004b1c; +} + +.ms-bgColor-green { + background-color: #107c10; +} + +.ms-bgColor-greenLight { + background-color: #bad80a; +} + +.ms-bgColor-info { + background-color: #f4f4f4; +} + +.ms-bgColor-success { + background-color: #dff6dd; +} + +.ms-bgColor-severeWarning { + background-color: #fed9cc; +} + +.ms-bgColor-warning { + background-color: #fff4ce; +} + +.ms-bgColor-error { + background-color: #fde7e9; +} + +.ms-borderColor-themeDark, +.ms-borderColor-themeDark--hover:hover { + border-color: #005a9e; +} + +.ms-borderColor-themeDarkAlt, +.ms-borderColor-themeDarkAlt--hover:hover { + border-color: #106ebe; +} + +.ms-borderColor-themeDarker, +.ms-borderColor-themeDarker--hover:hover { + border-color: #004578; +} + +.ms-borderColor-themePrimary, +.ms-borderColor-themePrimary--hover:hover { + border-color: #0078d7; +} + +.ms-borderColor-themeSecondary, +.ms-borderColor-themeSecondary--hover:hover { + border-color: #2488d8; +} + +.ms-borderColor-themeTertiary, +.ms-borderColor-themeTertiary--hover:hover { + border-color: #69afe5; +} + +.ms-borderColor-themeLight, +.ms-borderColor-themeLight--hover:hover { + border-color: #b3d6f2; +} + +.ms-borderColor-themeLighter, +.ms-borderColor-themeLighter--hover:hover { + border-color: #deecf9; +} + +.ms-borderColor-themeLighterAlt, +.ms-borderColor-themeLighterAlt--hover:hover { + border-color: #eff6fc; +} + +.ms-borderColor-black, +.ms-borderColor-black--hover:hover { + border-color: #000000; +} + +.ms-borderColor-neutralDark, +.ms-borderColor-neutralDark--hover:hover { + border-color: #212121; +} + +.ms-borderColor-neutralPrimary, +.ms-borderColor-neutralPrimary--hover:hover { + border-color: #333333; +} + +.ms-borderColor-neutralPrimaryAlt, +.ms-borderColor-neutralPrimaryAlt--hover:hover { + border-color: #3c3c3c; +} + +.ms-borderColor-neutralSecondary, +.ms-borderColor-neutralSecondary--hover:hover { + border-color: #666666; +} + +.ms-borderColor-neutralSecondaryAlt, +.ms-borderColor-neutralSecondaryAlt--hover:hover { + border-color: #767676; +} + +.ms-borderColor-neutralTertiary, +.ms-borderColor-neutralTertiary--hover:hover { + border-color: #a6a6a6; +} + +.ms-borderColor-neutralTertiaryAlt, +.ms-borderColor-neutralTertiaryAlt--hover:hover { + border-color: #c8c8c8; +} + +.ms-borderColor-neutralLight, +.ms-borderColor-neutralLight--hover:hover { + border-color: #eaeaea; +} + +.ms-borderColor-neutralLighter, +.ms-borderColor-neutralLighter--hover:hover { + border-color: #f4f4f4; +} + +.ms-borderColor-neutralLighterAlt, +.ms-borderColor-neutralLighterAlt--hover:hover { + border-color: #f8f8f8; +} + +.ms-borderColor-white, +.ms-borderColor-white--hover:hover { + border-color: #ffffff; +} + +.ms-borderColor-yellow { + border-color: #ffb900; +} + +.ms-borderColor-yellowLight { + border-color: #fff100; +} + +.ms-borderColor-orange { + border-color: #d83b01; +} + +.ms-borderColor-orangeLight { + border-color: #ea4300; +} + +.ms-borderColor-orangeLighter { + border-color: #ff8c00; +} + +.ms-borderColor-redDark { + border-color: #a80000; +} + +.ms-borderColor-red { + border-color: #e81123; +} + +.ms-borderColor-magentaDark { + border-color: #5c005c; +} + +.ms-borderColor-magenta { + border-color: #b4009e; +} + +.ms-borderColor-magentaLight { + border-color: #e3008c; +} + +.ms-borderColor-purpleDark { + border-color: #32145a; +} + +.ms-borderColor-purple { + border-color: #5c2d91; +} + +.ms-borderColor-purpleLight { + border-color: #b4a0ff; +} + +.ms-borderColor-blueDark { + border-color: #002050; +} + +.ms-borderColor-blueMid { + border-color: #00188f; +} + +.ms-borderColor-blue { + border-color: #0078d7; +} + +.ms-borderColor-blueLight { + border-color: #00bcf2; +} + +.ms-borderColor-tealDark { + border-color: #004b50; +} + +.ms-borderColor-teal { + border-color: #008272; +} + +.ms-borderColor-tealLight { + border-color: #00b294; +} + +.ms-borderColor-greenDark { + border-color: #004b1c; +} + +.ms-borderColor-green { + border-color: #107c10; +} + +.ms-borderColor-greenLight { + border-color: #bad80a; +} + +.ms-borderColorTop-themePrimary, +.ms-borderColorTop-themePrimary--hover:hover { + border-top-color: #0078d7; +} + +.ms-font-su { + font-family: 'Segoe UI WestEuropean', 'Segoe UI', -apple-system, BlinkMacSystemFont, 'Roboto', 'Helvetica Neue', sans-serif; + -webkit-font-smoothing: antialiased; + font-size: 42px; + font-weight: 100; +} + +.ms-font-xxl { + font-family: 'Segoe UI WestEuropean', 'Segoe UI', -apple-system, BlinkMacSystemFont, 'Roboto', 'Helvetica Neue', sans-serif; + -webkit-font-smoothing: antialiased; + font-size: 28px; + font-weight: 100; +} + +.ms-font-xl { + font-family: 'Segoe UI WestEuropean', 'Segoe UI', -apple-system, BlinkMacSystemFont, 'Roboto', 'Helvetica Neue', sans-serif; + -webkit-font-smoothing: antialiased; + font-size: 21px; + font-weight: 100; +} + +.ms-font-l { + font-family: 'Segoe UI WestEuropean', 'Segoe UI', -apple-system, BlinkMacSystemFont, 'Roboto', 'Helvetica Neue', sans-serif; + -webkit-font-smoothing: antialiased; + font-size: 17px; + font-weight: 300; +} + +.ms-font-m-plus { + font-family: 'Segoe UI WestEuropean', 'Segoe UI', -apple-system, BlinkMacSystemFont, 'Roboto', 'Helvetica Neue', sans-serif; + -webkit-font-smoothing: antialiased; + font-size: 15px; + font-weight: 400; +} + +.ms-font-m { + font-family: 'Segoe UI WestEuropean', 'Segoe UI', -apple-system, BlinkMacSystemFont, 'Roboto', 'Helvetica Neue', sans-serif; + -webkit-font-smoothing: antialiased; + font-size: 14px; + font-weight: 400; +} + +.ms-font-s-plus { + font-family: 'Segoe UI WestEuropean', 'Segoe UI', -apple-system, BlinkMacSystemFont, 'Roboto', 'Helvetica Neue', sans-serif; + -webkit-font-smoothing: antialiased; + font-size: 13px; + font-weight: 400; +} + +.ms-font-s { + font-family: 'Segoe UI WestEuropean', 'Segoe UI', -apple-system, BlinkMacSystemFont, 'Roboto', 'Helvetica Neue', sans-serif; + -webkit-font-smoothing: antialiased; + font-size: 12px; + font-weight: 400; +} + +.ms-font-xs { + font-family: 'Segoe UI WestEuropean', 'Segoe UI', -apple-system, BlinkMacSystemFont, 'Roboto', 'Helvetica Neue', sans-serif; + -webkit-font-smoothing: antialiased; + font-size: 11px; + font-weight: 400; +} + +.ms-font-mi { + font-family: 'Segoe UI WestEuropean', 'Segoe UI', -apple-system, BlinkMacSystemFont, 'Roboto', 'Helvetica Neue', sans-serif; + -webkit-font-smoothing: antialiased; + font-size: 10px; + font-weight: 600; +} + +.ms-fontWeight-light, +.ms-fontWeight-light--hover:hover { + font-weight: 100; +} + +.ms-fontWeight-semilight, +.ms-fontWeight-semilight--hover:hover { + font-weight: 300; +} + +.ms-fontWeight-regular, +.ms-fontWeight-regular--hover:hover { + font-weight: 400; +} + +.ms-fontWeight-semibold, +.ms-fontWeight-semibold--hover:hover { + font-weight: 600; +} + +.ms-fontSize-su { + font-size: 42px; +} + +.ms-fontSize-xxl { + font-size: 28px; +} + +.ms-fontSize-xl { + font-size: 21px; +} + +.ms-fontSize-l { + font-size: 17px; +} + +.ms-fontSize-mPlus { + font-size: 15px; +} + +.ms-fontSize-m { + font-size: 14px; +} + +.ms-fontSize-sPlus { + font-size: 13px; +} + +.ms-fontSize-s { + font-size: 12px; +} + +.ms-fontSize-xs { + font-size: 11px; +} + +.ms-fontSize-mi { + font-size: 10px; +} + +.ms-fontColor-themeDarker, +.ms-fontColor-themeDarker--hover:hover { + color: #004578; +} + +.ms-fontColor-themeDark, +.ms-fontColor-themeDark--hover:hover { + color: #005a9e; +} + +.ms-fontColor-themeDarkAlt, +.ms-fontColor-themeDarkAlt--hover:hover { + color: #106ebe; +} + +.ms-fontColor-themePrimary, +.ms-fontColor-themePrimary--hover:hover { + color: #0078d7; +} + +.ms-fontColor-themeSecondary, +.ms-fontColor-themeSecondary--hover:hover { + color: #2488d8; +} + +.ms-fontColor-themeTertiary, +.ms-fontColor-themeTertiary--hover:hover { + color: #69afe5; +} + +.ms-fontColor-themeLight, +.ms-fontColor-themeLight--hover:hover { + color: #b3d6f2; +} + +.ms-fontColor-themeLighter, +.ms-fontColor-themeLighter--hover:hover { + color: #deecf9; +} + +.ms-fontColor-themeLighterAlt, +.ms-fontColor-themeLighterAlt--hover:hover { + color: #eff6fc; +} + +.ms-fontColor-black, +.ms-fontColor-black--hover:hover { + color: #000000; +} + +.ms-fontColor-neutralDark, +.ms-fontColor-neutralDark--hover:hover { + color: #212121; +} + +.ms-fontColor-neutralPrimary, +.ms-fontColor-neutralPrimary--hover:hover { + color: #333333; +} + +.ms-fontColor-neutralPrimaryAlt, +.ms-fontColor-neutralPrimaryAlt--hover:hover { + color: #3c3c3c; +} + +.ms-fontColor-neutralSecondary, +.ms-fontColor-neutralSecondary--hover:hover { + color: #666666; +} + +.ms-fontColor-neutralSecondaryAlt, +.ms-fontColor-neutralSecondaryAlt--hover:hover { + color: #767676; +} + +.ms-fontColor-neutralTertiary, +.ms-fontColor-neutralTertiary--hover:hover { + color: #a6a6a6; +} + +.ms-fontColor-neutralTertiaryAlt, +.ms-fontColor-neutralTertiaryAlt--hover:hover { + color: #c8c8c8; +} + +.ms-fontColor-neutralLight, +.ms-fontColor-neutralLight--hover:hover { + color: #eaeaea; +} + +.ms-fontColor-neutralLighter, +.ms-fontColor-neutralLighter--hover:hover { + color: #f4f4f4; +} + +.ms-fontColor-neutralLighterAlt, +.ms-fontColor-neutralLighterAlt--hover:hover { + color: #f8f8f8; +} + +.ms-fontColor-white, +.ms-fontColor-white--hover:hover { + color: #ffffff; +} + +.ms-fontColor-yellow, +.ms-fontColor-yellow--hover:hover { + color: #ffb900; +} + +.ms-fontColor-yellowLight, +.ms-fontColor-yellowLight--hover:hover { + color: #fff100; +} + +.ms-fontColor-orange, +.ms-fontColor-orange--hover:hover { + color: #d83b01; +} + +.ms-fontColor-orangeLight, +.ms-fontColor-orangeLight--hover:hover { + color: #ea4300; +} + +.ms-fontColor-orangeLighter, +.ms-fontColor-orangeLighter--hover:hover { + color: #ff8c00; +} + +.ms-fontColor-redDark, +.ms-fontColor-redDark--hover:hover { + color: #a80000; +} + +.ms-fontColor-red, +.ms-fontColor-red--hover:hover { + color: #e81123; +} + +.ms-fontColor-magentaDark, +.ms-fontColor-magentaDark--hover:hover { + color: #5c005c; +} + +.ms-fontColor-magenta, +.ms-fontColor-magenta--hover:hover { + color: #b4009e; +} + +.ms-fontColor-magentaLight, +.ms-fontColor-magentaLight--hover:hover { + color: #e3008c; +} + +.ms-fontColor-purpleDark, +.ms-fontColor-purpleDark--hover:hover { + color: #32145a; +} + +.ms-fontColor-purple, +.ms-fontColor-purple--hover:hover { + color: #5c2d91; +} + +.ms-fontColor-purpleLight, +.ms-fontColor-purpleLight--hover:hover { + color: #b4a0ff; +} + +.ms-fontColor-blueDark, +.ms-fontColor-blueDark--hover:hover { + color: #002050; +} + +.ms-fontColor-blueMid, +.ms-fontColor-blueMid--hover:hover { + color: #00188f; +} + +.ms-fontColor-blue, +.ms-fontColor-blue--hover:hover { + color: #0078d7; +} + +.ms-fontColor-blueLight, +.ms-fontColor-blueLight--hover:hover { + color: #00bcf2; +} + +.ms-fontColor-tealDark, +.ms-fontColor-tealDark--hover:hover { + color: #004b50; +} + +.ms-fontColor-teal, +.ms-fontColor-teal--hover:hover { + color: #008272; +} + +.ms-fontColor-tealLight, +.ms-fontColor-tealLight--hover:hover { + color: #00b294; +} + +.ms-fontColor-greenDark, +.ms-fontColor-greenDark--hover:hover { + color: #004b1c; +} + +.ms-fontColor-green, +.ms-fontColor-green--hover:hover { + color: #107c10; +} + +.ms-fontColor-greenLight, +.ms-fontColor-greenLight--hover:hover { + color: #bad80a; +} + +.ms-fontColor-info, +.ms-fontColor-info--hover:hover { + color: #767676; +} + +.ms-fontColor-success, +.ms-fontColor-success--hover:hover { + color: #107c10; +} + +.ms-fontColor-alert, +.ms-fontColor-alert--hover:hover { + color: #d83b01; +} + +.ms-fontColor-warning, +.ms-fontColor-warning--hover:hover { + color: #767676; +} + +.ms-fontColor-severeWarning, +.ms-fontColor-severeWarning--hover:hover { + color: #d83b01; +} + +.ms-fontColor-error, +.ms-fontColor-error--hover:hover { + color: #a80000; +} + +/* + Your use of the content in the files referenced here are subject to the terms of the license at http://aka.ms/fabric-font-license +*/ +@font-face { + font-family: 'Segoe UI WestEuropean'; + src: local('Segoe UI Light'), url('https://appsforoffice.microsoft.com/fabric/fonts/SegoeUI-WestEuropean/SegoeUI-Light.woff2') format('woff2'), url('https://appsforoffice.microsoft.com/fabric/fonts/SegoeUI-WestEuropean/SegoeUI-Light.woff') format('woff'), url('https://appsforoffice.microsoft.com/fabric/fonts/SegoeUI-WestEuropean/SegoeUI-Light.ttf') format('truetype'); + font-weight: 100; + font-style: normal; +} + +@font-face { + font-family: 'Segoe UI WestEuropean'; + src: local('Segoe UI'), url('https://appsforoffice.microsoft.com/fabric/fonts/SegoeUI-WestEuropean/SegoeUI-Regular.woff2') format('woff2'), url('https://appsforoffice.microsoft.com/fabric/fonts/SegoeUI-WestEuropean/SegoeUI-Regular.woff') format('woff'), url('https://appsforoffice.microsoft.com/fabric/fonts/SegoeUI-WestEuropean/SegoeUI-Regular.ttf') format('truetype'); + font-weight: 400; + font-style: normal; +} + +@font-face { + font-family: 'Segoe UI WestEuropean'; + src: local('Segoe UI Semibold'), url('https://appsforoffice.microsoft.com/fabric/fonts/SegoeUI-WestEuropean/SegoeUI-Semibold.woff2') format('woff2'), url('https://appsforoffice.microsoft.com/fabric/fonts/SegoeUI-WestEuropean/SegoeUI-Semibold.woff') format('woff'), url('https://appsforoffice.microsoft.com/fabric/fonts/SegoeUI-WestEuropean/SegoeUI-Semibold.ttf') format('truetype'); + font-weight: 600; + font-style: normal; +} + +@font-face { + font-family: 'Segoe UI WestEuropean'; + src: local('Segoe UI Semilight'), url('https://appsforoffice.microsoft.com/fabric/fonts/SegoeUI-WestEuropean/SegoeUI-Semilight.woff2') format('woff2'), url('https://appsforoffice.microsoft.com/fabric/fonts/SegoeUI-WestEuropean/SegoeUI-Semilight.woff') format('woff'), url('https://appsforoffice.microsoft.com/fabric/fonts/SegoeUI-WestEuropean/SegoeUI-Semilight.ttf') format('truetype'); + font-weight: 200; + font-style: normal; +} + +/* + Your use of the content in the files referenced here are subject to the terms of the license at http://aka.ms/fabric-font-license +*/ +/* + Your use of the content in the files referenced here are subject to the terms of the license at http://aka.ms/fabric-font-license +*/ +@font-face { + font-family: 'FabricMDL2Icons'; + src: url('https://appsforoffice.microsoft.com/fabric/fonts/icons/FabricMDL2Icons.woff') format('woff'), url('https://appsforoffice.microsoft.com/fabric/fonts/icons/FabricMDL2Icons.ttf') format('truetype'); + font-weight: normal; + font-style: normal; +} + +.ms-Icon { + -moz-osx-font-smoothing: grayscale; + -webkit-font-smoothing: antialiased; + display: inline-block; + font-family: 'FabricMDL2Icons'; + font-style: normal; + font-weight: normal; + speak: none; +} + +.ms-Icon--DecreaseIndentLegacy::before { + content: '\E290'; +} + +.ms-Icon--IncreaseIndentLegacy::before { + content: '\E291'; +} + +.ms-Icon--GlobalNavButton::before { + content: '\E700'; +} + +.ms-Icon--InternetSharing::before { + content: '\E704'; +} + +.ms-Icon--Brightness::before { + content: '\E706'; +} + +.ms-Icon--MapPin::before { + content: '\E707'; +} + +.ms-Icon--Airplane::before { + content: '\E709'; +} + +.ms-Icon--Tablet::before { + content: '\E70A'; +} + +.ms-Icon--QuickNote::before { + content: '\E70B'; +} + +.ms-Icon--ChevronDown::before { + content: '\E70D'; +} + +.ms-Icon--ChevronUp::before { + content: '\E70E'; +} + +.ms-Icon--Edit::before { + content: '\E70F'; +} + +.ms-Icon--Add::before { + content: '\E710'; +} + +.ms-Icon--Cancel::before { + content: '\E711'; +} + +.ms-Icon--More::before { + content: '\E712'; +} + +.ms-Icon--Settings::before { + content: '\E713'; +} + +.ms-Icon--Video::before { + content: '\E714'; +} + +.ms-Icon--Mail::before { + content: '\E715'; +} + +.ms-Icon--People::before { + content: '\E716'; +} + +.ms-Icon--Phone::before { + content: '\E717'; +} + +.ms-Icon--Pin::before { + content: '\E718'; +} + +.ms-Icon--Shop::before { + content: '\E719'; +} + +.ms-Icon--Link::before { + content: '\E71B'; +} + +.ms-Icon--Filter::before { + content: '\E71C'; +} + +.ms-Icon--Zoom::before { + content: '\E71E'; +} + +.ms-Icon--ZoomOut::before { + content: '\E71F'; +} + +.ms-Icon--Microphone::before { + content: '\E720'; +} + +.ms-Icon--Search::before { + content: '\E721'; +} + +.ms-Icon--Camera::before { + content: '\E722'; +} + +.ms-Icon--Attach::before { + content: '\E723'; +} + +.ms-Icon--Send::before { + content: '\E724'; +} + +.ms-Icon--FavoriteList::before { + content: '\E728'; +} + +.ms-Icon--PageSolid::before { + content: '\E729'; +} + +.ms-Icon--Forward::before { + content: '\E72A'; +} + +.ms-Icon--Back::before { + content: '\E72B'; +} + +.ms-Icon--Refresh::before { + content: '\E72C'; +} + +.ms-Icon--Share::before { + content: '\E72D'; +} + +.ms-Icon--Lock::before { + content: '\E72E'; +} + +.ms-Icon--EMI::before { + content: '\E731'; +} + +.ms-Icon--MiniLink::before { + content: '\E732'; +} + +.ms-Icon--Blocked::before { + content: '\E733'; +} + +.ms-Icon--FavoriteStar::before { + content: '\E734'; +} + +.ms-Icon--FavoriteStarFill::before { + content: '\E735'; +} + +.ms-Icon--ReadingMode::before { + content: '\E736'; +} + +.ms-Icon--Remove::before { + content: '\E738'; +} + +.ms-Icon--Checkbox::before { + content: '\E739'; +} + +.ms-Icon--CheckboxComposite::before { + content: '\E73A'; +} + +.ms-Icon--CheckboxIndeterminate::before { + content: '\E73C'; +} + +.ms-Icon--CheckMark::before { + content: '\E73E'; +} + +.ms-Icon--BackToWindow::before { + content: '\E73F'; +} + +.ms-Icon--FullScreen::before { + content: '\E740'; +} + +.ms-Icon--Print::before { + content: '\E749'; +} + +.ms-Icon--Up::before { + content: '\E74A'; +} + +.ms-Icon--Down::before { + content: '\E74B'; +} + +.ms-Icon--Delete::before { + content: '\E74D'; +} + +.ms-Icon--Save::before { + content: '\E74E'; +} + +.ms-Icon--Sad::before { + content: '\E757'; +} + +.ms-Icon--SIPMove::before { + content: '\E759'; +} + +.ms-Icon--EraseTool::before { + content: '\E75C'; +} + +.ms-Icon--GripperTool::before { + content: '\E75E'; +} + +.ms-Icon--Dialpad::before { + content: '\E75F'; +} + +.ms-Icon--PageLeft::before { + content: '\E760'; +} + +.ms-Icon--PageRight::before { + content: '\E761'; +} + +.ms-Icon--MultiSelect::before { + content: '\E762'; +} + +.ms-Icon--Play::before { + content: '\E768'; +} + +.ms-Icon--Pause::before { + content: '\E769'; +} + +.ms-Icon--ChevronLeft::before { + content: '\E76B'; +} + +.ms-Icon--ChevronRight::before { + content: '\E76C'; +} + +.ms-Icon--Emoji2::before { + content: '\E76E'; +} + +.ms-Icon--System::before { + content: '\E770'; +} + +.ms-Icon--Globe::before { + content: '\E774'; +} + +.ms-Icon--ContactInfo::before { + content: '\E779'; +} + +.ms-Icon--Unpin::before { + content: '\E77A'; +} + +.ms-Icon--Contact::before { + content: '\E77B'; +} + +.ms-Icon--Memo::before { + content: '\E77C'; +} + +.ms-Icon--WindowsLogo::before { + content: '\E782'; +} + +.ms-Icon--Error::before { + content: '\E783'; +} + +.ms-Icon--Unlock::before { + content: '\E785'; +} + +.ms-Icon--Calendar::before { + content: '\E787'; +} + +.ms-Icon--Megaphone::before { + content: '\E789'; +} + +.ms-Icon--AutoEnhanceOn::before { + content: '\E78D'; +} + +.ms-Icon--AutoEnhanceOff::before { + content: '\E78E'; +} + +.ms-Icon--Color::before { + content: '\E790'; +} + +.ms-Icon--SaveAs::before { + content: '\E792'; +} + +.ms-Icon--Light::before { + content: '\E793'; +} + +.ms-Icon--Filters::before { + content: '\E795'; +} + +.ms-Icon--Contrast::before { + content: '\E7A1'; +} + +.ms-Icon--Redo::before { + content: '\E7A6'; +} + +.ms-Icon--Undo::before { + content: '\E7A7'; +} + +.ms-Icon--Album::before { + content: '\E7AB'; +} + +.ms-Icon--Rotate::before { + content: '\E7AD'; +} + +.ms-Icon--PanoIndicator::before { + content: '\E7B0'; +} + +.ms-Icon--ThumbnailView::before { + content: '\E7B6'; +} + +.ms-Icon--Package::before { + content: '\E7B8'; +} + +.ms-Icon--Warning::before { + content: '\E7BA'; +} + +.ms-Icon--Financial::before { + content: '\E7BB'; +} + +.ms-Icon--ShoppingCart::before { + content: '\E7BF'; +} + +.ms-Icon--Train::before { + content: '\E7C0'; +} + +.ms-Icon--Flag::before { + content: '\E7C1'; +} + +.ms-Icon--Move::before { + content: '\E7C2'; +} + +.ms-Icon--Page::before { + content: '\E7C3'; +} + +.ms-Icon--TouchPointer::before { + content: '\E7C9'; +} + +.ms-Icon--Merge::before { + content: '\E7D5'; +} + +.ms-Icon--TurnRight::before { + content: '\E7DB'; +} + +.ms-Icon--Ferry::before { + content: '\E7E3'; +} + +.ms-Icon--Tab::before { + content: '\E7E9'; +} + +.ms-Icon--Admin::before { + content: '\E7EF'; +} + +.ms-Icon--TVMonitor::before { + content: '\E7F4'; +} + +.ms-Icon--Speakers::before { + content: '\E7F5'; +} + +.ms-Icon--Car::before { + content: '\E804'; +} + +.ms-Icon--EatDrink::before { + content: '\E807'; +} + +.ms-Icon--LocationCircle::before { + content: '\E80E'; +} + +.ms-Icon--Home::before { + content: '\E80F'; +} + +.ms-Icon--SwitcherStartEnd::before { + content: '\E810'; +} + +.ms-Icon--IncidentTriangle::before { + content: '\E814'; +} + +.ms-Icon--Touch::before { + content: '\E815'; +} + +.ms-Icon--MapDirections::before { + content: '\E816'; +} + +.ms-Icon--History::before { + content: '\E81C'; +} + +.ms-Icon--Location::before { + content: '\E81D'; +} + +.ms-Icon--Work::before { + content: '\E821'; +} + +.ms-Icon--Recent::before { + content: '\E823'; +} + +.ms-Icon--Hotel::before { + content: '\E824'; +} + +.ms-Icon--LocationDot::before { + content: '\E827'; +} + +.ms-Icon--News::before { + content: '\E900'; +} + +.ms-Icon--Chat::before { + content: '\E901'; +} + +.ms-Icon--Group::before { + content: '\E902'; +} + +.ms-Icon--View::before { + content: '\E890'; +} + +.ms-Icon--Clear::before { + content: '\E894'; +} + +.ms-Icon--Sync::before { + content: '\E895'; +} + +.ms-Icon--Download::before { + content: '\E896'; +} + +.ms-Icon--Help::before { + content: '\E897'; +} + +.ms-Icon--Upload::before { + content: '\E898'; +} + +.ms-Icon--Emoji::before { + content: '\E899'; +} + +.ms-Icon--MailForward::before { + content: '\E89C'; +} + +.ms-Icon--ClosePane::before { + content: '\E89F'; +} + +.ms-Icon--OpenPane::before { + content: '\E8A0'; +} + +.ms-Icon--PreviewLink::before { + content: '\E8A1'; +} + +.ms-Icon--ZoomIn::before { + content: '\E8A3'; +} + +.ms-Icon--Bookmarks::before { + content: '\E8A4'; +} + +.ms-Icon--Document::before { + content: '\E8A5'; +} + +.ms-Icon--ProtectedDocument::before { + content: '\E8A6'; +} + +.ms-Icon--OpenInNewWindow::before { + content: '\E8A7'; +} + +.ms-Icon--MailFill::before { + content: '\E8A8'; +} + +.ms-Icon--ViewAll::before { + content: '\E8A9'; +} + +.ms-Icon--Switch::before { + content: '\E8AB'; +} + +.ms-Icon--Rename::before { + content: '\E8AC'; +} + +.ms-Icon--Folder::before { + content: '\E8B7'; +} + +.ms-Icon--Picture::before { + content: '\E8B9'; +} + +.ms-Icon--ShowResults::before { + content: '\E8BC'; +} + +.ms-Icon--Message::before { + content: '\E8BD'; +} + +.ms-Icon--CalendarDay::before { + content: '\E8BF'; +} + +.ms-Icon--CalendarWeek::before { + content: '\E8C0'; +} + +.ms-Icon--MailReplyAll::before { + content: '\E8C2'; +} + +.ms-Icon--Read::before { + content: '\E8C3'; +} + +.ms-Icon--PaymentCard::before { + content: '\E8C7'; +} + +.ms-Icon--Copy::before { + content: '\E8C8'; +} + +.ms-Icon--Important::before { + content: '\E8C9'; +} + +.ms-Icon--MailReply::before { + content: '\E8CA'; +} + +.ms-Icon--Sort::before { + content: '\E8CB'; +} + +.ms-Icon--GotoToday::before { + content: '\E8D1'; +} + +.ms-Icon--Font::before { + content: '\E8D2'; +} + +.ms-Icon--FontColor::before { + content: '\E8D3'; +} + +.ms-Icon--FolderFill::before { + content: '\E8D5'; +} + +.ms-Icon--Permissions::before { + content: '\E8D7'; +} + +.ms-Icon--DisableUpdates::before { + content: '\E8D8'; +} + +.ms-Icon--Unfavorite::before { + content: '\E8D9'; +} + +.ms-Icon--Italic::before { + content: '\E8DB'; +} + +.ms-Icon--Underline::before { + content: '\E8DC'; +} + +.ms-Icon--Bold::before { + content: '\E8DD'; +} + +.ms-Icon--MoveToFolder::before { + content: '\E8DE'; +} + +.ms-Icon--Dislike::before { + content: '\E8E0'; +} + +.ms-Icon--Like::before { + content: '\E8E1'; +} + +.ms-Icon--AlignRight::before { + content: '\E8E2'; +} + +.ms-Icon--AlignCenter::before { + content: '\E8E3'; +} + +.ms-Icon--AlignLeft::before { + content: '\E8E4'; +} + +.ms-Icon--OpenFile::before { + content: '\E8E5'; +} + +.ms-Icon--FontDecrease::before { + content: '\E8E7'; +} + +.ms-Icon--FontIncrease::before { + content: '\E8E8'; +} + +.ms-Icon--FontSize::before { + content: '\E8E9'; +} + +.ms-Icon--CellPhone::before { + content: '\E8EA'; +} + +.ms-Icon--Tag::before { + content: '\E8EC'; +} + +.ms-Icon--Library::before { + content: '\E8F1'; +} + +.ms-Icon--PostUpdate::before { + content: '\E8F3'; +} + +.ms-Icon--NewFolder::before { + content: '\E8F4'; +} + +.ms-Icon--CalendarReply::before { + content: '\E8F5'; +} + +.ms-Icon--UnsyncFolder::before { + content: '\E8F6'; +} + +.ms-Icon--SyncFolder::before { + content: '\E8F7'; +} + +.ms-Icon--BlockContact::before { + content: '\E8F8'; +} + +.ms-Icon--AddFriend::before { + content: '\E8FA'; +} + +.ms-Icon--BulletedList::before { + content: '\E8FD'; +} + +.ms-Icon--Preview::before { + content: '\E8FF'; +} + +.ms-Icon--DockLeft::before { + content: '\E90C'; +} + +.ms-Icon--DockRight::before { + content: '\E90D'; +} + +.ms-Icon--Repair::before { + content: '\E90F'; +} + +.ms-Icon--Accounts::before { + content: '\E910'; +} + +.ms-Icon--RadioBullet::before { + content: '\E915'; +} + +.ms-Icon--Stopwatch::before { + content: '\E916'; +} + +.ms-Icon--Clock::before { + content: '\E917'; +} + +.ms-Icon--AlarmClock::before { + content: '\E919'; +} + +.ms-Icon--Hospital::before { + content: '\E91D'; +} + +.ms-Icon--Timer::before { + content: '\E91E'; +} + +.ms-Icon--FullCircleMask::before { + content: '\E91F'; +} + +.ms-Icon--LocationFill::before { + content: '\E920'; +} + +.ms-Icon--ChromeMinimize::before { + content: '\E921'; +} + +.ms-Icon--Annotation::before { + content: '\E924'; +} + +.ms-Icon--ChromeClose::before { + content: '\E8BB'; +} + +.ms-Icon--Accept::before { + content: '\E8FB'; +} + +.ms-Icon--Fingerprint::before { + content: '\E928'; +} + +.ms-Icon--Handwriting::before { + content: '\E929'; +} + +.ms-Icon--StackIndicator::before { + content: '\E7FF'; +} + +.ms-Icon--Completed::before { + content: '\E930'; +} + +.ms-Icon--Label::before { + content: '\E932'; +} + +.ms-Icon--FlickDown::before { + content: '\E935'; +} + +.ms-Icon--FlickUp::before { + content: '\E936'; +} + +.ms-Icon--FlickLeft::before { + content: '\E937'; +} + +.ms-Icon--FlickRight::before { + content: '\E938'; +} + +.ms-Icon--MusicInCollection::before { + content: '\E940'; +} + +.ms-Icon--OneDrive::before { + content: '\E941'; +} + +.ms-Icon--CompassNW::before { + content: '\E942'; +} + +.ms-Icon--Code::before { + content: '\E943'; +} + +.ms-Icon--LightningBolt::before { + content: '\E945'; +} + +.ms-Icon--Info::before { + content: '\E946'; +} + +.ms-Icon--CalculatorAddition::before { + content: '\E948'; +} + +.ms-Icon--CalculatorSubtract::before { + content: '\E949'; +} + +.ms-Icon--PrintfaxPrinterFile::before { + content: '\E956'; +} + +.ms-Icon--Health::before { + content: '\E95E'; +} + +.ms-Icon--ChevronUpSmall::before { + content: '\E96D'; +} + +.ms-Icon--ChevronDownSmall::before { + content: '\E96E'; +} + +.ms-Icon--ChevronLeftSmall::before { + content: '\E96F'; +} + +.ms-Icon--ChevronRightSmall::before { + content: '\E970'; +} + +.ms-Icon--ChevronUpMed::before { + content: '\E971'; +} + +.ms-Icon--ChevronDownMed::before { + content: '\E972'; +} + +.ms-Icon--ChevronLeftMed::before { + content: '\E973'; +} + +.ms-Icon--ChevronRightMed::before { + content: '\E974'; +} + +.ms-Icon--Dictionary::before { + content: '\E82D'; +} + +.ms-Icon--ChromeBack::before { + content: '\E830'; +} + +.ms-Icon--PC1::before { + content: '\E977'; +} + +.ms-Icon--PresenceChickletVideo::before { + content: '\E979'; +} + +.ms-Icon--Reply::before { + content: '\E97A'; +} + +.ms-Icon--DoubleChevronLeftMed::before { + content: '\E991'; +} + +.ms-Icon--Volume0::before { + content: '\E992'; +} + +.ms-Icon--Volume1::before { + content: '\E993'; +} + +.ms-Icon--Volume2::before { + content: '\E994'; +} + +.ms-Icon--Volume3::before { + content: '\E995'; +} + +.ms-Icon--CaretHollow::before { + content: '\E817'; +} + +.ms-Icon--CaretSolid::before { + content: '\E818'; +} + +.ms-Icon--Pinned::before { + content: '\E840'; +} + +.ms-Icon--PinnedFill::before { + content: '\E842'; +} + +.ms-Icon--Chart::before { + content: '\E999'; +} + +.ms-Icon--BidiLtr::before { + content: '\E9AA'; +} + +.ms-Icon--BidiRtl::before { + content: '\E9AB'; +} + +.ms-Icon--RevToggleKey::before { + content: '\E845'; +} + +.ms-Icon--RightDoubleQuote::before { + content: '\E9B1'; +} + +.ms-Icon--Sunny::before { + content: '\E9BD'; +} + +.ms-Icon--CloudWeather::before { + content: '\E9BE'; +} + +.ms-Icon--Cloudy::before { + content: '\E9BF'; +} + +.ms-Icon--PartlyCloudyDay::before { + content: '\E9C0'; +} + +.ms-Icon--PartlyCloudyNight::before { + content: '\E9C1'; +} + +.ms-Icon--ClearNight::before { + content: '\E9C2'; +} + +.ms-Icon--RainShowersDay::before { + content: '\E9C3'; +} + +.ms-Icon--Rain::before { + content: '\E9C4'; +} + +.ms-Icon--Thunderstorms::before { + content: '\E9C6'; +} + +.ms-Icon--RainSnow::before { + content: '\E9C7'; +} + +.ms-Icon--Snow::before { + content: '\EB46'; +} + +.ms-Icon--BlowingSnow::before { + content: '\E9C9'; +} + +.ms-Icon--Frigid::before { + content: '\E9CA'; +} + +.ms-Icon--Fog::before { + content: '\E9CB'; +} + +.ms-Icon--Squalls::before { + content: '\E9CC'; +} + +.ms-Icon--Duststorm::before { + content: '\E9CD'; +} + +.ms-Icon--Precipitation::before { + content: '\E9CF'; +} + +.ms-Icon--Ringer::before { + content: '\EA8F'; +} + +.ms-Icon--PDF::before { + content: '\EA90'; +} + +.ms-Icon--SortLines::before { + content: '\E9D0'; +} + +.ms-Icon--Ribbon::before { + content: '\E9D1'; +} + +.ms-Icon--CheckList::before { + content: '\E9D5'; +} + +.ms-Icon--Generate::before { + content: '\E9DA'; +} + +.ms-Icon--Equalizer::before { + content: '\E9E9'; +} + +.ms-Icon--BarChartHorizontal::before { + content: '\E9EB'; +} + +.ms-Icon--Freezing::before { + content: '\E9EF'; +} + +.ms-Icon--SnowShowerDay::before { + content: '\E9FD'; +} + +.ms-Icon--HailDay::before { + content: '\EA00'; +} + +.ms-Icon--WorkFlow::before { + content: '\EA01'; +} + +.ms-Icon--StoreLogoMed::before { + content: '\EA04'; +} + +.ms-Icon--RainShowersNight::before { + content: '\EA0F'; +} + +.ms-Icon--SnowShowerNight::before { + content: '\EA11'; +} + +.ms-Icon--HailNight::before { + content: '\EA13'; +} + +.ms-Icon--Info2::before { + content: '\EA1F'; +} + +.ms-Icon--StoreLogo::before { + content: '\EA96'; +} + +.ms-Icon--MultiSelectMirrored::before { + content: '\EA98'; +} + +.ms-Icon--Broom::before { + content: '\EA99'; +} + +.ms-Icon--MusicInCollectionFill::before { + content: '\EA36'; +} + +.ms-Icon--List::before { + content: '\EA37'; +} + +.ms-Icon--Asterisk::before { + content: '\EA38'; +} + +.ms-Icon--ErrorBadge::before { + content: '\EA39'; +} + +.ms-Icon--CircleRing::before { + content: '\EA3A'; +} + +.ms-Icon--CircleFill::before { + content: '\EA3B'; +} + +.ms-Icon--BookmarksMirrored::before { + content: '\EA41'; +} + +.ms-Icon--BulletedListMirrored::before { + content: '\EA42'; +} + +.ms-Icon--CaretHollowMirrored::before { + content: '\EA45'; +} + +.ms-Icon--CaretSolidMirrored::before { + content: '\EA46'; +} + +.ms-Icon--ChromeBackMirrored::before { + content: '\EA47'; +} + +.ms-Icon--ClosePaneMirrored::before { + content: '\EA49'; +} + +.ms-Icon--DockLeftMirrored::before { + content: '\EA4C'; +} + +.ms-Icon--DoubleChevronLeftMedMirrored::before { + content: '\EA4D'; +} + +.ms-Icon--HelpMirrored::before { + content: '\EA51'; +} + +.ms-Icon--ListMirrored::before { + content: '\EA55'; +} + +.ms-Icon--MailForwardMirrored::before { + content: '\EA56'; +} + +.ms-Icon--MailReplyMirrored::before { + content: '\EA57'; +} + +.ms-Icon--MailReplyAllMirrored::before { + content: '\EA58'; +} + +.ms-Icon--OpenPaneMirrored::before { + content: '\EA5B'; +} + +.ms-Icon--SendMirrored::before { + content: '\EA63'; +} + +.ms-Icon--ShowResultsMirrored::before { + content: '\EA65'; +} + +.ms-Icon--ThumbnailViewMirrored::before { + content: '\EA67'; +} + +.ms-Icon--Lightbulb::before { + content: '\EA80'; +} + +.ms-Icon--StatusTriangle::before { + content: '\EA82'; +} + +.ms-Icon--VolumeDisabled::before { + content: '\EA85'; +} + +.ms-Icon--Puzzle::before { + content: '\EA86'; +} + +.ms-Icon--EmojiNeutral::before { + content: '\EA87'; +} + +.ms-Icon--EmojiDisappointed::before { + content: '\EA88'; +} + +.ms-Icon--HomeSolid::before { + content: '\EA8A'; +} + +.ms-Icon--Cocktails::before { + content: '\EA9D'; +} + +.ms-Icon--Articles::before { + content: '\EAC1'; +} + +.ms-Icon--Cycling::before { + content: '\EAC7'; +} + +.ms-Icon--DietPlanNotebook::before { + content: '\EAC8'; +} + +.ms-Icon--Pill::before { + content: '\EACB'; +} + +.ms-Icon--Running::before { + content: '\EADA'; +} + +.ms-Icon--Weights::before { + content: '\EADB'; +} + +.ms-Icon--BarChart4::before { + content: '\EAE7'; +} + +.ms-Icon--CirclePlus::before { + content: '\EAEE'; +} + +.ms-Icon--Coffee::before { + content: '\EAEF'; +} + +.ms-Icon--Cotton::before { + content: '\EAF3'; +} + +.ms-Icon--Market::before { + content: '\EAFC'; +} + +.ms-Icon--Money::before { + content: '\EAFD'; +} + +.ms-Icon--PieDouble::before { + content: '\EB04'; +} + +.ms-Icon--RemoveFilter::before { + content: '\EB08'; +} + +.ms-Icon--StockDown::before { + content: '\EB0F'; +} + +.ms-Icon--StockUp::before { + content: '\EB11'; +} + +.ms-Icon--Cricket::before { + content: '\EB1E'; +} + +.ms-Icon--Golf::before { + content: '\EB1F'; +} + +.ms-Icon--Baseball::before { + content: '\EB20'; +} + +.ms-Icon--Soccer::before { + content: '\EB21'; +} + +.ms-Icon--MoreSports::before { + content: '\EB22'; +} + +.ms-Icon--AutoRacing::before { + content: '\EB24'; +} + +.ms-Icon--CollegeHoops::before { + content: '\EB25'; +} + +.ms-Icon--CollegeFootball::before { + content: '\EB26'; +} + +.ms-Icon--ProFootball::before { + content: '\EB27'; +} + +.ms-Icon--ProHockey::before { + content: '\EB28'; +} + +.ms-Icon--Rugby::before { + content: '\EB2D'; +} + +.ms-Icon--Tennis::before { + content: '\EB33'; +} + +.ms-Icon--Arrivals::before { + content: '\EB34'; +} + +.ms-Icon--Design::before { + content: '\EB3C'; +} + +.ms-Icon--Website::before { + content: '\EB41'; +} + +.ms-Icon--Drop::before { + content: '\EB42'; +} + +.ms-Icon--Snow::before { + content: '\EB46'; +} + +.ms-Icon--BusSolid::before { + content: '\EB47'; +} + +.ms-Icon--FerrySolid::before { + content: '\EB48'; +} + +.ms-Icon--TrainSolid::before { + content: '\EB4D'; +} + +.ms-Icon--Heart::before { + content: '\EB51'; +} + +.ms-Icon--HeartFill::before { + content: '\EB52'; +} + +.ms-Icon--Ticket::before { + content: '\EB54'; +} + +.ms-Icon--AzureLogo::before { + content: '\EB6A'; +} + +.ms-Icon--BingLogo::before { + content: '\EB6B'; +} + +.ms-Icon--MSNLogo::before { + content: '\EB6C'; +} + +.ms-Icon--OutlookLogo::before { + content: '\EB6D'; +} + +.ms-Icon--OfficeLogo::before { + content: '\EB6E'; +} + +.ms-Icon--SkypeLogo::before { + content: '\EB6F'; +} + +.ms-Icon--Door::before { + content: '\EB75'; +} + +.ms-Icon--EditMirrored::before { + content: '\EB7E'; +} + +.ms-Icon--GiftCard::before { + content: '\EB8E'; +} + +.ms-Icon--DoubleBookmark::before { + content: '\EB8F'; +} + +.ms-Icon--StatusErrorFull::before { + content: '\EB90'; +} + +.ms-Icon--Certificate::before { + content: '\EB95'; +} + +.ms-Icon--Photo2::before { + content: '\EB9F'; +} + +.ms-Icon--CloudDownload::before { + content: '\EBD3'; +} + +.ms-Icon--WindDirection::before { + content: '\EBE6'; +} + +.ms-Icon--Family::before { + content: '\EBDA'; +} + +.ms-Icon--CSS::before { + content: '\EBEF'; +} + +.ms-Icon--JS::before { + content: '\EBF0'; +} + +.ms-Icon--ReminderGroup::before { + content: '\EBF8'; +} + +.ms-Icon--Section::before { + content: '\EC0C'; +} + +.ms-Icon--OneNoteLogo::before { + content: '\EC0D'; +} + +.ms-Icon--ToggleFilled::before { + content: '\EC11'; +} + +.ms-Icon--ToggleBorder::before { + content: '\EC12'; +} + +.ms-Icon--SliderThumb::before { + content: '\EC13'; +} + +.ms-Icon--ToggleThumb::before { + content: '\EC14'; +} + +.ms-Icon--Documentation::before { + content: '\EC17'; +} + +.ms-Icon--Badge::before { + content: '\EC1B'; +} + +.ms-Icon--Giftbox::before { + content: '\EC1F'; +} + +.ms-Icon--ExcelLogo::before { + content: '\EC28'; +} + +.ms-Icon--WordLogo::before { + content: '\EC29'; +} + +.ms-Icon--PowerPointLogo::before { + content: '\EC2A'; +} + +.ms-Icon--Cafe::before { + content: '\EC32'; +} + +.ms-Icon--SpeedHigh::before { + content: '\EC4A'; +} + +.ms-Icon--MusicNote::before { + content: '\EC4F'; +} + +.ms-Icon--EdgeLogo::before { + content: '\EC60'; +} + +.ms-Icon--CompletedSolid::before { + content: '\EC61'; +} + +.ms-Icon--AlbumRemove::before { + content: '\EC62'; +} + +.ms-Icon--MessageFill::before { + content: '\EC70'; +} + +.ms-Icon--TabletSelected::before { + content: '\EC74'; +} + +.ms-Icon--MobileSelected::before { + content: '\EC75'; +} + +.ms-Icon--LaptopSelected::before { + content: '\EC76'; +} + +.ms-Icon--TVMonitorSelected::before { + content: '\EC77'; +} + +.ms-Icon--DeveloperTools::before { + content: '\EC7A'; +} + +.ms-Icon--InsertTextBox::before { + content: '\EC7D'; +} + +.ms-Icon--LowerBrightness::before { + content: '\EC8A'; +} + +.ms-Icon--CloudUpload::before { + content: '\EC8E'; +} + +.ms-Icon--DateTime::before { + content: '\EC92'; +} + +.ms-Icon--Event::before { + content: '\ECA3'; +} + +.ms-Icon--Cake::before { + content: '\ECA4'; +} + +.ms-Icon--Tiles::before { + content: '\ECA5'; +} + +.ms-Icon--Org::before { + content: '\ECA6'; +} + +.ms-Icon--PartyLeader::before { + content: '\ECA7'; +} + +.ms-Icon--DRM::before { + content: '\ECA8'; +} + +.ms-Icon--CloudAdd::before { + content: '\ECA9'; +} + +.ms-Icon--AppIconDefault::before { + content: '\ECAA'; +} + +.ms-Icon--Photo2Add::before { + content: '\ECAB'; +} + +.ms-Icon--Photo2Remove::before { + content: '\ECAC'; +} + +.ms-Icon--POI::before { + content: '\ECAF'; +} + +.ms-Icon--FacebookLogo::before { + content: '\ECB3'; +} + +.ms-Icon--AddTo::before { + content: '\ECC8'; +} + +.ms-Icon--RadioBtnOn::before { + content: '\ECCB'; +} + +.ms-Icon--Embed::before { + content: '\ECCE'; +} + +.ms-Icon--VideoSolid::before { + content: '\EA0C'; +} + +.ms-Icon--Teamwork::before { + content: '\EA12'; +} + +.ms-Icon--PeopleAdd::before { + content: '\EA15'; +} + +.ms-Icon--Glasses::before { + content: '\EA16'; +} + +.ms-Icon--DateTime2::before { + content: '\EA17'; +} + +.ms-Icon--Shield::before { + content: '\EA18'; +} + +.ms-Icon--Header1::before { + content: '\EA19'; +} + +.ms-Icon--PageAdd::before { + content: '\EA1A'; +} + +.ms-Icon--NumberedList::before { + content: '\EA1C'; +} + +.ms-Icon--PowerBILogo::before { + content: '\EA1E'; +} + +.ms-Icon--Product::before { + content: '\ECDC'; +} + +.ms-Icon--Blocked2::before { + content: '\ECE4'; +} + +.ms-Icon--FangBody::before { + content: '\ECEB'; +} + +.ms-Icon--Glimmer::before { + content: '\ECF4'; +} + +.ms-Icon--ChatInviteFriend::before { + content: '\ECFE'; +} + +.ms-Icon--SharepointLogo::before { + content: '\ED18'; +} + +.ms-Icon--YammerLogo::before { + content: '\ED19'; +} + +.ms-Icon--ReturnToSession::before { + content: '\ED24'; +} + +.ms-Icon--OpenFolderHorizontal::before { + content: '\ED25'; +} + +.ms-Icon--CalendarMirrored::before { + content: '\ED28'; +} + +.ms-Icon--SwayLogo::before { + content: '\ED29'; +} + +.ms-Icon--OutOfOffice::before { + content: '\ED34'; +} + +.ms-Icon--Trophy::before { + content: '\ED3F'; +} + +.ms-Icon--ReopenPages::before { + content: '\ED50'; +} + +.ms-Icon--AADLogo::before { + content: '\ED68'; +} + +.ms-Icon--AccessLogo::before { + content: '\ED69'; +} + +.ms-Icon--AdminALogo::before { + content: '\ED6A'; +} + +.ms-Icon--AdminCLogo::before { + content: '\ED6B'; +} + +.ms-Icon--AdminDLogo::before { + content: '\ED6C'; +} + +.ms-Icon--AdminELogo::before { + content: '\ED6D'; +} + +.ms-Icon--AdminLLogo::before { + content: '\ED6E'; +} + +.ms-Icon--AdminMLogo::before { + content: '\ED6F'; +} + +.ms-Icon--AdminOLogo::before { + content: '\ED70'; +} + +.ms-Icon--AdminPLogo::before { + content: '\ED71'; +} + +.ms-Icon--AdminSLogo::before { + content: '\ED72'; +} + +.ms-Icon--AdminYLogo::before { + content: '\ED73'; +} + +.ms-Icon--AlchemyLogo::before { + content: '\ED74'; +} + +.ms-Icon--BoxLogo::before { + content: '\ED75'; +} + +.ms-Icon--DelveLogo::before { + content: '\ED76'; +} + +.ms-Icon--DropboxLogo::before { + content: '\ED77'; +} + +.ms-Icon--ExchangeLogo::before { + content: '\ED78'; +} + +.ms-Icon--LyncLogo::before { + content: '\ED79'; +} + +.ms-Icon--OfficeVideoLogo::before { + content: '\ED7A'; +} + +.ms-Icon--ParatureLogo::before { + content: '\ED7B'; +} + +.ms-Icon--SocialListeningLogo::before { + content: '\ED7C'; +} + +.ms-Icon--VisioLogo::before { + content: '\ED7D'; +} + +.ms-Icon--Balloons::before { + content: '\ED7E'; +} + +.ms-Icon--Cat::before { + content: '\ED7F'; +} + +.ms-Icon--MailAlert::before { + content: '\ED80'; +} + +.ms-Icon--MailCheck::before { + content: '\ED81'; +} + +.ms-Icon--MailLowImportance::before { + content: '\ED82'; +} + +.ms-Icon--MailPause::before { + content: '\ED83'; +} + +.ms-Icon--MailRepeat::before { + content: '\ED84'; +} + +.ms-Icon--SecurityGroup::before { + content: '\ED85'; +} + +.ms-Icon--Table::before { + content: '\ED86'; +} + +.ms-Icon--VoicemailForward::before { + content: '\ED87'; +} + +.ms-Icon--VoicemailReply::before { + content: '\ED88'; +} + +.ms-Icon--Waffle::before { + content: '\ED89'; +} + +.ms-Icon--RemoveEvent::before { + content: '\ED8A'; +} + +.ms-Icon--EventInfo::before { + content: '\ED8B'; +} + +.ms-Icon--ForwardEvent::before { + content: '\ED8C'; +} + +.ms-Icon--WipePhone::before { + content: '\ED8D'; +} + +.ms-Icon--AddOnlineMeeting::before { + content: '\ED8E'; +} + +.ms-Icon--JoinOnlineMeeting::before { + content: '\ED8F'; +} + +.ms-Icon--RemoveLink::before { + content: '\ED90'; +} + +.ms-Icon--PeopleBlock::before { + content: '\ED91'; +} + +.ms-Icon--PeopleRepeat::before { + content: '\ED92'; +} + +.ms-Icon--PeopleAlert::before { + content: '\ED93'; +} + +.ms-Icon--PeoplePause::before { + content: '\ED94'; +} + +.ms-Icon--TransferCall::before { + content: '\ED95'; +} + +.ms-Icon--AddPhone::before { + content: '\ED96'; +} + +.ms-Icon--UnknownCall::before { + content: '\ED97'; +} + +.ms-Icon--NoteReply::before { + content: '\ED98'; +} + +.ms-Icon--NoteForward::before { + content: '\ED99'; +} + +.ms-Icon--NotePinned::before { + content: '\ED9A'; +} + +.ms-Icon--RemoveOccurrence::before { + content: '\ED9B'; +} + +.ms-Icon--Timeline::before { + content: '\ED9C'; +} + +.ms-Icon--EditNote::before { + content: '\ED9D'; +} + +.ms-Icon--CircleHalfFull::before { + content: '\ED9E'; +} + +.ms-Icon--Room::before { + content: '\ED9F'; +} + +.ms-Icon--Unsubscribe::before { + content: '\EDA0'; +} + +.ms-Icon--Subscribe::before { + content: '\EDA1'; +} + +.ms-Icon--RecurringTask::before { + content: '\EDB2'; +} + +.ms-Icon--TaskManager::before { + content: '\EDB7'; +} + +.ms-Icon--TaskManagerMirrored::before { + content: '\EDB8'; +} + +.ms-Icon--Combine::before { + content: '\EDBB'; +} + +.ms-Icon--Split::before { + content: '\EDBC'; +} + +.ms-Icon--DoubleChevronUp::before { + content: '\EDBD'; +} + +.ms-Icon--DoubleChevronLeft::before { + content: '\EDBE'; +} + +.ms-Icon--DoubleChevronRight::before { + content: '\EDBF'; +} + +.ms-Icon--Ascending::before { + content: '\EDC0'; +} + +.ms-Icon--Descending::before { + content: '\EDC1'; +} + +.ms-Icon--TextBox::before { + content: '\EDC2'; +} + +.ms-Icon--TextField::before { + content: '\EDC3'; +} + +.ms-Icon--NumberField::before { + content: '\EDC4'; +} + +.ms-Icon--Dropdown::before { + content: '\EDC5'; +} + +.ms-Icon--BookingsLogo::before { + content: '\EDC7'; +} + +.ms-Icon--ClassNotebookLogo::before { + content: '\EDC8'; +} + +.ms-Icon--CollabsDBLogo::before { + content: '\EDC9'; +} + +.ms-Icon--DelveAnalyticsLogo::before { + content: '\EDCA'; +} + +.ms-Icon--DocsLogo::before { + content: '\EDCB'; +} + +.ms-Icon--DynamicsCRMLogo::before { + content: '\EDCC'; +} + +.ms-Icon--DynamicSMBLogo::before { + content: '\EDCD'; +} + +.ms-Icon--OfficeAssistantLogo::before { + content: '\EDCE'; +} + +.ms-Icon--OfficeStoreLogo::before { + content: '\EDCF'; +} + +.ms-Icon--OneNoteEduLogo::before { + content: '\EDD0'; +} + +.ms-Icon--Planner::before { + content: '\EDD1'; +} + +.ms-Icon--PowerApps::before { + content: '\EDD2'; +} + +.ms-Icon--Suitcase::before { + content: '\EDD3'; +} + +.ms-Icon--ProjectLogo::before { + content: '\EDD4'; +} + +.ms-Icon--CaretLeft8::before { + content: '\EDD5'; +} + +.ms-Icon--CaretRight8::before { + content: '\EDD6'; +} + +.ms-Icon--CaretUp8::before { + content: '\EDD7'; +} + +.ms-Icon--CaretDown8::before { + content: '\EDD8'; +} + +.ms-Icon--CaretLeftSolid8::before { + content: '\EDD9'; +} + +.ms-Icon--CarotRightSolid8::before { + content: '\EDDA'; +} + +.ms-Icon--CaretUpSolid8::before { + content: '\EDDB'; +} + +.ms-Icon--CaretDownSolid8::before { + content: '\EDDC'; +} + +.ms-Icon--ClearFormatting::before { + content: '\EDDD'; +} + +.ms-Icon--Superscript::before { + content: '\EDDE'; +} + +.ms-Icon--Subscript::before { + content: '\EDDF'; +} + +.ms-Icon--Strikethrough::before { + content: '\EDE0'; +} + +.ms-Icon--SingleBookmark::before { + content: '\EDFF'; +} + +.ms-Icon--DoubleChevronDown::before { + content: '\EE04'; +} + +.ms-Icon--ReplyAll::before { + content: '\EE0A'; +} + +.ms-Icon--GoogleDriveLogo::before { + content: '\EE0B'; +} + +.ms-Icon--Questionnaire::before { + content: '\EE19'; +} + +.ms-Icon--ReplyMirrored::before { + content: '\EE35'; +} + +.ms-Icon--ReplyAllMirrored::before { + content: '\EE36'; +} + +.ms-Icon--AddGroup::before { + content: '\EE3D'; +} + +.ms-Icon--QuestionnaireMirrored::before { + content: '\EE4B'; +} + +.ms-Icon--TemporaryUser::before { + content: '\EE58'; +} + +.ms-Icon--GroupedDescending::before { + content: '\EE66'; +} + +.ms-Icon--GroupedAscending::before { + content: '\EE67'; +} + +.ms-Icon--SortUp::before { + content: '\EE68'; +} + +.ms-Icon--SortDown::before { + content: '\EE69'; +} + +.ms-Icon--AwayStatus::before { + content: '\EE6A'; +} + +.ms-Icon--SyncToPC::before { + content: '\EE6E'; +} + +.ms-Icon--AustralianRules::before { + content: '\EE70'; +} + +.ms-Icon--DateTimeMirrored::before { + content: '\EE93'; +} + +.ms-Icon--DoubleChevronUp12::before { + content: '\EE96'; +} + +.ms-Icon--DoubleChevronDown12::before { + content: '\EE97'; +} + +.ms-Icon--DoubleChevronLeft12::before { + content: '\EE98'; +} + +.ms-Icon--DoubleChevronRight12::before { + content: '\EE99'; +} + +.ms-Icon--CalendarAgenda::before { + content: '\EE9A'; +} + +.ms-Icon--AddEvent::before { + content: '\EEB5'; +} + +.ms-Icon--AssetLibrary::before { + content: '\EEB6'; +} + +.ms-Icon--DataConnectionLibrary::before { + content: '\EEB7'; +} + +.ms-Icon--DocLibrary::before { + content: '\EEB8'; +} + +.ms-Icon--FormLibrary::before { + content: '\EEB9'; +} + +.ms-Icon--FormLibraryMirrored::before { + content: '\EEBA'; +} + +.ms-Icon--ReportLibrary::before { + content: '\EEBB'; +} + +.ms-Icon--ReportLibraryMirrored::before { + content: '\EEBC'; +} + +.ms-Icon--ContactCard::before { + content: '\EEBD'; +} + +.ms-Icon--CustomList::before { + content: '\EEBE'; +} + +.ms-Icon--CustomListMirrored::before { + content: '\EEBF'; +} + +.ms-Icon--IssueTracking::before { + content: '\EEC0'; +} + +.ms-Icon--IssueTrackingMirrored::before { + content: '\EEC1'; +} + +.ms-Icon--PictureLibrary::before { + content: '\EEC2'; +} + +.ms-Icon--AppForOfficeLogo::before { + content: '\EEC7'; +} + +.ms-Icon--OfflineOneDriveParachute::before { + content: '\EEC8'; +} + +.ms-Icon--OfflineOneDriveParachuteDisabled::before { + content: '\EEC9'; +} + +.ms-Icon--LargeGrid::before { + content: '\EECB'; +} + +.ms-Icon--TriangleSolidUp12::before { + content: '\EECC'; +} + +.ms-Icon--TriangleSolidDown12::before { + content: '\EECD'; +} + +.ms-Icon--TriangleSolidLeft12::before { + content: '\EECE'; +} + +.ms-Icon--TriangleSolidRight12::before { + content: '\EECF'; +} + +.ms-Icon--TriangleUp12::before { + content: '\EED0'; +} + +.ms-Icon--TriangleDown12::before { + content: '\EED1'; +} + +.ms-Icon--TriangleLeft12::before { + content: '\EED2'; +} + +.ms-Icon--TriangleRight12::before { + content: '\EED3'; +} + +.ms-Icon--ArrowUpRight8::before { + content: '\EED4'; +} + +.ms-Icon--ArrowDownRight8::before { + content: '\EED5'; +} + +.ms-Icon--DocumentSet::before { + content: '\EED6'; +} + +.ms-Icon--DelveAnalytics::before { + content: '\EEEE'; +} + +.ms-Icon--ArrowUpRightMirrored8::before { + content: '\EEEF'; +} + +.ms-Icon--ArrowDownRightMirrored8::before { + content: '\EEF0'; +} + +.ms-Icon--OneDriveAdd::before { + content: '\EF32'; +} + +.ms-Icon--Header2::before { + content: '\EF36'; +} + +.ms-Icon--Header3::before { + content: '\EF37'; +} + +.ms-Icon--Header4::before { + content: '\EF38'; +} + +.ms-Icon--MarketDown::before { + content: '\EF42'; +} + +.ms-Icon--CalendarWorkWeek::before { + content: '\EF51'; +} + +.ms-Icon--SidePanel::before { + content: '\EF52'; +} + +.ms-Icon--GlobeFavorite::before { + content: '\EF53'; +} + +.ms-Icon--CaretTopLeftSolid8::before { + content: '\EF54'; +} + +.ms-Icon--CaretTopRightSolid8::before { + content: '\EF55'; +} + +.ms-Icon--ViewAll2::before { + content: '\EF56'; +} + +.ms-Icon--DocumentReply::before { + content: '\EF57'; +} + +.ms-Icon--PlayerSettings::before { + content: '\EF58'; +} + +.ms-Icon--ReceiptForward::before { + content: '\EF59'; +} + +.ms-Icon--ReceiptReply::before { + content: '\EF5A'; +} + +.ms-Icon--ReceiptCheck::before { + content: '\EF5B'; +} + +.ms-Icon--Fax::before { + content: '\EF5C'; +} + +.ms-Icon--RecurringEvent::before { + content: '\EF5D'; +} + +.ms-Icon--ReplyAlt::before { + content: '\EF5E'; +} + +.ms-Icon--ReplyAllAlt::before { + content: '\EF5F'; +} + +.ms-Icon--EditStyle::before { + content: '\EF60'; +} + +.ms-Icon--EditMail::before { + content: '\EF61'; +} + +.ms-Icon--Lifesaver::before { + content: '\EF62'; +} + +.ms-Icon--LifesaverLock::before { + content: '\EF63'; +} + +.ms-Icon--InboxCheck::before { + content: '\EF64'; +} + +.ms-Icon--FolderSearch::before { + content: '\EF65'; +} + +.ms-Icon--CollapseMenu::before { + content: '\EF66'; +} + +.ms-Icon--ExpandMenu::before { + content: '\EF67'; +} + +.ms-Icon--Boards::before { + content: '\EF68'; +} + +.ms-Icon--SunAdd::before { + content: '\EF69'; +} + +.ms-Icon--SunQuestionMark::before { + content: '\EF6A'; +} + +.ms-Icon--LandscapeOrientation::before { + content: '\EF6B'; +} + +.ms-Icon--DocumentSearch::before { + content: '\EF6C'; +} + +.ms-Icon--PublicCalendar::before { + content: '\EF6D'; +} + +.ms-Icon--PublicContactCard::before { + content: '\EF6E'; +} + +.ms-Icon--PublicEmail::before { + content: '\EF6F'; +} + +.ms-Icon--PublicFolder::before { + content: '\EF70'; +} + +.ms-Icon--WordDocument::before { + content: '\EF71'; +} + +.ms-Icon--PowerPointDocument::before { + content: '\EF72'; +} + +.ms-Icon--ExcelDocument::before { + content: '\EF73'; +} + +.ms-Icon--GroupedList::before { + content: '\EF74'; +} + +.ms-Icon--ClassroomLogo::before { + content: '\EF75'; +} + +.ms-Icon--Sections::before { + content: '\EF76'; +} + +.ms-Icon--EditPhoto::before { + content: '\EF77'; +} + +.ms-Icon--Starburst::before { + content: '\EF78'; +} + +.ms-Icon--ShareiOS::before { + content: '\EF79'; +} + +.ms-Icon--AirTickets::before { + content: '\EF7A'; +} + +.ms-Icon--PencilReply::before { + content: '\EF7B'; +} + +.ms-Icon--Tiles2::before { + content: '\EF7C'; +} + +.ms-Icon--SkypeCircleCheck::before { + content: '\EF7D'; +} + +.ms-Icon--SkypeCircleClock::before { + content: '\EF7E'; +} + +.ms-Icon--SkypeCircleMinus::before { + content: '\EF7F'; +} + +.ms-Icon--SkypeCheck::before { + content: '\EF80'; +} + +.ms-Icon--SkypeClock::before { + content: '\EF81'; +} + +.ms-Icon--SkypeMinus::before { + content: '\EF82'; +} + +.ms-Icon--SkypeMessage::before { + content: '\EF83'; +} + +.ms-Icon--ClosedCaption::before { + content: '\EF84'; +} + +.ms-Icon--ATPLogo::before { + content: '\EF85'; +} + +.ms-Icon--OfficeFormLogo::before { + content: '\EF86'; +} + +.ms-Icon--RecycleBin::before { + content: '\EF87'; +} + +.ms-Icon--EmptyRecycleBin::before { + content: '\EF88'; +} + +.ms-Icon--Hide2::before { + content: '\EF89'; +} + +.ms-Icon--iOSAppStoreLogo::before { + content: '\EF8A'; +} + +.ms-Icon--AndroidLogo::before { + content: '\EF8B'; +} + +.ms-Icon--Breadcrumb::before { + content: '\EF8C'; +} + +.ms-Icon--ClearFilter::before { + content: '\EF8F'; +} + +.ms-Icon--Flow::before { + content: '\EF90'; +} + +.ms-Icon--PowerAppsLogo::before { + content: '\F091'; +} + +.ms-Icon--PowerApps2Logo::before { + content: '\F092'; +} + +.ms-Icon--circle { + position: relative; + display: inline-block; + font-size: 1rem; + width: 1em; + height: 1em; + margin: 0 0.5em 0 0; + padding: 0; + text-align: left; + -webkit-font-smoothing: antialiased; +} + +.ms-Icon--circle::before, +.ms-Icon--circle::after { + line-height: 1; + font-size: inherit; +} + +.ms-Icon--circle::before { + display: block; + width: 100%; + height: 100%; + margin: 0; + padding: 0; + vertical-align: top; + position: absolute; +} + +.ms-Icon--circle::after { + content: '\e000'; + position: absolute; + top: 0; + left: 0; + -ms-transform: scale(2); + transform: scale(2); + -ms-transform-origin: 50% 50%; + transform-origin: 50% 50%; + z-index: 0; +} + +.ms-Icon--xs { + font-size: 10px; +} + +.ms-Icon--s { + font-size: 12px; +} + +.ms-Icon--m { + font-size: 16px; +} + +.ms-Icon--l { + font-size: 20px; +} + +.ms-u-slideRightIn10 { + animation-name: fadeIn, slideRightIn10; + -webkit-animation-duration: 0.367s; + -moz-animation-duration: 0.367s; + -ms-animation-duration: 0.367s; + -o-animation-duration: 0.367s; + animation-timing-function: cubic-bezier(0.1, 0.9, 0.2, 1); + animation-fill-mode: both; +} + +@keyframes slideRightIn10 { + from { + transform: translate3d(-10px, 0px, 0px); + } + + to { + transform: translate3d(0px, 0px, 0px); + } +} + +.ms-u-slideRightIn20 { + animation-name: fadeIn, slideRightIn20; + -webkit-animation-duration: 0.367s; + -moz-animation-duration: 0.367s; + -ms-animation-duration: 0.367s; + -o-animation-duration: 0.367s; + animation-timing-function: cubic-bezier(0.1, 0.9, 0.2, 1); + animation-fill-mode: both; +} + +@keyframes slideRightIn20 { + from { + transform: translate3d(-20px, 0px, 0px); + } + + to { + transform: translate3d(0px, 0px, 0px); + } +} + +.ms-u-slideRightIn40 { + animation-name: fadeIn, slideRightIn40; + -webkit-animation-duration: 0.367s; + -moz-animation-duration: 0.367s; + -ms-animation-duration: 0.367s; + -o-animation-duration: 0.367s; + animation-timing-function: cubic-bezier(0.1, 0.9, 0.2, 1); + animation-fill-mode: both; +} + +@keyframes slideRightIn40 { + from { + transform: translate3d(-40px, 0px, 0px); + } + + to { + transform: translate3d(0px, 0px, 0px); + } +} + +.ms-u-slideLeftIn10 { + animation-name: fadeIn, slideLeftIn10; + -webkit-animation-duration: 0.367s; + -moz-animation-duration: 0.367s; + -ms-animation-duration: 0.367s; + -o-animation-duration: 0.367s; + animation-timing-function: cubic-bezier(0.1, 0.9, 0.2, 1); + animation-fill-mode: both; +} + +@keyframes slideLeftIn10 { + from { + transform: translate3d(10px, 0px, 0px); + } + + to { + transform: translate3d(0px, 0px, 0px); + } +} + +.ms-u-slideLeftIn20 { + animation-name: fadeIn, slideLeftIn20; + -webkit-animation-duration: 0.367s; + -moz-animation-duration: 0.367s; + -ms-animation-duration: 0.367s; + -o-animation-duration: 0.367s; + animation-timing-function: cubic-bezier(0.1, 0.9, 0.2, 1); + animation-fill-mode: both; +} + +@keyframes slideLeftIn20 { + from { + transform: translate3d(20px, 0px, 0px); + } + + to { + transform: translate3d(0px, 0px, 0px); + } +} + +.ms-u-slideLeftIn40 { + animation-name: fadeIn, slideLeftIn40; + -webkit-animation-duration: 0.367s; + -moz-animation-duration: 0.367s; + -ms-animation-duration: 0.367s; + -o-animation-duration: 0.367s; + animation-timing-function: cubic-bezier(0.1, 0.9, 0.2, 1); + animation-fill-mode: both; +} + +@keyframes slideLeftIn40 { + from { + transform: translate3d(40px, 0px, 0px); + } + + to { + transform: translate3d(0px, 0px, 0px); + } +} + +.ms-u-slideRightIn400 { + animation-name: fadeIn, slideRightIn400; + -webkit-animation-duration: 0.367s; + -moz-animation-duration: 0.367s; + -ms-animation-duration: 0.367s; + -o-animation-duration: 0.367s; + animation-timing-function: cubic-bezier(0.1, 0.9, 0.2, 1); + animation-fill-mode: both; +} + +@keyframes slideRightIn400 { + from { + transform: translate3d(-400px, 0px, 0px); + } + + to { + transform: translate3d(0px, 0px, 0px); + } +} + +.ms-u-slideLeftIn400 { + animation-name: fadeIn, slideLeft400; + -webkit-animation-duration: 0.367s; + -moz-animation-duration: 0.367s; + -ms-animation-duration: 0.367s; + -o-animation-duration: 0.367s; + animation-timing-function: cubic-bezier(0.1, 0.9, 0.2, 1); + animation-fill-mode: both; +} + +@keyframes slideLeft400 { + from { + transform: translate3d(400px, 0px, 0px); + } + + to { + transform: translate3d(0px, 0px, 0px); + } +} + +.ms-u-slideUpIn20 { + animation-name: fadeIn, slideUpIn20; + -webkit-animation-duration: 0.367s; + -moz-animation-duration: 0.367s; + -ms-animation-duration: 0.367s; + -o-animation-duration: 0.367s; + animation-timing-function: cubic-bezier(0.1, 0.9, 0.2, 1); + animation-fill-mode: both; +} + +@keyframes slideUpIn20 { + from { + transform: translate3d(0px, 20px, 0px); + } + + to { + transform: translate3d(0px, 0px, 0px); + } +} + +.ms-u-slideUpIn10 { + animation-name: fadeIn, slideUpIn10; + -webkit-animation-duration: 0.167s; + -moz-animation-duration: 0.167s; + -ms-animation-duration: 0.167s; + -o-animation-duration: 0.167s; + animation-timing-function: cubic-bezier(0.1, 0.25, 0.75, 0.9); + animation-fill-mode: both; +} + +@keyframes slideUpIn10 { + from { + transform: translate3d(0px, 10px, 0px); + } + + to { + transform: translate3d(0px, 0px, 0px); + } +} + +.ms-u-slideDownIn20 { + animation-name: fadeIn, slideDownIn20; + -webkit-animation-duration: 0.367s; + -moz-animation-duration: 0.367s; + -ms-animation-duration: 0.367s; + -o-animation-duration: 0.367s; + animation-timing-function: cubic-bezier(0.1, 0.9, 0.2, 1); + animation-fill-mode: both; +} + +@keyframes slideDownIn20 { + from { + transform: translate3d(0px, -20px, 0px); + } + + to { + transform: translate3d(0px, 0px, 0px); + } +} + +.ms-u-slideDownIn10 { + animation-name: fadeIn, slideDownIn10; + -webkit-animation-duration: 0.167s; + -moz-animation-duration: 0.167s; + -ms-animation-duration: 0.167s; + -o-animation-duration: 0.167s; + animation-timing-function: cubic-bezier(0.1, 0.25, 0.75, 0.9); + animation-fill-mode: both; +} + +@keyframes slideDownIn10 { + from { + transform: translate3d(0px, -10px, 0px); + } + + to { + transform: translate3d(0px, 0px, 0px); + } +} + +.ms-u-slideRightOut40 { + animation-name: fadeOut, slideRightOut40; + -webkit-animation-duration: 0.167s; + -moz-animation-duration: 0.167s; + -ms-animation-duration: 0.167s; + -o-animation-duration: 0.167s; + animation-timing-function: cubic-bezier(0.1, 0.25, 0.75, 0.9); + animation-fill-mode: both; +} + +@keyframes slideRightOut40 { + from { + transform: translate3d(0px, 0px, 0px); + } + + to { + transform: translate3d(40px, 0px, 0px); + } +} + +.ms-u-slideLeftOut40 { + animation-name: fadeOut, slideLeftOut40; + -webkit-animation-duration: 0.167s; + -moz-animation-duration: 0.167s; + -ms-animation-duration: 0.167s; + -o-animation-duration: 0.167s; + animation-timing-function: cubic-bezier(0.1, 0.25, 0.75, 0.9); + animation-fill-mode: both; +} + +@keyframes slideLeftOut40 { + from { + transform: translate3d(0, 0px, 0px); + } + + to { + transform: translate3d(-40px, 0px, 0px); + } +} + +.ms-u-slideRightOut400 { + animation-name: fadeOut, slideRightOut400; + -webkit-animation-duration: 0.167s; + -moz-animation-duration: 0.167s; + -ms-animation-duration: 0.167s; + -o-animation-duration: 0.167s; + animation-timing-function: cubic-bezier(0.1, 0.25, 0.75, 0.9); + animation-fill-mode: both; +} + +@keyframes slideRightOut400 { + from { + transform: translate3d(0, 0px, 0px); + } + + to { + transform: translate3d(400px, 0px, 0px); + } +} + +.ms-u-slideLeftOut400 { + animation-name: fadeOut, slideLeftOut400; + -webkit-animation-duration: 0.167s; + -moz-animation-duration: 0.167s; + -ms-animation-duration: 0.167s; + -o-animation-duration: 0.167s; + animation-timing-function: cubic-bezier(0.1, 0.25, 0.75, 0.9); + animation-fill-mode: both; +} + +@keyframes slideLeftOut400 { + from { + transform: translate3d(0, 0px, 0px); + } + + to { + transform: translate3d(-400px, 0px, 0px); + } +} + +.ms-u-slideUpOut20 { + animation-name: fadeOut, slideUpOut20; + -webkit-animation-duration: 0.167s; + -moz-animation-duration: 0.167s; + -ms-animation-duration: 0.167s; + -o-animation-duration: 0.167s; + animation-timing-function: cubic-bezier(0.1, 0.25, 0.75, 0.9); + animation-fill-mode: both; +} + +@keyframes slideUpOut20 { + from { + transform: translate3d(0px, 0, 0px); + } + + to { + transform: translate3d(0px, -20px, 0px); + } +} + +.ms-u-slideUpOut10 { + animation-name: fadeOut, slideUpOut10; + -webkit-animation-duration: 0.167s; + -moz-animation-duration: 0.167s; + -ms-animation-duration: 0.167s; + -o-animation-duration: 0.167s; + animation-timing-function: cubic-bezier(0.1, 0.25, 0.75, 0.9); + animation-fill-mode: both; +} + +@keyframes slideUpOut10 { + from { + transform: translate3d(0px, 0, 0px); + } + + to { + transform: translate3d(0px, -10px, 0px); + } +} + +.ms-u-slideDownOut20 { + animation-name: fadeOut, slideDownOut20; + -webkit-animation-duration: 0.167s; + -moz-animation-duration: 0.167s; + -ms-animation-duration: 0.167s; + -o-animation-duration: 0.167s; + animation-timing-function: cubic-bezier(0.1, 0.25, 0.75, 0.9); + animation-fill-mode: both; +} + +@keyframes slideDownOut20 { + from { + transform: translate3d(0px, 0, 0px); + } + + to { + transform: translate3d(0px, 20px, 0px); + } +} + +.ms-u-slideDownOut10 { + animation-name: fadeOut, slideDownOut10; + -webkit-animation-duration: 0.167s; + -moz-animation-duration: 0.167s; + -ms-animation-duration: 0.167s; + -o-animation-duration: 0.167s; + animation-timing-function: cubic-bezier(0.1, 0.25, 0.75, 0.9); + animation-fill-mode: both; +} + +@keyframes slideDownOut10 { + from { + transform: translate3d(0px, 0, 0px); + } + + to { + transform: translate3d(0px, 10px, 0px); + } +} + +.ms-u-scaleUpIn100 { + animation-name: fadeIn, scaleUp100; + -webkit-animation-duration: 0.367s; + -moz-animation-duration: 0.367s; + -ms-animation-duration: 0.367s; + -o-animation-duration: 0.367s; + animation-timing-function: cubic-bezier(0.1, 0.9, 0.2, 1); + animation-fill-mode: both; +} + +@keyframes scaleUp100 { + from { + transform: scale3d(0.98, 0.98, 1); + } + + to { + transform: scale3d(1, 1, 1); + } +} + +.ms-u-scaleDownIn100 { + animation-name: fadeIn, scaleDown100; + -webkit-animation-duration: 0.367s; + -moz-animation-duration: 0.367s; + -ms-animation-duration: 0.367s; + -o-animation-duration: 0.367s; + animation-timing-function: cubic-bezier(0.1, 0.9, 0.2, 1); + animation-fill-mode: both; +} + +@keyframes scaleDown100 { + from { + transform: scale3d(1.03, 1.03, 1); + } + + to { + transform: scale3d(1, 1, 1); + } +} + +.ms-u-scaleUpOut103 { + animation-name: fadeOut, scaleUp103; + -webkit-animation-duration: 0.167s; + -moz-animation-duration: 0.167s; + -ms-animation-duration: 0.167s; + -o-animation-duration: 0.167s; + animation-timing-function: cubic-bezier(0.1, 0.25, 0.75, 0.9); + animation-fill-mode: both; +} + +@keyframes scaleUp103 { + from { + transform: scale3d(1, 1, 1); + } + + to { + transform: scale3d(1.03, 1.03, 1); + } +} + +.ms-u-scaleDownOut98 { + animation-name: fadeOut, scaleDown98; + -webkit-animation-duration: 0.167s; + -moz-animation-duration: 0.167s; + -ms-animation-duration: 0.167s; + -o-animation-duration: 0.167s; + animation-timing-function: cubic-bezier(0.1, 0.25, 0.75, 0.9); + animation-fill-mode: both; +} + +@keyframes scaleDown98 { + from { + transform: scale3d(1, 1, 1); + } + + to { + transform: scale3d(0.98, 0.98, 1); + } +} + +.ms-u-fadeIn400 { + -webkit-animation-duration: 0.367s; + -webkit-animation-name: fadeIn; + -webkit-animation-fill-mode: both; + animation-duration: 0.367s; + animation-name: fadeIn; + animation-fill-mode: both; +} + +.ms-u-fadeIn100 { + -webkit-animation-duration: 0.367s; + -webkit-animation-name: fadeIn; + -webkit-animation-fill-mode: both; + animation-duration: 0.367s; + animation-name: fadeIn; + animation-fill-mode: both; + animation-duration: 0.167s; +} + +.ms-u-fadeIn200 { + -webkit-animation-duration: 0.367s; + -webkit-animation-name: fadeIn; + -webkit-animation-fill-mode: both; + animation-duration: 0.367s; + animation-name: fadeIn; + animation-fill-mode: both; + animation-duration: 0.267s; +} + +.ms-u-fadeIn500 { + -webkit-animation-duration: 0.367s; + -webkit-animation-name: fadeIn; + -webkit-animation-fill-mode: both; + animation-duration: 0.367s; + animation-name: fadeIn; + animation-fill-mode: both; + animation-duration: 0.467s; +} + +@keyframes fadeIn { + from { + opacity: 0; + animation-timing-function: cubic-bezier(0.1, 0.25, 0.75, 0.9); + } + + to { + opacity: 1; + } +} + +.ms-u-fadeOut400 { + -webkit-animation-duration: 0.367s; + -webkit-animation-name: fadeOut; + -webkit-animation-fill-mode: both; + animation-duration: 0.367s; + animation-name: fadeOut; + animation-fill-mode: both; +} + +.ms-u-fadeOut100 { + -webkit-animation-duration: 0.367s; + -webkit-animation-name: fadeOut; + -webkit-animation-fill-mode: both; + animation-duration: 0.367s; + animation-name: fadeOut; + animation-fill-mode: both; + animation-duration: 0.1s; +} + +.ms-u-fadeOut200 { + -webkit-animation-duration: 0.367s; + -webkit-animation-name: fadeOut; + -webkit-animation-fill-mode: both; + animation-duration: 0.367s; + animation-name: fadeOut; + animation-fill-mode: both; + animation-duration: 0.167s; +} + +.ms-u-fadeOut500 { + -webkit-animation-duration: 0.367s; + -webkit-animation-name: fadeOut; + -webkit-animation-fill-mode: both; + animation-duration: 0.367s; + animation-name: fadeOut; + animation-fill-mode: both; + animation-duration: 0.467s; +} + +@keyframes fadeOut { + from { + opacity: 1; + animation-timing-function: cubic-bezier(0.1, 0.25, 0.75, 0.9); + } + + to { + opacity: 0; + } +} + +.ms-u-rotate90deg { + animation-name: rotate90; + -webkit-animation-duration: 0.1s; + -moz-animation-duration: 0.1s; + -ms-animation-duration: 0.1s; + -o-animation-duration: 0.1s; + animation-timing-function: cubic-bezier(0.1, 0.25, 0.75, 0.9); + animation-fill-mode: both; +} + +@keyframes rotate90 { + from { + transform: rotateZ(0deg); + } + + to { + transform: rotateZ(90deg); + } +} + +.ms-u-rotateN90deg { + animation-name: rotateN90; + -webkit-animation-duration: 0.1s; + -moz-animation-duration: 0.1s; + -ms-animation-duration: 0.1s; + -o-animation-duration: 0.1s; + animation-timing-function: cubic-bezier(0.1, 0.25, 0.75, 0.9); + animation-fill-mode: both; +} + +@keyframes rotateN90 { + from { + transform: rotateZ(90deg); + } + + to { + transform: rotateZ(0deg); + } +} + +.ms-u-expandCollapse400 { + transition: height 0.367s cubic-bezier(0.1, 0.25, 0.75, 0.9); +} + +.ms-u-expandCollapse200 { + transition: height 0.167s cubic-bezier(0.1, 0.25, 0.75, 0.9); +} + +.ms-u-expandCollapse100 { + transition: height 0.1s cubic-bezier(0.1, 0.25, 0.75, 0.9); +} + +.ms-u-delay100 { + animation-delay: 0.167s; +} + +.ms-u-delay200 { + animation-delay: 0.267s; +} + +@media (max-width: 479px) { + .ms-u-hiddenSm, + .ms-u-hiddenMdDown, + .ms-u-hiddenLgDown, + .ms-u-hiddenXlDown, + .ms-u-hiddenXxlDown { + display: none !important; + } +} + +@media (min-width: 480px) and (max-width: 639px) { + .ms-u-hiddenMd, + .ms-u-hiddenMdUp, + .ms-u-hiddenMdDown, + .ms-u-hiddenLgDown, + .ms-u-hiddenXlDown, + .ms-u-hiddenXxlDown { + display: none !important; + } +} + +@media (min-width: 640px) and (max-width: 1023px) { + .ms-u-hiddenMdUp, + .ms-u-hiddenLg, + .ms-u-hiddenLgUp, + .ms-u-hiddenLgDown, + .ms-u-hiddenXlDown, + .ms-u-hiddenXxlDown { + display: none !important; + } +} + +@media (min-width: 1024px) and (max-width: 1365px) { + .ms-u-hiddenMdUp, + .ms-u-hiddenLgUp, + .ms-u-hiddenXl, + .ms-u-hiddenXlUp, + .ms-u-hiddenXlDown, + .ms-u-hiddenXxlDown { + display: none !important; + } +} + +@media (min-width: 1366px) and (max-width: 1919px) { + .ms-u-hiddenMdUp, + .ms-u-hiddenLgUp, + .ms-u-hiddenXlUp, + .ms-u-hiddenXxl, + .ms-u-hiddenXxlUp, + .ms-u-hiddenXxlDown { + display: none !important; + } +} + +@media (min-width: 1920px) { + .ms-u-hiddenMdUp, + .ms-u-hiddenLgUp, + .ms-u-hiddenXlUp, + .ms-u-hiddenXxlUp, + .ms-u-hiddenXxxl { + display: none !important; + } +} + +.ms-u-sm12 { + width: 100%; +} + +.ms-u-sm11 { + width: 91.66666666666666%; +} + +.ms-u-sm10 { + width: 83.33333333333334%; +} + +.ms-u-sm9 { + width: 75%; +} + +.ms-u-sm8 { + width: 66.66666666666666%; +} + +.ms-u-sm7 { + width: 58.333333333333336%; +} + +.ms-u-sm6 { + width: 50%; +} + +.ms-u-sm5 { + width: 41.66666666666667%; +} + +.ms-u-sm4 { + width: 33.33333333333333%; +} + +.ms-u-sm3 { + width: 25%; +} + +.ms-u-sm2 { + width: 16.666666666666664%; +} + +.ms-u-sm1 { + width: 8.333333333333332%; +} + +.ms-u-smPull12 { + right: 100%; +} + +.ms-u-smPull11 { + right: 91.66666666666666%; +} + +.ms-u-smPull10 { + right: 83.33333333333334%; +} + +.ms-u-smPull9 { + right: 75%; +} + +.ms-u-smPull8 { + right: 66.66666666666666%; +} + +.ms-u-smPull7 { + right: 58.333333333333336%; +} + +.ms-u-smPull6 { + right: 50%; +} + +.ms-u-smPull5 { + right: 41.66666666666667%; +} + +.ms-u-smPull4 { + right: 33.33333333333333%; +} + +.ms-u-smPull3 { + right: 25%; +} + +.ms-u-smPull2 { + right: 16.666666666666664%; +} + +.ms-u-smPull1 { + right: 8.333333333333332%; +} + +.ms-u-smPull0 { + right: auto; +} + +.ms-u-smPush12 { + left: 100%; +} + +.ms-u-smPush11 { + left: 91.66666666666666%; +} + +.ms-u-smPush10 { + left: 83.33333333333334%; +} + +.ms-u-smPush9 { + left: 75%; +} + +.ms-u-smPush8 { + left: 66.66666666666666%; +} + +.ms-u-smPush7 { + left: 58.333333333333336%; +} + +.ms-u-smPush6 { + left: 50%; +} + +.ms-u-smPush5 { + left: 41.66666666666667%; +} + +.ms-u-smPush4 { + left: 33.33333333333333%; +} + +.ms-u-smPush3 { + left: 25%; +} + +.ms-u-smPush2 { + left: 16.666666666666664%; +} + +.ms-u-smPush1 { + left: 8.333333333333332%; +} + +.ms-u-smPush0 { + left: auto; +} + +.ms-u-smOffset11 { + margin-left: 91.66666666666666%; +} + +.ms-u-smOffset10 { + margin-left: 83.33333333333334%; +} + +.ms-u-smOffset9 { + margin-left: 75%; +} + +.ms-u-smOffset8 { + margin-left: 66.66666666666666%; +} + +.ms-u-smOffset7 { + margin-left: 58.333333333333336%; +} + +.ms-u-smOffset6 { + margin-left: 50%; +} + +.ms-u-smOffset5 { + margin-left: 41.66666666666667%; +} + +.ms-u-smOffset4 { + margin-left: 33.33333333333333%; +} + +.ms-u-smOffset3 { + margin-left: 25%; +} + +.ms-u-smOffset2 { + margin-left: 16.666666666666664%; +} + +.ms-u-smOffset1 { + margin-left: 8.333333333333332%; +} + +.ms-u-smOffset0 { + margin-left: 0; +} + +@media (min-width: 480px) { + .ms-u-md12 { + width: 100%; + } + + .ms-u-md11 { + width: 91.66666666666666%; + } + + .ms-u-md10 { + width: 83.33333333333334%; + } + + .ms-u-md9 { + width: 75%; + } + + .ms-u-md8 { + width: 66.66666666666666%; + } + + .ms-u-md7 { + width: 58.333333333333336%; + } + + .ms-u-md6 { + width: 50%; + } + + .ms-u-md5 { + width: 41.66666666666667%; + } + + .ms-u-md4 { + width: 33.33333333333333%; + } + + .ms-u-md3 { + width: 25%; + } + + .ms-u-md2 { + width: 16.666666666666664%; + } + + .ms-u-md1 { + width: 8.333333333333332%; + } + + .ms-u-mdPull12 { + right: 100%; + } + + .ms-u-mdPull11 { + right: 91.66666666666666%; + } + + .ms-u-mdPull10 { + right: 83.33333333333334%; + } + + .ms-u-mdPull9 { + right: 75%; + } + + .ms-u-mdPull8 { + right: 66.66666666666666%; + } + + .ms-u-mdPull7 { + right: 58.333333333333336%; + } + + .ms-u-mdPull6 { + right: 50%; + } + + .ms-u-mdPull5 { + right: 41.66666666666667%; + } + + .ms-u-mdPull4 { + right: 33.33333333333333%; + } + + .ms-u-mdPull3 { + right: 25%; + } + + .ms-u-mdPull2 { + right: 16.666666666666664%; + } + + .ms-u-mdPull1 { + right: 8.333333333333332%; + } + + .ms-u-mdPull0 { + right: auto; + } + + .ms-u-mdPush12 { + left: 100%; + } + + .ms-u-mdPush11 { + left: 91.66666666666666%; + } + + .ms-u-mdPush10 { + left: 83.33333333333334%; + } + + .ms-u-mdPush9 { + left: 75%; + } + + .ms-u-mdPush8 { + left: 66.66666666666666%; + } + + .ms-u-mdPush7 { + left: 58.333333333333336%; + } + + .ms-u-mdPush6 { + left: 50%; + } + + .ms-u-mdPush5 { + left: 41.66666666666667%; + } + + .ms-u-mdPush4 { + left: 33.33333333333333%; + } + + .ms-u-mdPush3 { + left: 25%; + } + + .ms-u-mdPush2 { + left: 16.666666666666664%; + } + + .ms-u-mdPush1 { + left: 8.333333333333332%; + } + + .ms-u-mdPush0 { + left: auto; + } + + .ms-u-mdOffset11 { + margin-left: 91.66666666666666%; + } + + .ms-u-mdOffset10 { + margin-left: 83.33333333333334%; + } + + .ms-u-mdOffset9 { + margin-left: 75%; + } + + .ms-u-mdOffset8 { + margin-left: 66.66666666666666%; + } + + .ms-u-mdOffset7 { + margin-left: 58.333333333333336%; + } + + .ms-u-mdOffset6 { + margin-left: 50%; + } + + .ms-u-mdOffset5 { + margin-left: 41.66666666666667%; + } + + .ms-u-mdOffset4 { + margin-left: 33.33333333333333%; + } + + .ms-u-mdOffset3 { + margin-left: 25%; + } + + .ms-u-mdOffset2 { + margin-left: 16.666666666666664%; + } + + .ms-u-mdOffset1 { + margin-left: 8.333333333333332%; + } + + .ms-u-mdOffset0 { + margin-left: 0; + } +} + +@media (min-width: 640px) { + .ms-u-lg12 { + width: 100%; + } + + .ms-u-lg11 { + width: 91.66666666666666%; + } + + .ms-u-lg10 { + width: 83.33333333333334%; + } + + .ms-u-lg9 { + width: 75%; + } + + .ms-u-lg8 { + width: 66.66666666666666%; + } + + .ms-u-lg7 { + width: 58.333333333333336%; + } + + .ms-u-lg6 { + width: 50%; + } + + .ms-u-lg5 { + width: 41.66666666666667%; + } + + .ms-u-lg4 { + width: 33.33333333333333%; + } + + .ms-u-lg3 { + width: 25%; + } + + .ms-u-lg2 { + width: 16.666666666666664%; + } + + .ms-u-lg1 { + width: 8.333333333333332%; + } + + .ms-u-lgPull12 { + right: 100%; + } + + .ms-u-lgPull11 { + right: 91.66666666666666%; + } + + .ms-u-lgPull10 { + right: 83.33333333333334%; + } + + .ms-u-lgPull9 { + right: 75%; + } + + .ms-u-lgPull8 { + right: 66.66666666666666%; + } + + .ms-u-lgPull7 { + right: 58.333333333333336%; + } + + .ms-u-lgPull6 { + right: 50%; + } + + .ms-u-lgPull5 { + right: 41.66666666666667%; + } + + .ms-u-lgPull4 { + right: 33.33333333333333%; + } + + .ms-u-lgPull3 { + right: 25%; + } + + .ms-u-lgPull2 { + right: 16.666666666666664%; + } + + .ms-u-lgPull1 { + right: 8.333333333333332%; + } + + .ms-u-lgPull0 { + right: auto; + } + + .ms-u-lgPush12 { + left: 100%; + } + + .ms-u-lgPush11 { + left: 91.66666666666666%; + } + + .ms-u-lgPush10 { + left: 83.33333333333334%; + } + + .ms-u-lgPush9 { + left: 75%; + } + + .ms-u-lgPush8 { + left: 66.66666666666666%; + } + + .ms-u-lgPush7 { + left: 58.333333333333336%; + } + + .ms-u-lgPush6 { + left: 50%; + } + + .ms-u-lgPush5 { + left: 41.66666666666667%; + } + + .ms-u-lgPush4 { + left: 33.33333333333333%; + } + + .ms-u-lgPush3 { + left: 25%; + } + + .ms-u-lgPush2 { + left: 16.666666666666664%; + } + + .ms-u-lgPush1 { + left: 8.333333333333332%; + } + + .ms-u-lgPush0 { + left: auto; + } + + .ms-u-lgOffset11 { + margin-left: 91.66666666666666%; + } + + .ms-u-lgOffset10 { + margin-left: 83.33333333333334%; + } + + .ms-u-lgOffset9 { + margin-left: 75%; + } + + .ms-u-lgOffset8 { + margin-left: 66.66666666666666%; + } + + .ms-u-lgOffset7 { + margin-left: 58.333333333333336%; + } + + .ms-u-lgOffset6 { + margin-left: 50%; + } + + .ms-u-lgOffset5 { + margin-left: 41.66666666666667%; + } + + .ms-u-lgOffset4 { + margin-left: 33.33333333333333%; + } + + .ms-u-lgOffset3 { + margin-left: 25%; + } + + .ms-u-lgOffset2 { + margin-left: 16.666666666666664%; + } + + .ms-u-lgOffset1 { + margin-left: 8.333333333333332%; + } + + .ms-u-lgOffset0 { + margin-left: 0; + } +} + +@media (min-width: 1024px) { + .ms-u-xl12 { + width: 100%; + } + + .ms-u-xl11 { + width: 91.66666666666666%; + } + + .ms-u-xl10 { + width: 83.33333333333334%; + } + + .ms-u-xl9 { + width: 75%; + } + + .ms-u-xl8 { + width: 66.66666666666666%; + } + + .ms-u-xl7 { + width: 58.333333333333336%; + } + + .ms-u-xl6 { + width: 50%; + } + + .ms-u-xl5 { + width: 41.66666666666667%; + } + + .ms-u-xl4 { + width: 33.33333333333333%; + } + + .ms-u-xl3 { + width: 25%; + } + + .ms-u-xl2 { + width: 16.666666666666664%; + } + + .ms-u-xl1 { + width: 8.333333333333332%; + } + + .ms-u-xlPull12 { + right: 100%; + } + + .ms-u-xlPull11 { + right: 91.66666666666666%; + } + + .ms-u-xlPull10 { + right: 83.33333333333334%; + } + + .ms-u-xlPull9 { + right: 75%; + } + + .ms-u-xlPull8 { + right: 66.66666666666666%; + } + + .ms-u-xlPull7 { + right: 58.333333333333336%; + } + + .ms-u-xlPull6 { + right: 50%; + } + + .ms-u-xlPull5 { + right: 41.66666666666667%; + } + + .ms-u-xlPull4 { + right: 33.33333333333333%; + } + + .ms-u-xlPull3 { + right: 25%; + } + + .ms-u-xlPull2 { + right: 16.666666666666664%; + } + + .ms-u-xlPull1 { + right: 8.333333333333332%; + } + + .ms-u-xlPull0 { + right: auto; + } + + .ms-u-xlPush12 { + left: 100%; + } + + .ms-u-xlPush11 { + left: 91.66666666666666%; + } + + .ms-u-xlPush10 { + left: 83.33333333333334%; + } + + .ms-u-xlPush9 { + left: 75%; + } + + .ms-u-xlPush8 { + left: 66.66666666666666%; + } + + .ms-u-xlPush7 { + left: 58.333333333333336%; + } + + .ms-u-xlPush6 { + left: 50%; + } + + .ms-u-xlPush5 { + left: 41.66666666666667%; + } + + .ms-u-xlPush4 { + left: 33.33333333333333%; + } + + .ms-u-xlPush3 { + left: 25%; + } + + .ms-u-xlPush2 { + left: 16.666666666666664%; + } + + .ms-u-xlPush1 { + left: 8.333333333333332%; + } + + .ms-u-xlPush0 { + left: auto; + } + + .ms-u-xlOffset11 { + margin-left: 91.66666666666666%; + } + + .ms-u-xlOffset10 { + margin-left: 83.33333333333334%; + } + + .ms-u-xlOffset9 { + margin-left: 75%; + } + + .ms-u-xlOffset8 { + margin-left: 66.66666666666666%; + } + + .ms-u-xlOffset7 { + margin-left: 58.333333333333336%; + } + + .ms-u-xlOffset6 { + margin-left: 50%; + } + + .ms-u-xlOffset5 { + margin-left: 41.66666666666667%; + } + + .ms-u-xlOffset4 { + margin-left: 33.33333333333333%; + } + + .ms-u-xlOffset3 { + margin-left: 25%; + } + + .ms-u-xlOffset2 { + margin-left: 16.666666666666664%; + } + + .ms-u-xlOffset1 { + margin-left: 8.333333333333332%; + } + + .ms-u-xlOffset0 { + margin-left: 0; + } +} + +@media (min-width: 1366px) { + .ms-u-xxl12 { + width: 100%; + } + + .ms-u-xxl11 { + width: 91.66666666666666%; + } + + .ms-u-xxl10 { + width: 83.33333333333334%; + } + + .ms-u-xxl9 { + width: 75%; + } + + .ms-u-xxl8 { + width: 66.66666666666666%; + } + + .ms-u-xxl7 { + width: 58.333333333333336%; + } + + .ms-u-xxl6 { + width: 50%; + } + + .ms-u-xxl5 { + width: 41.66666666666667%; + } + + .ms-u-xxl4 { + width: 33.33333333333333%; + } + + .ms-u-xxl3 { + width: 25%; + } + + .ms-u-xxl2 { + width: 16.666666666666664%; + } + + .ms-u-xxl1 { + width: 8.333333333333332%; + } + + .ms-u-xxlPull12 { + right: 100%; + } + + .ms-u-xxlPull11 { + right: 91.66666666666666%; + } + + .ms-u-xxlPull10 { + right: 83.33333333333334%; + } + + .ms-u-xxlPull9 { + right: 75%; + } + + .ms-u-xxlPull8 { + right: 66.66666666666666%; + } + + .ms-u-xxlPull7 { + right: 58.333333333333336%; + } + + .ms-u-xxlPull6 { + right: 50%; + } + + .ms-u-xxlPull5 { + right: 41.66666666666667%; + } + + .ms-u-xxlPull4 { + right: 33.33333333333333%; + } + + .ms-u-xxlPull3 { + right: 25%; + } + + .ms-u-xxlPull2 { + right: 16.666666666666664%; + } + + .ms-u-xxlPull1 { + right: 8.333333333333332%; + } + + .ms-u-xxlPull0 { + right: auto; + } + + .ms-u-xxlPush12 { + left: 100%; + } + + .ms-u-xxlPush11 { + left: 91.66666666666666%; + } + + .ms-u-xxlPush10 { + left: 83.33333333333334%; + } + + .ms-u-xxlPush9 { + left: 75%; + } + + .ms-u-xxlPush8 { + left: 66.66666666666666%; + } + + .ms-u-xxlPush7 { + left: 58.333333333333336%; + } + + .ms-u-xxlPush6 { + left: 50%; + } + + .ms-u-xxlPush5 { + left: 41.66666666666667%; + } + + .ms-u-xxlPush4 { + left: 33.33333333333333%; + } + + .ms-u-xxlPush3 { + left: 25%; + } + + .ms-u-xxlPush2 { + left: 16.666666666666664%; + } + + .ms-u-xxlPush1 { + left: 8.333333333333332%; + } + + .ms-u-xxlPush0 { + left: auto; + } + + .ms-u-xxlOffset11 { + margin-left: 91.66666666666666%; + } + + .ms-u-xxlOffset10 { + margin-left: 83.33333333333334%; + } + + .ms-u-xxlOffset9 { + margin-left: 75%; + } + + .ms-u-xxlOffset8 { + margin-left: 66.66666666666666%; + } + + .ms-u-xxlOffset7 { + margin-left: 58.333333333333336%; + } + + .ms-u-xxlOffset6 { + margin-left: 50%; + } + + .ms-u-xxlOffset5 { + margin-left: 41.66666666666667%; + } + + .ms-u-xxlOffset4 { + margin-left: 33.33333333333333%; + } + + .ms-u-xxlOffset3 { + margin-left: 25%; + } + + .ms-u-xxlOffset2 { + margin-left: 16.666666666666664%; + } + + .ms-u-xxlOffset1 { + margin-left: 8.333333333333332%; + } + + .ms-u-xxlOffset0 { + margin-left: 0; + } +} + +@media (min-width: 1920px) { + .ms-u-xxxl12 { + width: 100%; + } + + .ms-u-xxxl11 { + width: 91.66666666666666%; + } + + .ms-u-xxxl10 { + width: 83.33333333333334%; + } + + .ms-u-xxxl9 { + width: 75%; + } + + .ms-u-xxxl8 { + width: 66.66666666666666%; + } + + .ms-u-xxxl7 { + width: 58.333333333333336%; + } + + .ms-u-xxxl6 { + width: 50%; + } + + .ms-u-xxxl5 { + width: 41.66666666666667%; + } + + .ms-u-xxxl4 { + width: 33.33333333333333%; + } + + .ms-u-xxxl3 { + width: 25%; + } + + .ms-u-xxxl2 { + width: 16.666666666666664%; + } + + .ms-u-xxxl1 { + width: 8.333333333333332%; + } + + .ms-u-xxxlPull12 { + right: 100%; + } + + .ms-u-xxxlPull11 { + right: 91.66666666666666%; + } + + .ms-u-xxxlPull10 { + right: 83.33333333333334%; + } + + .ms-u-xxxlPull9 { + right: 75%; + } + + .ms-u-xxxlPull8 { + right: 66.66666666666666%; + } + + .ms-u-xxxlPull7 { + right: 58.333333333333336%; + } + + .ms-u-xxxlPull6 { + right: 50%; + } + + .ms-u-xxxlPull5 { + right: 41.66666666666667%; + } + + .ms-u-xxxlPull4 { + right: 33.33333333333333%; + } + + .ms-u-xxxlPull3 { + right: 25%; + } + + .ms-u-xxxlPull2 { + right: 16.666666666666664%; + } + + .ms-u-xxxlPull1 { + right: 8.333333333333332%; + } + + .ms-u-xxxlPull0 { + right: auto; + } + + .ms-u-xxxlPush12 { + left: 100%; + } + + .ms-u-xxxlPush11 { + left: 91.66666666666666%; + } + + .ms-u-xxxlPush10 { + left: 83.33333333333334%; + } + + .ms-u-xxxlPush9 { + left: 75%; + } + + .ms-u-xxxlPush8 { + left: 66.66666666666666%; + } + + .ms-u-xxxlPush7 { + left: 58.333333333333336%; + } + + .ms-u-xxxlPush6 { + left: 50%; + } + + .ms-u-xxxlPush5 { + left: 41.66666666666667%; + } + + .ms-u-xxxlPush4 { + left: 33.33333333333333%; + } + + .ms-u-xxxlPush3 { + left: 25%; + } + + .ms-u-xxxlPush2 { + left: 16.666666666666664%; + } + + .ms-u-xxxlPush1 { + left: 8.333333333333332%; + } + + .ms-u-xxxlPush0 { + left: auto; + } + + .ms-u-xxxlOffset11 { + margin-left: 91.66666666666666%; + } + + .ms-u-xxxlOffset10 { + margin-left: 83.33333333333334%; + } + + .ms-u-xxxlOffset9 { + margin-left: 75%; + } + + .ms-u-xxxlOffset8 { + margin-left: 66.66666666666666%; + } + + .ms-u-xxxlOffset7 { + margin-left: 58.333333333333336%; + } + + .ms-u-xxxlOffset6 { + margin-left: 50%; + } + + .ms-u-xxxlOffset5 { + margin-left: 41.66666666666667%; + } + + .ms-u-xxxlOffset4 { + margin-left: 33.33333333333333%; + } + + .ms-u-xxxlOffset3 { + margin-left: 25%; + } + + .ms-u-xxxlOffset2 { + margin-left: 16.666666666666664%; + } + + .ms-u-xxxlOffset1 { + margin-left: 8.333333333333332%; + } + + .ms-u-xxxlOffset0 { + margin-left: 0; + } +} + +.ms-Grid { + box-sizing: border-box; + *zoom: 1; + padding: 0 8px; +} + +.ms-Grid::before, +.ms-Grid::after { + display: table; + content: ''; + line-height: 0; +} + +.ms-Grid::after { + clear: both; +} + +.ms-Grid-row { + margin: 0 -8px; + box-sizing: border-box; + *zoom: 1; +} + +.ms-Grid-row::before, +.ms-Grid-row::after { + display: table; + content: ''; + line-height: 0; +} + +.ms-Grid-row::after { + clear: both; +} + +.ms-Grid-col { + position: relative; + min-height: 1px; + padding-left: 8px; + padding-right: 8px; + box-sizing: border-box; + float: left; +} + +.ms-Grid-col .ms-Grid { + padding: 0; +} + +.ms-Fabric { + color: #333333; +} diff --git a/dist/css/fabric.min.css b/dist/css/fabric.min.css new file mode 100644 index 000000000..a286da3f3 --- /dev/null +++ b/dist/css/fabric.min.css @@ -0,0 +1,6 @@ +/* Copyright (c) Microsoft. All rights reserved. Licensed under the MIT license. See LICENSE in the project root for license information. */ +/** + * Office UI Fabric 4.0.0 + * The front-end framework for building experiences for Office 365. + **/ +.ms-u-borderBox,.ms-u-borderBox:after,.ms-u-borderBox:before{box-sizing:border-box}.ms-u-borderBase{border:1px solid}.ms-u-clearfix{*zoom:1}.ms-u-clearfix:after,.ms-u-clearfix:before{display:table;content:'';line-height:0}.ms-u-clearfix:after{clear:both}.ms-u-normalize{box-sizing:border-box;margin:0;padding:0;box-shadow:none}.ms-u-textAlignLeft{text-align:left}.ms-u-textAlignCenter{text-align:center}.ms-u-textAlignRight{text-align:right}.ms-u-screenReaderOnly{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);border:0}.ms-u-textTruncate{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;word-wrap:normal}.ms-u-noWrap{white-space:nowrap}.ms-bgColor-themeDark,.ms-bgColor-themeDark--hover:hover{background-color:#005a9e}.ms-bgColor-themeDarkAlt,.ms-bgColor-themeDarkAlt--hover:hover{background-color:#106ebe}.ms-bgColor-themeDarker,.ms-bgColor-themeDarker--hover:hover{background-color:#004578}.ms-bgColor-themePrimary,.ms-bgColor-themePrimary--hover:hover{background-color:#0078d7}.ms-bgColor-themeSecondary,.ms-bgColor-themeSecondary--hover:hover{background-color:#2488d8}.ms-bgColor-themeTertiary,.ms-bgColor-themeTertiary--hover:hover{background-color:#69afe5}.ms-bgColor-themeLight,.ms-bgColor-themeLight--hover:hover{background-color:#b3d6f2}.ms-bgColor-themeLighter,.ms-bgColor-themeLighter--hover:hover{background-color:#deecf9}.ms-bgColor-themeLighterAlt,.ms-bgColor-themeLighterAlt--hover:hover{background-color:#eff6fc}.ms-bgColor-black,.ms-bgColor-black--hover:hover{background-color:#000}.ms-bgColor-neutralDark,.ms-bgColor-neutralDark--hover:hover{background-color:#212121}.ms-bgColor-neutralPrimary,.ms-bgColor-neutralPrimary--hover:hover{background-color:#333}.ms-bgColor-neutralPrimaryAlt,.ms-bgColor-neutralPrimaryAlt--hover:hover{background-color:#3c3c3c}.ms-bgColor-neutralSecondary,.ms-bgColor-neutralSecondary--hover:hover{background-color:#666}.ms-bgColor-neutralSecondaryAlt,.ms-bgColor-neutralSecondaryAlt--hover:hover{background-color:#767676}.ms-bgColor-neutralTertiary,.ms-bgColor-neutralTertiary--hover:hover{background-color:#a6a6a6}.ms-bgColor-neutralTertiaryAlt,.ms-bgColor-neutralTertiaryAlt--hover:hover{background-color:#c8c8c8}.ms-bgColor-neutralLight,.ms-bgColor-neutralLight--hover:hover{background-color:#eaeaea}.ms-bgColor-neutralLighter,.ms-bgColor-neutralLighter--hover:hover{background-color:#f4f4f4}.ms-bgColor-neutralLighterAlt,.ms-bgColor-neutralLighterAlt--hover:hover{background-color:#f8f8f8}.ms-bgColor-white,.ms-bgColor-white--hover:hover{background-color:#fff}.ms-bgColor-yellow{background-color:#ffb900}.ms-bgColor-yellowLight{background-color:#fff100}.ms-bgColor-orange{background-color:#d83b01}.ms-bgColor-orangeLight{background-color:#ea4300}.ms-bgColor-orangeLighter{background-color:#ff8c00}.ms-bgColor-redDark{background-color:#a80000}.ms-bgColor-red{background-color:#e81123}.ms-bgColor-magentaDark{background-color:#5c005c}.ms-bgColor-magenta{background-color:#b4009e}.ms-bgColor-magentaLight{background-color:#e3008c}.ms-bgColor-purpleDark{background-color:#32145a}.ms-bgColor-purple{background-color:#5c2d91}.ms-bgColor-purpleLight{background-color:#b4a0ff}.ms-bgColor-blueDark{background-color:#002050}.ms-bgColor-blueMid{background-color:#00188f}.ms-bgColor-blue{background-color:#0078d7}.ms-bgColor-blueLight{background-color:#00bcf2}.ms-bgColor-tealDark{background-color:#004b50}.ms-bgColor-teal{background-color:#008272}.ms-bgColor-tealLight{background-color:#00b294}.ms-bgColor-greenDark{background-color:#004b1c}.ms-bgColor-green{background-color:#107c10}.ms-bgColor-greenLight{background-color:#bad80a}.ms-bgColor-info{background-color:#f4f4f4}.ms-bgColor-success{background-color:#dff6dd}.ms-bgColor-severeWarning{background-color:#fed9cc}.ms-bgColor-warning{background-color:#fff4ce}.ms-bgColor-error{background-color:#fde7e9}.ms-borderColor-themeDark,.ms-borderColor-themeDark--hover:hover{border-color:#005a9e}.ms-borderColor-themeDarkAlt,.ms-borderColor-themeDarkAlt--hover:hover{border-color:#106ebe}.ms-borderColor-themeDarker,.ms-borderColor-themeDarker--hover:hover{border-color:#004578}.ms-borderColor-themePrimary,.ms-borderColor-themePrimary--hover:hover{border-color:#0078d7}.ms-borderColor-themeSecondary,.ms-borderColor-themeSecondary--hover:hover{border-color:#2488d8}.ms-borderColor-themeTertiary,.ms-borderColor-themeTertiary--hover:hover{border-color:#69afe5}.ms-borderColor-themeLight,.ms-borderColor-themeLight--hover:hover{border-color:#b3d6f2}.ms-borderColor-themeLighter,.ms-borderColor-themeLighter--hover:hover{border-color:#deecf9}.ms-borderColor-themeLighterAlt,.ms-borderColor-themeLighterAlt--hover:hover{border-color:#eff6fc}.ms-borderColor-black,.ms-borderColor-black--hover:hover{border-color:#000}.ms-borderColor-neutralDark,.ms-borderColor-neutralDark--hover:hover{border-color:#212121}.ms-borderColor-neutralPrimary,.ms-borderColor-neutralPrimary--hover:hover{border-color:#333}.ms-borderColor-neutralPrimaryAlt,.ms-borderColor-neutralPrimaryAlt--hover:hover{border-color:#3c3c3c}.ms-borderColor-neutralSecondary,.ms-borderColor-neutralSecondary--hover:hover{border-color:#666}.ms-borderColor-neutralSecondaryAlt,.ms-borderColor-neutralSecondaryAlt--hover:hover{border-color:#767676}.ms-borderColor-neutralTertiary,.ms-borderColor-neutralTertiary--hover:hover{border-color:#a6a6a6}.ms-borderColor-neutralTertiaryAlt,.ms-borderColor-neutralTertiaryAlt--hover:hover{border-color:#c8c8c8}.ms-borderColor-neutralLight,.ms-borderColor-neutralLight--hover:hover{border-color:#eaeaea}.ms-borderColor-neutralLighter,.ms-borderColor-neutralLighter--hover:hover{border-color:#f4f4f4}.ms-borderColor-neutralLighterAlt,.ms-borderColor-neutralLighterAlt--hover:hover{border-color:#f8f8f8}.ms-borderColor-white,.ms-borderColor-white--hover:hover{border-color:#fff}.ms-borderColor-yellow{border-color:#ffb900}.ms-borderColor-yellowLight{border-color:#fff100}.ms-borderColor-orange{border-color:#d83b01}.ms-borderColor-orangeLight{border-color:#ea4300}.ms-borderColor-orangeLighter{border-color:#ff8c00}.ms-borderColor-redDark{border-color:#a80000}.ms-borderColor-red{border-color:#e81123}.ms-borderColor-magentaDark{border-color:#5c005c}.ms-borderColor-magenta{border-color:#b4009e}.ms-borderColor-magentaLight{border-color:#e3008c}.ms-borderColor-purpleDark{border-color:#32145a}.ms-borderColor-purple{border-color:#5c2d91}.ms-borderColor-purpleLight{border-color:#b4a0ff}.ms-borderColor-blueDark{border-color:#002050}.ms-borderColor-blueMid{border-color:#00188f}.ms-borderColor-blue{border-color:#0078d7}.ms-borderColor-blueLight{border-color:#00bcf2}.ms-borderColor-tealDark{border-color:#004b50}.ms-borderColor-teal{border-color:#008272}.ms-borderColor-tealLight{border-color:#00b294}.ms-borderColor-greenDark{border-color:#004b1c}.ms-borderColor-green{border-color:#107c10}.ms-borderColor-greenLight{border-color:#bad80a}.ms-borderColorTop-themePrimary,.ms-borderColorTop-themePrimary--hover:hover{border-top-color:#0078d7}.ms-font-su{font-size:42px}.ms-font-su,.ms-font-xxl{font-family:Segoe UI WestEuropean,Segoe UI,-apple-system,BlinkMacSystemFont,Roboto,Helvetica Neue,sans-serif;-webkit-font-smoothing:antialiased;font-weight:100}.ms-font-xxl{font-size:28px}.ms-font-xl{font-size:21px;font-weight:100}.ms-font-l,.ms-font-xl{font-family:Segoe UI WestEuropean,Segoe UI,-apple-system,BlinkMacSystemFont,Roboto,Helvetica Neue,sans-serif;-webkit-font-smoothing:antialiased}.ms-font-l{font-size:17px;font-weight:300}.ms-font-m-plus{font-size:15px}.ms-font-m,.ms-font-m-plus{font-family:Segoe UI WestEuropean,Segoe UI,-apple-system,BlinkMacSystemFont,Roboto,Helvetica Neue,sans-serif;-webkit-font-smoothing:antialiased;font-weight:400}.ms-font-m{font-size:14px}.ms-font-s-plus{font-size:13px}.ms-font-s,.ms-font-s-plus{font-family:Segoe UI WestEuropean,Segoe UI,-apple-system,BlinkMacSystemFont,Roboto,Helvetica Neue,sans-serif;-webkit-font-smoothing:antialiased;font-weight:400}.ms-font-s{font-size:12px}.ms-font-xs{font-size:11px;font-weight:400}.ms-font-mi,.ms-font-xs{font-family:Segoe UI WestEuropean,Segoe UI,-apple-system,BlinkMacSystemFont,Roboto,Helvetica Neue,sans-serif;-webkit-font-smoothing:antialiased}.ms-font-mi{font-size:10px;font-weight:600}.ms-fontWeight-light,.ms-fontWeight-light--hover:hover{font-weight:100}.ms-fontWeight-semilight,.ms-fontWeight-semilight--hover:hover{font-weight:300}.ms-fontWeight-regular,.ms-fontWeight-regular--hover:hover{font-weight:400}.ms-fontWeight-semibold,.ms-fontWeight-semibold--hover:hover{font-weight:600}.ms-fontSize-su{font-size:42px}.ms-fontSize-xxl{font-size:28px}.ms-fontSize-xl{font-size:21px}.ms-fontSize-l{font-size:17px}.ms-fontSize-mPlus{font-size:15px}.ms-fontSize-m{font-size:14px}.ms-fontSize-sPlus{font-size:13px}.ms-fontSize-s{font-size:12px}.ms-fontSize-xs{font-size:11px}.ms-fontSize-mi{font-size:10px}.ms-fontColor-themeDarker,.ms-fontColor-themeDarker--hover:hover{color:#004578}.ms-fontColor-themeDark,.ms-fontColor-themeDark--hover:hover{color:#005a9e}.ms-fontColor-themeDarkAlt,.ms-fontColor-themeDarkAlt--hover:hover{color:#106ebe}.ms-fontColor-themePrimary,.ms-fontColor-themePrimary--hover:hover{color:#0078d7}.ms-fontColor-themeSecondary,.ms-fontColor-themeSecondary--hover:hover{color:#2488d8}.ms-fontColor-themeTertiary,.ms-fontColor-themeTertiary--hover:hover{color:#69afe5}.ms-fontColor-themeLight,.ms-fontColor-themeLight--hover:hover{color:#b3d6f2}.ms-fontColor-themeLighter,.ms-fontColor-themeLighter--hover:hover{color:#deecf9}.ms-fontColor-themeLighterAlt,.ms-fontColor-themeLighterAlt--hover:hover{color:#eff6fc}.ms-fontColor-black,.ms-fontColor-black--hover:hover{color:#000}.ms-fontColor-neutralDark,.ms-fontColor-neutralDark--hover:hover{color:#212121}.ms-fontColor-neutralPrimary,.ms-fontColor-neutralPrimary--hover:hover{color:#333}.ms-fontColor-neutralPrimaryAlt,.ms-fontColor-neutralPrimaryAlt--hover:hover{color:#3c3c3c}.ms-fontColor-neutralSecondary,.ms-fontColor-neutralSecondary--hover:hover{color:#666}.ms-fontColor-neutralSecondaryAlt,.ms-fontColor-neutralSecondaryAlt--hover:hover{color:#767676}.ms-fontColor-neutralTertiary,.ms-fontColor-neutralTertiary--hover:hover{color:#a6a6a6}.ms-fontColor-neutralTertiaryAlt,.ms-fontColor-neutralTertiaryAlt--hover:hover{color:#c8c8c8}.ms-fontColor-neutralLight,.ms-fontColor-neutralLight--hover:hover{color:#eaeaea}.ms-fontColor-neutralLighter,.ms-fontColor-neutralLighter--hover:hover{color:#f4f4f4}.ms-fontColor-neutralLighterAlt,.ms-fontColor-neutralLighterAlt--hover:hover{color:#f8f8f8}.ms-fontColor-white,.ms-fontColor-white--hover:hover{color:#fff}.ms-fontColor-yellow,.ms-fontColor-yellow--hover:hover{color:#ffb900}.ms-fontColor-yellowLight,.ms-fontColor-yellowLight--hover:hover{color:#fff100}.ms-fontColor-orange,.ms-fontColor-orange--hover:hover{color:#d83b01}.ms-fontColor-orangeLight,.ms-fontColor-orangeLight--hover:hover{color:#ea4300}.ms-fontColor-orangeLighter,.ms-fontColor-orangeLighter--hover:hover{color:#ff8c00}.ms-fontColor-redDark,.ms-fontColor-redDark--hover:hover{color:#a80000}.ms-fontColor-red,.ms-fontColor-red--hover:hover{color:#e81123}.ms-fontColor-magentaDark,.ms-fontColor-magentaDark--hover:hover{color:#5c005c}.ms-fontColor-magenta,.ms-fontColor-magenta--hover:hover{color:#b4009e}.ms-fontColor-magentaLight,.ms-fontColor-magentaLight--hover:hover{color:#e3008c}.ms-fontColor-purpleDark,.ms-fontColor-purpleDark--hover:hover{color:#32145a}.ms-fontColor-purple,.ms-fontColor-purple--hover:hover{color:#5c2d91}.ms-fontColor-purpleLight,.ms-fontColor-purpleLight--hover:hover{color:#b4a0ff}.ms-fontColor-blueDark,.ms-fontColor-blueDark--hover:hover{color:#002050}.ms-fontColor-blueMid,.ms-fontColor-blueMid--hover:hover{color:#00188f}.ms-fontColor-blue,.ms-fontColor-blue--hover:hover{color:#0078d7}.ms-fontColor-blueLight,.ms-fontColor-blueLight--hover:hover{color:#00bcf2}.ms-fontColor-tealDark,.ms-fontColor-tealDark--hover:hover{color:#004b50}.ms-fontColor-teal,.ms-fontColor-teal--hover:hover{color:#008272}.ms-fontColor-tealLight,.ms-fontColor-tealLight--hover:hover{color:#00b294}.ms-fontColor-greenDark,.ms-fontColor-greenDark--hover:hover{color:#004b1c}.ms-fontColor-green,.ms-fontColor-green--hover:hover{color:#107c10}.ms-fontColor-greenLight,.ms-fontColor-greenLight--hover:hover{color:#bad80a}.ms-fontColor-info,.ms-fontColor-info--hover:hover{color:#767676}.ms-fontColor-success,.ms-fontColor-success--hover:hover{color:#107c10}.ms-fontColor-alert,.ms-fontColor-alert--hover:hover{color:#d83b01}.ms-fontColor-warning,.ms-fontColor-warning--hover:hover{color:#767676}.ms-fontColor-severeWarning,.ms-fontColor-severeWarning--hover:hover{color:#d83b01}.ms-fontColor-error,.ms-fontColor-error--hover:hover{color:#a80000}@font-face{font-family:Segoe UI WestEuropean;src:local('Segoe UI Light'),url(https://appsforoffice.microsoft.com/fabric/fonts/SegoeUI-WestEuropean/SegoeUI-Light.woff2) format('woff2'),url(https://appsforoffice.microsoft.com/fabric/fonts/SegoeUI-WestEuropean/SegoeUI-Light.woff) format('woff'),url(https://appsforoffice.microsoft.com/fabric/fonts/SegoeUI-WestEuropean/SegoeUI-Light.ttf) format('truetype');font-weight:100;font-style:normal}@font-face{font-family:Segoe UI WestEuropean;src:local('Segoe UI'),url(https://appsforoffice.microsoft.com/fabric/fonts/SegoeUI-WestEuropean/SegoeUI-Regular.woff2) format('woff2'),url(https://appsforoffice.microsoft.com/fabric/fonts/SegoeUI-WestEuropean/SegoeUI-Regular.woff) format('woff'),url(https://appsforoffice.microsoft.com/fabric/fonts/SegoeUI-WestEuropean/SegoeUI-Regular.ttf) format('truetype');font-weight:400;font-style:normal}@font-face{font-family:Segoe UI WestEuropean;src:local('Segoe UI Semibold'),url(https://appsforoffice.microsoft.com/fabric/fonts/SegoeUI-WestEuropean/SegoeUI-Semibold.woff2) format('woff2'),url(https://appsforoffice.microsoft.com/fabric/fonts/SegoeUI-WestEuropean/SegoeUI-Semibold.woff) format('woff'),url(https://appsforoffice.microsoft.com/fabric/fonts/SegoeUI-WestEuropean/SegoeUI-Semibold.ttf) format('truetype');font-weight:600;font-style:normal}@font-face{font-family:Segoe UI WestEuropean;src:local('Segoe UI Semilight'),url(https://appsforoffice.microsoft.com/fabric/fonts/SegoeUI-WestEuropean/SegoeUI-Semilight.woff2) format('woff2'),url(https://appsforoffice.microsoft.com/fabric/fonts/SegoeUI-WestEuropean/SegoeUI-Semilight.woff) format('woff'),url(https://appsforoffice.microsoft.com/fabric/fonts/SegoeUI-WestEuropean/SegoeUI-Semilight.ttf) format('truetype');font-weight:200;font-style:normal}@font-face{font-family:FabricMDL2Icons;src:url(https://appsforoffice.microsoft.com/fabric/fonts/icons/FabricMDL2Icons.woff) format('woff'),url(https://appsforoffice.microsoft.com/fabric/fonts/icons/FabricMDL2Icons.ttf) format('truetype');font-weight:400;font-style:normal}.ms-Icon{-moz-osx-font-smoothing:grayscale;-webkit-font-smoothing:antialiased;display:inline-block;font-family:FabricMDL2Icons;font-style:normal;font-weight:400;speak:none}.ms-Icon--DecreaseIndentLegacy:before{content:'\E290'}.ms-Icon--IncreaseIndentLegacy:before{content:'\E291'}.ms-Icon--GlobalNavButton:before{content:'\E700'}.ms-Icon--InternetSharing:before{content:'\E704'}.ms-Icon--Brightness:before{content:'\E706'}.ms-Icon--MapPin:before{content:'\E707'}.ms-Icon--Airplane:before{content:'\E709'}.ms-Icon--Tablet:before{content:'\E70A'}.ms-Icon--QuickNote:before{content:'\E70B'}.ms-Icon--ChevronDown:before{content:'\E70D'}.ms-Icon--ChevronUp:before{content:'\E70E'}.ms-Icon--Edit:before{content:'\E70F'}.ms-Icon--Add:before{content:'\E710'}.ms-Icon--Cancel:before{content:'\E711'}.ms-Icon--More:before{content:'\E712'}.ms-Icon--Settings:before{content:'\E713'}.ms-Icon--Video:before{content:'\E714'}.ms-Icon--Mail:before{content:'\E715'}.ms-Icon--People:before{content:'\E716'}.ms-Icon--Phone:before{content:'\E717'}.ms-Icon--Pin:before{content:'\E718'}.ms-Icon--Shop:before{content:'\E719'}.ms-Icon--Link:before{content:'\E71B'}.ms-Icon--Filter:before{content:'\E71C'}.ms-Icon--Zoom:before{content:'\E71E'}.ms-Icon--ZoomOut:before{content:'\E71F'}.ms-Icon--Microphone:before{content:'\E720'}.ms-Icon--Search:before{content:'\E721'}.ms-Icon--Camera:before{content:'\E722'}.ms-Icon--Attach:before{content:'\E723'}.ms-Icon--Send:before{content:'\E724'}.ms-Icon--FavoriteList:before{content:'\E728'}.ms-Icon--PageSolid:before{content:'\E729'}.ms-Icon--Forward:before{content:'\E72A'}.ms-Icon--Back:before{content:'\E72B'}.ms-Icon--Refresh:before{content:'\E72C'}.ms-Icon--Share:before{content:'\E72D'}.ms-Icon--Lock:before{content:'\E72E'}.ms-Icon--EMI:before{content:'\E731'}.ms-Icon--MiniLink:before{content:'\E732'}.ms-Icon--Blocked:before{content:'\E733'}.ms-Icon--FavoriteStar:before{content:'\E734'}.ms-Icon--FavoriteStarFill:before{content:'\E735'}.ms-Icon--ReadingMode:before{content:'\E736'}.ms-Icon--Remove:before{content:'\E738'}.ms-Icon--Checkbox:before{content:'\E739'}.ms-Icon--CheckboxComposite:before{content:'\E73A'}.ms-Icon--CheckboxIndeterminate:before{content:'\E73C'}.ms-Icon--CheckMark:before{content:'\E73E'}.ms-Icon--BackToWindow:before{content:'\E73F'}.ms-Icon--FullScreen:before{content:'\E740'}.ms-Icon--Print:before{content:'\E749'}.ms-Icon--Up:before{content:'\E74A'}.ms-Icon--Down:before{content:'\E74B'}.ms-Icon--Delete:before{content:'\E74D'}.ms-Icon--Save:before{content:'\E74E'}.ms-Icon--Sad:before{content:'\E757'}.ms-Icon--SIPMove:before{content:'\E759'}.ms-Icon--EraseTool:before{content:'\E75C'}.ms-Icon--GripperTool:before{content:'\E75E'}.ms-Icon--Dialpad:before{content:'\E75F'}.ms-Icon--PageLeft:before{content:'\E760'}.ms-Icon--PageRight:before{content:'\E761'}.ms-Icon--MultiSelect:before{content:'\E762'}.ms-Icon--Play:before{content:'\E768'}.ms-Icon--Pause:before{content:'\E769'}.ms-Icon--ChevronLeft:before{content:'\E76B'}.ms-Icon--ChevronRight:before{content:'\E76C'}.ms-Icon--Emoji2:before{content:'\E76E'}.ms-Icon--System:before{content:'\E770'}.ms-Icon--Globe:before{content:'\E774'}.ms-Icon--ContactInfo:before{content:'\E779'}.ms-Icon--Unpin:before{content:'\E77A'}.ms-Icon--Contact:before{content:'\E77B'}.ms-Icon--Memo:before{content:'\E77C'}.ms-Icon--WindowsLogo:before{content:'\E782'}.ms-Icon--Error:before{content:'\E783'}.ms-Icon--Unlock:before{content:'\E785'}.ms-Icon--Calendar:before{content:'\E787'}.ms-Icon--Megaphone:before{content:'\E789'}.ms-Icon--AutoEnhanceOn:before{content:'\E78D'}.ms-Icon--AutoEnhanceOff:before{content:'\E78E'}.ms-Icon--Color:before{content:'\E790'}.ms-Icon--SaveAs:before{content:'\E792'}.ms-Icon--Light:before{content:'\E793'}.ms-Icon--Filters:before{content:'\E795'}.ms-Icon--Contrast:before{content:'\E7A1'}.ms-Icon--Redo:before{content:'\E7A6'}.ms-Icon--Undo:before{content:'\E7A7'}.ms-Icon--Album:before{content:'\E7AB'}.ms-Icon--Rotate:before{content:'\E7AD'}.ms-Icon--PanoIndicator:before{content:'\E7B0'}.ms-Icon--ThumbnailView:before{content:'\E7B6'}.ms-Icon--Package:before{content:'\E7B8'}.ms-Icon--Warning:before{content:'\E7BA'}.ms-Icon--Financial:before{content:'\E7BB'}.ms-Icon--ShoppingCart:before{content:'\E7BF'}.ms-Icon--Train:before{content:'\E7C0'}.ms-Icon--Flag:before{content:'\E7C1'}.ms-Icon--Move:before{content:'\E7C2'}.ms-Icon--Page:before{content:'\E7C3'}.ms-Icon--TouchPointer:before{content:'\E7C9'}.ms-Icon--Merge:before{content:'\E7D5'}.ms-Icon--TurnRight:before{content:'\E7DB'}.ms-Icon--Ferry:before{content:'\E7E3'}.ms-Icon--Tab:before{content:'\E7E9'}.ms-Icon--Admin:before{content:'\E7EF'}.ms-Icon--TVMonitor:before{content:'\E7F4'}.ms-Icon--Speakers:before{content:'\E7F5'}.ms-Icon--Car:before{content:'\E804'}.ms-Icon--EatDrink:before{content:'\E807'}.ms-Icon--LocationCircle:before{content:'\E80E'}.ms-Icon--Home:before{content:'\E80F'}.ms-Icon--SwitcherStartEnd:before{content:'\E810'}.ms-Icon--IncidentTriangle:before{content:'\E814'}.ms-Icon--Touch:before{content:'\E815'}.ms-Icon--MapDirections:before{content:'\E816'}.ms-Icon--History:before{content:'\E81C'}.ms-Icon--Location:before{content:'\E81D'}.ms-Icon--Work:before{content:'\E821'}.ms-Icon--Recent:before{content:'\E823'}.ms-Icon--Hotel:before{content:'\E824'}.ms-Icon--LocationDot:before{content:'\E827'}.ms-Icon--News:before{content:'\E900'}.ms-Icon--Chat:before{content:'\E901'}.ms-Icon--Group:before{content:'\E902'}.ms-Icon--View:before{content:'\E890'}.ms-Icon--Clear:before{content:'\E894'}.ms-Icon--Sync:before{content:'\E895'}.ms-Icon--Download:before{content:'\E896'}.ms-Icon--Help:before{content:'\E897'}.ms-Icon--Upload:before{content:'\E898'}.ms-Icon--Emoji:before{content:'\E899'}.ms-Icon--MailForward:before{content:'\E89C'}.ms-Icon--ClosePane:before{content:'\E89F'}.ms-Icon--OpenPane:before{content:'\E8A0'}.ms-Icon--PreviewLink:before{content:'\E8A1'}.ms-Icon--ZoomIn:before{content:'\E8A3'}.ms-Icon--Bookmarks:before{content:'\E8A4'}.ms-Icon--Document:before{content:'\E8A5'}.ms-Icon--ProtectedDocument:before{content:'\E8A6'}.ms-Icon--OpenInNewWindow:before{content:'\E8A7'}.ms-Icon--MailFill:before{content:'\E8A8'}.ms-Icon--ViewAll:before{content:'\E8A9'}.ms-Icon--Switch:before{content:'\E8AB'}.ms-Icon--Rename:before{content:'\E8AC'}.ms-Icon--Folder:before{content:'\E8B7'}.ms-Icon--Picture:before{content:'\E8B9'}.ms-Icon--ShowResults:before{content:'\E8BC'}.ms-Icon--Message:before{content:'\E8BD'}.ms-Icon--CalendarDay:before{content:'\E8BF'}.ms-Icon--CalendarWeek:before{content:'\E8C0'}.ms-Icon--MailReplyAll:before{content:'\E8C2'}.ms-Icon--Read:before{content:'\E8C3'}.ms-Icon--PaymentCard:before{content:'\E8C7'}.ms-Icon--Copy:before{content:'\E8C8'}.ms-Icon--Important:before{content:'\E8C9'}.ms-Icon--MailReply:before{content:'\E8CA'}.ms-Icon--Sort:before{content:'\E8CB'}.ms-Icon--GotoToday:before{content:'\E8D1'}.ms-Icon--Font:before{content:'\E8D2'}.ms-Icon--FontColor:before{content:'\E8D3'}.ms-Icon--FolderFill:before{content:'\E8D5'}.ms-Icon--Permissions:before{content:'\E8D7'}.ms-Icon--DisableUpdates:before{content:'\E8D8'}.ms-Icon--Unfavorite:before{content:'\E8D9'}.ms-Icon--Italic:before{content:'\E8DB'}.ms-Icon--Underline:before{content:'\E8DC'}.ms-Icon--Bold:before{content:'\E8DD'}.ms-Icon--MoveToFolder:before{content:'\E8DE'}.ms-Icon--Dislike:before{content:'\E8E0'}.ms-Icon--Like:before{content:'\E8E1'}.ms-Icon--AlignRight:before{content:'\E8E2'}.ms-Icon--AlignCenter:before{content:'\E8E3'}.ms-Icon--AlignLeft:before{content:'\E8E4'}.ms-Icon--OpenFile:before{content:'\E8E5'}.ms-Icon--FontDecrease:before{content:'\E8E7'}.ms-Icon--FontIncrease:before{content:'\E8E8'}.ms-Icon--FontSize:before{content:'\E8E9'}.ms-Icon--CellPhone:before{content:'\E8EA'}.ms-Icon--Tag:before{content:'\E8EC'}.ms-Icon--Library:before{content:'\E8F1'}.ms-Icon--PostUpdate:before{content:'\E8F3'}.ms-Icon--NewFolder:before{content:'\E8F4'}.ms-Icon--CalendarReply:before{content:'\E8F5'}.ms-Icon--UnsyncFolder:before{content:'\E8F6'}.ms-Icon--SyncFolder:before{content:'\E8F7'}.ms-Icon--BlockContact:before{content:'\E8F8'}.ms-Icon--AddFriend:before{content:'\E8FA'}.ms-Icon--BulletedList:before{content:'\E8FD'}.ms-Icon--Preview:before{content:'\E8FF'}.ms-Icon--DockLeft:before{content:'\E90C'}.ms-Icon--DockRight:before{content:'\E90D'}.ms-Icon--Repair:before{content:'\E90F'}.ms-Icon--Accounts:before{content:'\E910'}.ms-Icon--RadioBullet:before{content:'\E915'}.ms-Icon--Stopwatch:before{content:'\E916'}.ms-Icon--Clock:before{content:'\E917'}.ms-Icon--AlarmClock:before{content:'\E919'}.ms-Icon--Hospital:before{content:'\E91D'}.ms-Icon--Timer:before{content:'\E91E'}.ms-Icon--FullCircleMask:before{content:'\E91F'}.ms-Icon--LocationFill:before{content:'\E920'}.ms-Icon--ChromeMinimize:before{content:'\E921'}.ms-Icon--Annotation:before{content:'\E924'}.ms-Icon--ChromeClose:before{content:'\E8BB'}.ms-Icon--Accept:before{content:'\E8FB'}.ms-Icon--Fingerprint:before{content:'\E928'}.ms-Icon--Handwriting:before{content:'\E929'}.ms-Icon--StackIndicator:before{content:'\E7FF'}.ms-Icon--Completed:before{content:'\E930'}.ms-Icon--Label:before{content:'\E932'}.ms-Icon--FlickDown:before{content:'\E935'}.ms-Icon--FlickUp:before{content:'\E936'}.ms-Icon--FlickLeft:before{content:'\E937'}.ms-Icon--FlickRight:before{content:'\E938'}.ms-Icon--MusicInCollection:before{content:'\E940'}.ms-Icon--OneDrive:before{content:'\E941'}.ms-Icon--CompassNW:before{content:'\E942'}.ms-Icon--Code:before{content:'\E943'}.ms-Icon--LightningBolt:before{content:'\E945'}.ms-Icon--Info:before{content:'\E946'}.ms-Icon--CalculatorAddition:before{content:'\E948'}.ms-Icon--CalculatorSubtract:before{content:'\E949'}.ms-Icon--PrintfaxPrinterFile:before{content:'\E956'}.ms-Icon--Health:before{content:'\E95E'}.ms-Icon--ChevronUpSmall:before{content:'\E96D'}.ms-Icon--ChevronDownSmall:before{content:'\E96E'}.ms-Icon--ChevronLeftSmall:before{content:'\E96F'}.ms-Icon--ChevronRightSmall:before{content:'\E970'}.ms-Icon--ChevronUpMed:before{content:'\E971'}.ms-Icon--ChevronDownMed:before{content:'\E972'}.ms-Icon--ChevronLeftMed:before{content:'\E973'}.ms-Icon--ChevronRightMed:before{content:'\E974'}.ms-Icon--Dictionary:before{content:'\E82D'}.ms-Icon--ChromeBack:before{content:'\E830'}.ms-Icon--PC1:before{content:'\E977'}.ms-Icon--PresenceChickletVideo:before{content:'\E979'}.ms-Icon--Reply:before{content:'\E97A'}.ms-Icon--DoubleChevronLeftMed:before{content:'\E991'}.ms-Icon--Volume0:before{content:'\E992'}.ms-Icon--Volume1:before{content:'\E993'}.ms-Icon--Volume2:before{content:'\E994'}.ms-Icon--Volume3:before{content:'\E995'}.ms-Icon--CaretHollow:before{content:'\E817'}.ms-Icon--CaretSolid:before{content:'\E818'}.ms-Icon--Pinned:before{content:'\E840'}.ms-Icon--PinnedFill:before{content:'\E842'}.ms-Icon--Chart:before{content:'\E999'}.ms-Icon--BidiLtr:before{content:'\E9AA'}.ms-Icon--BidiRtl:before{content:'\E9AB'}.ms-Icon--RevToggleKey:before{content:'\E845'}.ms-Icon--RightDoubleQuote:before{content:'\E9B1'}.ms-Icon--Sunny:before{content:'\E9BD'}.ms-Icon--CloudWeather:before{content:'\E9BE'}.ms-Icon--Cloudy:before{content:'\E9BF'}.ms-Icon--PartlyCloudyDay:before{content:'\E9C0'}.ms-Icon--PartlyCloudyNight:before{content:'\E9C1'}.ms-Icon--ClearNight:before{content:'\E9C2'}.ms-Icon--RainShowersDay:before{content:'\E9C3'}.ms-Icon--Rain:before{content:'\E9C4'}.ms-Icon--Thunderstorms:before{content:'\E9C6'}.ms-Icon--RainSnow:before{content:'\E9C7'}.ms-Icon--BlowingSnow:before{content:'\E9C9'}.ms-Icon--Frigid:before{content:'\E9CA'}.ms-Icon--Fog:before{content:'\E9CB'}.ms-Icon--Squalls:before{content:'\E9CC'}.ms-Icon--Duststorm:before{content:'\E9CD'}.ms-Icon--Precipitation:before{content:'\E9CF'}.ms-Icon--Ringer:before{content:'\EA8F'}.ms-Icon--PDF:before{content:'\EA90'}.ms-Icon--SortLines:before{content:'\E9D0'}.ms-Icon--Ribbon:before{content:'\E9D1'}.ms-Icon--CheckList:before{content:'\E9D5'}.ms-Icon--Generate:before{content:'\E9DA'}.ms-Icon--Equalizer:before{content:'\E9E9'}.ms-Icon--BarChartHorizontal:before{content:'\E9EB'}.ms-Icon--Freezing:before{content:'\E9EF'}.ms-Icon--SnowShowerDay:before{content:'\E9FD'}.ms-Icon--HailDay:before{content:'\EA00'}.ms-Icon--WorkFlow:before{content:'\EA01'}.ms-Icon--StoreLogoMed:before{content:'\EA04'}.ms-Icon--RainShowersNight:before{content:'\EA0F'}.ms-Icon--SnowShowerNight:before{content:'\EA11'}.ms-Icon--HailNight:before{content:'\EA13'}.ms-Icon--Info2:before{content:'\EA1F'}.ms-Icon--StoreLogo:before{content:'\EA96'}.ms-Icon--MultiSelectMirrored:before{content:'\EA98'}.ms-Icon--Broom:before{content:'\EA99'}.ms-Icon--MusicInCollectionFill:before{content:'\EA36'}.ms-Icon--List:before{content:'\EA37'}.ms-Icon--Asterisk:before{content:'\EA38'}.ms-Icon--ErrorBadge:before{content:'\EA39'}.ms-Icon--CircleRing:before{content:'\EA3A'}.ms-Icon--CircleFill:before{content:'\EA3B'}.ms-Icon--BookmarksMirrored:before{content:'\EA41'}.ms-Icon--BulletedListMirrored:before{content:'\EA42'}.ms-Icon--CaretHollowMirrored:before{content:'\EA45'}.ms-Icon--CaretSolidMirrored:before{content:'\EA46'}.ms-Icon--ChromeBackMirrored:before{content:'\EA47'}.ms-Icon--ClosePaneMirrored:before{content:'\EA49'}.ms-Icon--DockLeftMirrored:before{content:'\EA4C'}.ms-Icon--DoubleChevronLeftMedMirrored:before{content:'\EA4D'}.ms-Icon--HelpMirrored:before{content:'\EA51'}.ms-Icon--ListMirrored:before{content:'\EA55'}.ms-Icon--MailForwardMirrored:before{content:'\EA56'}.ms-Icon--MailReplyMirrored:before{content:'\EA57'}.ms-Icon--MailReplyAllMirrored:before{content:'\EA58'}.ms-Icon--OpenPaneMirrored:before{content:'\EA5B'}.ms-Icon--SendMirrored:before{content:'\EA63'}.ms-Icon--ShowResultsMirrored:before{content:'\EA65'}.ms-Icon--ThumbnailViewMirrored:before{content:'\EA67'}.ms-Icon--Lightbulb:before{content:'\EA80'}.ms-Icon--StatusTriangle:before{content:'\EA82'}.ms-Icon--VolumeDisabled:before{content:'\EA85'}.ms-Icon--Puzzle:before{content:'\EA86'}.ms-Icon--EmojiNeutral:before{content:'\EA87'}.ms-Icon--EmojiDisappointed:before{content:'\EA88'}.ms-Icon--HomeSolid:before{content:'\EA8A'}.ms-Icon--Cocktails:before{content:'\EA9D'}.ms-Icon--Articles:before{content:'\EAC1'}.ms-Icon--Cycling:before{content:'\EAC7'}.ms-Icon--DietPlanNotebook:before{content:'\EAC8'}.ms-Icon--Pill:before{content:'\EACB'}.ms-Icon--Running:before{content:'\EADA'}.ms-Icon--Weights:before{content:'\EADB'}.ms-Icon--BarChart4:before{content:'\EAE7'}.ms-Icon--CirclePlus:before{content:'\EAEE'}.ms-Icon--Coffee:before{content:'\EAEF'}.ms-Icon--Cotton:before{content:'\EAF3'}.ms-Icon--Market:before{content:'\EAFC'}.ms-Icon--Money:before{content:'\EAFD'}.ms-Icon--PieDouble:before{content:'\EB04'}.ms-Icon--RemoveFilter:before{content:'\EB08'}.ms-Icon--StockDown:before{content:'\EB0F'}.ms-Icon--StockUp:before{content:'\EB11'}.ms-Icon--Cricket:before{content:'\EB1E'}.ms-Icon--Golf:before{content:'\EB1F'}.ms-Icon--Baseball:before{content:'\EB20'}.ms-Icon--Soccer:before{content:'\EB21'}.ms-Icon--MoreSports:before{content:'\EB22'}.ms-Icon--AutoRacing:before{content:'\EB24'}.ms-Icon--CollegeHoops:before{content:'\EB25'}.ms-Icon--CollegeFootball:before{content:'\EB26'}.ms-Icon--ProFootball:before{content:'\EB27'}.ms-Icon--ProHockey:before{content:'\EB28'}.ms-Icon--Rugby:before{content:'\EB2D'}.ms-Icon--Tennis:before{content:'\EB33'}.ms-Icon--Arrivals:before{content:'\EB34'}.ms-Icon--Design:before{content:'\EB3C'}.ms-Icon--Website:before{content:'\EB41'}.ms-Icon--Drop:before{content:'\EB42'}.ms-Icon--Snow:before{content:'\EB46'}.ms-Icon--BusSolid:before{content:'\EB47'}.ms-Icon--FerrySolid:before{content:'\EB48'}.ms-Icon--TrainSolid:before{content:'\EB4D'}.ms-Icon--Heart:before{content:'\EB51'}.ms-Icon--HeartFill:before{content:'\EB52'}.ms-Icon--Ticket:before{content:'\EB54'}.ms-Icon--AzureLogo:before{content:'\EB6A'}.ms-Icon--BingLogo:before{content:'\EB6B'}.ms-Icon--MSNLogo:before{content:'\EB6C'}.ms-Icon--OutlookLogo:before{content:'\EB6D'}.ms-Icon--OfficeLogo:before{content:'\EB6E'}.ms-Icon--SkypeLogo:before{content:'\EB6F'}.ms-Icon--Door:before{content:'\EB75'}.ms-Icon--EditMirrored:before{content:'\EB7E'}.ms-Icon--GiftCard:before{content:'\EB8E'}.ms-Icon--DoubleBookmark:before{content:'\EB8F'}.ms-Icon--StatusErrorFull:before{content:'\EB90'}.ms-Icon--Certificate:before{content:'\EB95'}.ms-Icon--Photo2:before{content:'\EB9F'}.ms-Icon--CloudDownload:before{content:'\EBD3'}.ms-Icon--WindDirection:before{content:'\EBE6'}.ms-Icon--Family:before{content:'\EBDA'}.ms-Icon--CSS:before{content:'\EBEF'}.ms-Icon--JS:before{content:'\EBF0'}.ms-Icon--ReminderGroup:before{content:'\EBF8'}.ms-Icon--Section:before{content:'\EC0C'}.ms-Icon--OneNoteLogo:before{content:'\EC0D'}.ms-Icon--ToggleFilled:before{content:'\EC11'}.ms-Icon--ToggleBorder:before{content:'\EC12'}.ms-Icon--SliderThumb:before{content:'\EC13'}.ms-Icon--ToggleThumb:before{content:'\EC14'}.ms-Icon--Documentation:before{content:'\EC17'}.ms-Icon--Badge:before{content:'\EC1B'}.ms-Icon--Giftbox:before{content:'\EC1F'}.ms-Icon--ExcelLogo:before{content:'\EC28'}.ms-Icon--WordLogo:before{content:'\EC29'}.ms-Icon--PowerPointLogo:before{content:'\EC2A'}.ms-Icon--Cafe:before{content:'\EC32'}.ms-Icon--SpeedHigh:before{content:'\EC4A'}.ms-Icon--MusicNote:before{content:'\EC4F'}.ms-Icon--EdgeLogo:before{content:'\EC60'}.ms-Icon--CompletedSolid:before{content:'\EC61'}.ms-Icon--AlbumRemove:before{content:'\EC62'}.ms-Icon--MessageFill:before{content:'\EC70'}.ms-Icon--TabletSelected:before{content:'\EC74'}.ms-Icon--MobileSelected:before{content:'\EC75'}.ms-Icon--LaptopSelected:before{content:'\EC76'}.ms-Icon--TVMonitorSelected:before{content:'\EC77'}.ms-Icon--DeveloperTools:before{content:'\EC7A'}.ms-Icon--InsertTextBox:before{content:'\EC7D'}.ms-Icon--LowerBrightness:before{content:'\EC8A'}.ms-Icon--CloudUpload:before{content:'\EC8E'}.ms-Icon--DateTime:before{content:'\EC92'}.ms-Icon--Event:before{content:'\ECA3'}.ms-Icon--Cake:before{content:'\ECA4'}.ms-Icon--Tiles:before{content:'\ECA5'}.ms-Icon--Org:before{content:'\ECA6'}.ms-Icon--PartyLeader:before{content:'\ECA7'}.ms-Icon--DRM:before{content:'\ECA8'}.ms-Icon--CloudAdd:before{content:'\ECA9'}.ms-Icon--AppIconDefault:before{content:'\ECAA'}.ms-Icon--Photo2Add:before{content:'\ECAB'}.ms-Icon--Photo2Remove:before{content:'\ECAC'}.ms-Icon--POI:before{content:'\ECAF'}.ms-Icon--FacebookLogo:before{content:'\ECB3'}.ms-Icon--AddTo:before{content:'\ECC8'}.ms-Icon--RadioBtnOn:before{content:'\ECCB'}.ms-Icon--Embed:before{content:'\ECCE'}.ms-Icon--VideoSolid:before{content:'\EA0C'}.ms-Icon--Teamwork:before{content:'\EA12'}.ms-Icon--PeopleAdd:before{content:'\EA15'}.ms-Icon--Glasses:before{content:'\EA16'}.ms-Icon--DateTime2:before{content:'\EA17'}.ms-Icon--Shield:before{content:'\EA18'}.ms-Icon--Header1:before{content:'\EA19'}.ms-Icon--PageAdd:before{content:'\EA1A'}.ms-Icon--NumberedList:before{content:'\EA1C'}.ms-Icon--PowerBILogo:before{content:'\EA1E'}.ms-Icon--Product:before{content:'\ECDC'}.ms-Icon--Blocked2:before{content:'\ECE4'}.ms-Icon--FangBody:before{content:'\ECEB'}.ms-Icon--Glimmer:before{content:'\ECF4'}.ms-Icon--ChatInviteFriend:before{content:'\ECFE'}.ms-Icon--SharepointLogo:before{content:'\ED18'}.ms-Icon--YammerLogo:before{content:'\ED19'}.ms-Icon--ReturnToSession:before{content:'\ED24'}.ms-Icon--OpenFolderHorizontal:before{content:'\ED25'}.ms-Icon--CalendarMirrored:before{content:'\ED28'}.ms-Icon--SwayLogo:before{content:'\ED29'}.ms-Icon--OutOfOffice:before{content:'\ED34'}.ms-Icon--Trophy:before{content:'\ED3F'}.ms-Icon--ReopenPages:before{content:'\ED50'}.ms-Icon--AADLogo:before{content:'\ED68'}.ms-Icon--AccessLogo:before{content:'\ED69'}.ms-Icon--AdminALogo:before{content:'\ED6A'}.ms-Icon--AdminCLogo:before{content:'\ED6B'}.ms-Icon--AdminDLogo:before{content:'\ED6C'}.ms-Icon--AdminELogo:before{content:'\ED6D'}.ms-Icon--AdminLLogo:before{content:'\ED6E'}.ms-Icon--AdminMLogo:before{content:'\ED6F'}.ms-Icon--AdminOLogo:before{content:'\ED70'}.ms-Icon--AdminPLogo:before{content:'\ED71'}.ms-Icon--AdminSLogo:before{content:'\ED72'}.ms-Icon--AdminYLogo:before{content:'\ED73'}.ms-Icon--AlchemyLogo:before{content:'\ED74'}.ms-Icon--BoxLogo:before{content:'\ED75'}.ms-Icon--DelveLogo:before{content:'\ED76'}.ms-Icon--DropboxLogo:before{content:'\ED77'}.ms-Icon--ExchangeLogo:before{content:'\ED78'}.ms-Icon--LyncLogo:before{content:'\ED79'}.ms-Icon--OfficeVideoLogo:before{content:'\ED7A'}.ms-Icon--ParatureLogo:before{content:'\ED7B'}.ms-Icon--SocialListeningLogo:before{content:'\ED7C'}.ms-Icon--VisioLogo:before{content:'\ED7D'}.ms-Icon--Balloons:before{content:'\ED7E'}.ms-Icon--Cat:before{content:'\ED7F'}.ms-Icon--MailAlert:before{content:'\ED80'}.ms-Icon--MailCheck:before{content:'\ED81'}.ms-Icon--MailLowImportance:before{content:'\ED82'}.ms-Icon--MailPause:before{content:'\ED83'}.ms-Icon--MailRepeat:before{content:'\ED84'}.ms-Icon--SecurityGroup:before{content:'\ED85'}.ms-Icon--Table:before{content:'\ED86'}.ms-Icon--VoicemailForward:before{content:'\ED87'}.ms-Icon--VoicemailReply:before{content:'\ED88'}.ms-Icon--Waffle:before{content:'\ED89'}.ms-Icon--RemoveEvent:before{content:'\ED8A'}.ms-Icon--EventInfo:before{content:'\ED8B'}.ms-Icon--ForwardEvent:before{content:'\ED8C'}.ms-Icon--WipePhone:before{content:'\ED8D'}.ms-Icon--AddOnlineMeeting:before{content:'\ED8E'}.ms-Icon--JoinOnlineMeeting:before{content:'\ED8F'}.ms-Icon--RemoveLink:before{content:'\ED90'}.ms-Icon--PeopleBlock:before{content:'\ED91'}.ms-Icon--PeopleRepeat:before{content:'\ED92'}.ms-Icon--PeopleAlert:before{content:'\ED93'}.ms-Icon--PeoplePause:before{content:'\ED94'}.ms-Icon--TransferCall:before{content:'\ED95'}.ms-Icon--AddPhone:before{content:'\ED96'}.ms-Icon--UnknownCall:before{content:'\ED97'}.ms-Icon--NoteReply:before{content:'\ED98'}.ms-Icon--NoteForward:before{content:'\ED99'}.ms-Icon--NotePinned:before{content:'\ED9A'}.ms-Icon--RemoveOccurrence:before{content:'\ED9B'}.ms-Icon--Timeline:before{content:'\ED9C'}.ms-Icon--EditNote:before{content:'\ED9D'}.ms-Icon--CircleHalfFull:before{content:'\ED9E'}.ms-Icon--Room:before{content:'\ED9F'}.ms-Icon--Unsubscribe:before{content:'\EDA0'}.ms-Icon--Subscribe:before{content:'\EDA1'}.ms-Icon--RecurringTask:before{content:'\EDB2'}.ms-Icon--TaskManager:before{content:'\EDB7'}.ms-Icon--TaskManagerMirrored:before{content:'\EDB8'}.ms-Icon--Combine:before{content:'\EDBB'}.ms-Icon--Split:before{content:'\EDBC'}.ms-Icon--DoubleChevronUp:before{content:'\EDBD'}.ms-Icon--DoubleChevronLeft:before{content:'\EDBE'}.ms-Icon--DoubleChevronRight:before{content:'\EDBF'}.ms-Icon--Ascending:before{content:'\EDC0'}.ms-Icon--Descending:before{content:'\EDC1'}.ms-Icon--TextBox:before{content:'\EDC2'}.ms-Icon--TextField:before{content:'\EDC3'}.ms-Icon--NumberField:before{content:'\EDC4'}.ms-Icon--Dropdown:before{content:'\EDC5'}.ms-Icon--BookingsLogo:before{content:'\EDC7'}.ms-Icon--ClassNotebookLogo:before{content:'\EDC8'}.ms-Icon--CollabsDBLogo:before{content:'\EDC9'}.ms-Icon--DelveAnalyticsLogo:before{content:'\EDCA'}.ms-Icon--DocsLogo:before{content:'\EDCB'}.ms-Icon--DynamicsCRMLogo:before{content:'\EDCC'}.ms-Icon--DynamicSMBLogo:before{content:'\EDCD'}.ms-Icon--OfficeAssistantLogo:before{content:'\EDCE'}.ms-Icon--OfficeStoreLogo:before{content:'\EDCF'}.ms-Icon--OneNoteEduLogo:before{content:'\EDD0'}.ms-Icon--Planner:before{content:'\EDD1'}.ms-Icon--PowerApps:before{content:'\EDD2'}.ms-Icon--Suitcase:before{content:'\EDD3'}.ms-Icon--ProjectLogo:before{content:'\EDD4'}.ms-Icon--CaretLeft8:before{content:'\EDD5'}.ms-Icon--CaretRight8:before{content:'\EDD6'}.ms-Icon--CaretUp8:before{content:'\EDD7'}.ms-Icon--CaretDown8:before{content:'\EDD8'}.ms-Icon--CaretLeftSolid8:before{content:'\EDD9'}.ms-Icon--CarotRightSolid8:before{content:'\EDDA'}.ms-Icon--CaretUpSolid8:before{content:'\EDDB'}.ms-Icon--CaretDownSolid8:before{content:'\EDDC'}.ms-Icon--ClearFormatting:before{content:'\EDDD'}.ms-Icon--Superscript:before{content:'\EDDE'}.ms-Icon--Subscript:before{content:'\EDDF'}.ms-Icon--Strikethrough:before{content:'\EDE0'}.ms-Icon--SingleBookmark:before{content:'\EDFF'}.ms-Icon--DoubleChevronDown:before{content:'\EE04'}.ms-Icon--ReplyAll:before{content:'\EE0A'}.ms-Icon--GoogleDriveLogo:before{content:'\EE0B'}.ms-Icon--Questionnaire:before{content:'\EE19'}.ms-Icon--ReplyMirrored:before{content:'\EE35'}.ms-Icon--ReplyAllMirrored:before{content:'\EE36'}.ms-Icon--AddGroup:before{content:'\EE3D'}.ms-Icon--QuestionnaireMirrored:before{content:'\EE4B'}.ms-Icon--TemporaryUser:before{content:'\EE58'}.ms-Icon--GroupedDescending:before{content:'\EE66'}.ms-Icon--GroupedAscending:before{content:'\EE67'}.ms-Icon--SortUp:before{content:'\EE68'}.ms-Icon--SortDown:before{content:'\EE69'}.ms-Icon--AwayStatus:before{content:'\EE6A'}.ms-Icon--SyncToPC:before{content:'\EE6E'}.ms-Icon--AustralianRules:before{content:'\EE70'}.ms-Icon--DateTimeMirrored:before{content:'\EE93'}.ms-Icon--DoubleChevronUp12:before{content:'\EE96'}.ms-Icon--DoubleChevronDown12:before{content:'\EE97'}.ms-Icon--DoubleChevronLeft12:before{content:'\EE98'}.ms-Icon--DoubleChevronRight12:before{content:'\EE99'}.ms-Icon--CalendarAgenda:before{content:'\EE9A'}.ms-Icon--AddEvent:before{content:'\EEB5'}.ms-Icon--AssetLibrary:before{content:'\EEB6'}.ms-Icon--DataConnectionLibrary:before{content:'\EEB7'}.ms-Icon--DocLibrary:before{content:'\EEB8'}.ms-Icon--FormLibrary:before{content:'\EEB9'}.ms-Icon--FormLibraryMirrored:before{content:'\EEBA'}.ms-Icon--ReportLibrary:before{content:'\EEBB'}.ms-Icon--ReportLibraryMirrored:before{content:'\EEBC'}.ms-Icon--ContactCard:before{content:'\EEBD'}.ms-Icon--CustomList:before{content:'\EEBE'}.ms-Icon--CustomListMirrored:before{content:'\EEBF'}.ms-Icon--IssueTracking:before{content:'\EEC0'}.ms-Icon--IssueTrackingMirrored:before{content:'\EEC1'}.ms-Icon--PictureLibrary:before{content:'\EEC2'}.ms-Icon--AppForOfficeLogo:before{content:'\EEC7'}.ms-Icon--OfflineOneDriveParachute:before{content:'\EEC8'}.ms-Icon--OfflineOneDriveParachuteDisabled:before{content:'\EEC9'}.ms-Icon--LargeGrid:before{content:'\EECB'}.ms-Icon--TriangleSolidUp12:before{content:'\EECC'}.ms-Icon--TriangleSolidDown12:before{content:'\EECD'}.ms-Icon--TriangleSolidLeft12:before{content:'\EECE'}.ms-Icon--TriangleSolidRight12:before{content:'\EECF'}.ms-Icon--TriangleUp12:before{content:'\EED0'}.ms-Icon--TriangleDown12:before{content:'\EED1'}.ms-Icon--TriangleLeft12:before{content:'\EED2'}.ms-Icon--TriangleRight12:before{content:'\EED3'}.ms-Icon--ArrowUpRight8:before{content:'\EED4'}.ms-Icon--ArrowDownRight8:before{content:'\EED5'}.ms-Icon--DocumentSet:before{content:'\EED6'}.ms-Icon--DelveAnalytics:before{content:'\EEEE'}.ms-Icon--ArrowUpRightMirrored8:before{content:'\EEEF'}.ms-Icon--ArrowDownRightMirrored8:before{content:'\EEF0'}.ms-Icon--OneDriveAdd:before{content:'\EF32'}.ms-Icon--Header2:before{content:'\EF36'}.ms-Icon--Header3:before{content:'\EF37'}.ms-Icon--Header4:before{content:'\EF38'}.ms-Icon--MarketDown:before{content:'\EF42'}.ms-Icon--CalendarWorkWeek:before{content:'\EF51'}.ms-Icon--SidePanel:before{content:'\EF52'}.ms-Icon--GlobeFavorite:before{content:'\EF53'}.ms-Icon--CaretTopLeftSolid8:before{content:'\EF54'}.ms-Icon--CaretTopRightSolid8:before{content:'\EF55'}.ms-Icon--ViewAll2:before{content:'\EF56'}.ms-Icon--DocumentReply:before{content:'\EF57'}.ms-Icon--PlayerSettings:before{content:'\EF58'}.ms-Icon--ReceiptForward:before{content:'\EF59'}.ms-Icon--ReceiptReply:before{content:'\EF5A'}.ms-Icon--ReceiptCheck:before{content:'\EF5B'}.ms-Icon--Fax:before{content:'\EF5C'}.ms-Icon--RecurringEvent:before{content:'\EF5D'}.ms-Icon--ReplyAlt:before{content:'\EF5E'}.ms-Icon--ReplyAllAlt:before{content:'\EF5F'}.ms-Icon--EditStyle:before{content:'\EF60'}.ms-Icon--EditMail:before{content:'\EF61'}.ms-Icon--Lifesaver:before{content:'\EF62'}.ms-Icon--LifesaverLock:before{content:'\EF63'}.ms-Icon--InboxCheck:before{content:'\EF64'}.ms-Icon--FolderSearch:before{content:'\EF65'}.ms-Icon--CollapseMenu:before{content:'\EF66'}.ms-Icon--ExpandMenu:before{content:'\EF67'}.ms-Icon--Boards:before{content:'\EF68'}.ms-Icon--SunAdd:before{content:'\EF69'}.ms-Icon--SunQuestionMark:before{content:'\EF6A'}.ms-Icon--LandscapeOrientation:before{content:'\EF6B'}.ms-Icon--DocumentSearch:before{content:'\EF6C'}.ms-Icon--PublicCalendar:before{content:'\EF6D'}.ms-Icon--PublicContactCard:before{content:'\EF6E'}.ms-Icon--PublicEmail:before{content:'\EF6F'}.ms-Icon--PublicFolder:before{content:'\EF70'}.ms-Icon--WordDocument:before{content:'\EF71'}.ms-Icon--PowerPointDocument:before{content:'\EF72'}.ms-Icon--ExcelDocument:before{content:'\EF73'}.ms-Icon--GroupedList:before{content:'\EF74'}.ms-Icon--ClassroomLogo:before{content:'\EF75'}.ms-Icon--Sections:before{content:'\EF76'}.ms-Icon--EditPhoto:before{content:'\EF77'}.ms-Icon--Starburst:before{content:'\EF78'}.ms-Icon--ShareiOS:before{content:'\EF79'}.ms-Icon--AirTickets:before{content:'\EF7A'}.ms-Icon--PencilReply:before{content:'\EF7B'}.ms-Icon--Tiles2:before{content:'\EF7C'}.ms-Icon--SkypeCircleCheck:before{content:'\EF7D'}.ms-Icon--SkypeCircleClock:before{content:'\EF7E'}.ms-Icon--SkypeCircleMinus:before{content:'\EF7F'}.ms-Icon--SkypeCheck:before{content:'\EF80'}.ms-Icon--SkypeClock:before{content:'\EF81'}.ms-Icon--SkypeMinus:before{content:'\EF82'}.ms-Icon--SkypeMessage:before{content:'\EF83'}.ms-Icon--ClosedCaption:before{content:'\EF84'}.ms-Icon--ATPLogo:before{content:'\EF85'}.ms-Icon--OfficeFormLogo:before{content:'\EF86'}.ms-Icon--RecycleBin:before{content:'\EF87'}.ms-Icon--EmptyRecycleBin:before{content:'\EF88'}.ms-Icon--Hide2:before{content:'\EF89'}.ms-Icon--iOSAppStoreLogo:before{content:'\EF8A'}.ms-Icon--AndroidLogo:before{content:'\EF8B'}.ms-Icon--Breadcrumb:before{content:'\EF8C'}.ms-Icon--ClearFilter:before{content:'\EF8F'}.ms-Icon--Flow:before{content:'\EF90'}.ms-Icon--PowerAppsLogo:before{content:'\F091'}.ms-Icon--PowerApps2Logo:before{content:'\F092'}.ms-Icon--circle{position:relative;display:inline-block;font-size:1rem;width:1em;height:1em;margin:0 .5em 0 0;padding:0;text-align:left;-webkit-font-smoothing:antialiased}.ms-Icon--circle:after,.ms-Icon--circle:before{line-height:1;font-size:inherit}.ms-Icon--circle:before{display:block;width:100%;height:100%;margin:0;padding:0;vertical-align:top;position:absolute}.ms-Icon--circle:after{content:'\e000';position:absolute;top:0;left:0;transform:scale(2);transform-origin:50% 50%;z-index:0}.ms-Icon--xs{font-size:10px}.ms-Icon--s{font-size:12px}.ms-Icon--m{font-size:16px}.ms-Icon--l{font-size:20px}.ms-u-slideRightIn10{animation-name:fadeIn,slideRightIn10;-webkit-animation-duration:.367s;-moz-animation-duration:.367s;-ms-animation-duration:.367s;-o-animation-duration:.367s;animation-timing-function:cubic-bezier(.1,.9,.2,1);animation-fill-mode:both}@keyframes slideRightIn10{0%{transform:translate3d(-10px,0,0)}to{transform:translateZ(0)}}.ms-u-slideRightIn20{animation-name:fadeIn,slideRightIn20;-webkit-animation-duration:.367s;-moz-animation-duration:.367s;-ms-animation-duration:.367s;-o-animation-duration:.367s;animation-timing-function:cubic-bezier(.1,.9,.2,1);animation-fill-mode:both}@keyframes slideRightIn20{0%{transform:translate3d(-20px,0,0)}to{transform:translateZ(0)}}.ms-u-slideRightIn40{animation-name:fadeIn,slideRightIn40;-webkit-animation-duration:.367s;-moz-animation-duration:.367s;-ms-animation-duration:.367s;-o-animation-duration:.367s;animation-timing-function:cubic-bezier(.1,.9,.2,1);animation-fill-mode:both}@keyframes slideRightIn40{0%{transform:translate3d(-40px,0,0)}to{transform:translateZ(0)}}.ms-u-slideLeftIn10{animation-name:fadeIn,slideLeftIn10;-webkit-animation-duration:.367s;-moz-animation-duration:.367s;-ms-animation-duration:.367s;-o-animation-duration:.367s;animation-timing-function:cubic-bezier(.1,.9,.2,1);animation-fill-mode:both}@keyframes slideLeftIn10{0%{transform:translate3d(10px,0,0)}to{transform:translateZ(0)}}.ms-u-slideLeftIn20{animation-name:fadeIn,slideLeftIn20;-webkit-animation-duration:.367s;-moz-animation-duration:.367s;-ms-animation-duration:.367s;-o-animation-duration:.367s;animation-timing-function:cubic-bezier(.1,.9,.2,1);animation-fill-mode:both}@keyframes slideLeftIn20{0%{transform:translate3d(20px,0,0)}to{transform:translateZ(0)}}.ms-u-slideLeftIn40{animation-name:fadeIn,slideLeftIn40;-webkit-animation-duration:.367s;-moz-animation-duration:.367s;-ms-animation-duration:.367s;-o-animation-duration:.367s;animation-timing-function:cubic-bezier(.1,.9,.2,1);animation-fill-mode:both}@keyframes slideLeftIn40{0%{transform:translate3d(40px,0,0)}to{transform:translateZ(0)}}.ms-u-slideRightIn400{animation-name:fadeIn,slideRightIn400;-webkit-animation-duration:.367s;-moz-animation-duration:.367s;-ms-animation-duration:.367s;-o-animation-duration:.367s;animation-timing-function:cubic-bezier(.1,.9,.2,1);animation-fill-mode:both}@keyframes slideRightIn400{0%{transform:translate3d(-400px,0,0)}to{transform:translateZ(0)}}.ms-u-slideLeftIn400{animation-name:fadeIn,slideLeft400;-webkit-animation-duration:.367s;-moz-animation-duration:.367s;-ms-animation-duration:.367s;-o-animation-duration:.367s;animation-timing-function:cubic-bezier(.1,.9,.2,1);animation-fill-mode:both}@keyframes slideLeft400{0%{transform:translate3d(400px,0,0)}to{transform:translateZ(0)}}.ms-u-slideUpIn20{animation-name:fadeIn,slideUpIn20;-webkit-animation-duration:.367s;-moz-animation-duration:.367s;-ms-animation-duration:.367s;-o-animation-duration:.367s;animation-timing-function:cubic-bezier(.1,.9,.2,1);animation-fill-mode:both}@keyframes slideUpIn20{0%{transform:translate3d(0,20px,0)}to{transform:translateZ(0)}}.ms-u-slideUpIn10{animation-name:fadeIn,slideUpIn10;-webkit-animation-duration:.167s;-moz-animation-duration:.167s;-ms-animation-duration:.167s;-o-animation-duration:.167s;animation-timing-function:cubic-bezier(.1,.25,.75,.9);animation-fill-mode:both}@keyframes slideUpIn10{0%{transform:translate3d(0,10px,0)}to{transform:translateZ(0)}}.ms-u-slideDownIn20{animation-name:fadeIn,slideDownIn20;-webkit-animation-duration:.367s;-moz-animation-duration:.367s;-ms-animation-duration:.367s;-o-animation-duration:.367s;animation-timing-function:cubic-bezier(.1,.9,.2,1);animation-fill-mode:both}@keyframes slideDownIn20{0%{transform:translate3d(0,-20px,0)}to{transform:translateZ(0)}}.ms-u-slideDownIn10{animation-name:fadeIn,slideDownIn10;-webkit-animation-duration:.167s;-moz-animation-duration:.167s;-ms-animation-duration:.167s;-o-animation-duration:.167s;animation-timing-function:cubic-bezier(.1,.25,.75,.9);animation-fill-mode:both}@keyframes slideDownIn10{0%{transform:translate3d(0,-10px,0)}to{transform:translateZ(0)}}.ms-u-slideRightOut40{animation-name:fadeOut,slideRightOut40;-webkit-animation-duration:.167s;-moz-animation-duration:.167s;-ms-animation-duration:.167s;-o-animation-duration:.167s;animation-timing-function:cubic-bezier(.1,.25,.75,.9);animation-fill-mode:both}@keyframes slideRightOut40{0%{transform:translateZ(0)}to{transform:translate3d(40px,0,0)}}.ms-u-slideLeftOut40{animation-name:fadeOut,slideLeftOut40;-webkit-animation-duration:.167s;-moz-animation-duration:.167s;-ms-animation-duration:.167s;-o-animation-duration:.167s;animation-timing-function:cubic-bezier(.1,.25,.75,.9);animation-fill-mode:both}@keyframes slideLeftOut40{0%{transform:translateZ(0)}to{transform:translate3d(-40px,0,0)}}.ms-u-slideRightOut400{animation-name:fadeOut,slideRightOut400;-webkit-animation-duration:.167s;-moz-animation-duration:.167s;-ms-animation-duration:.167s;-o-animation-duration:.167s;animation-timing-function:cubic-bezier(.1,.25,.75,.9);animation-fill-mode:both}@keyframes slideRightOut400{0%{transform:translateZ(0)}to{transform:translate3d(400px,0,0)}}.ms-u-slideLeftOut400{animation-name:fadeOut,slideLeftOut400;-webkit-animation-duration:.167s;-moz-animation-duration:.167s;-ms-animation-duration:.167s;-o-animation-duration:.167s;animation-timing-function:cubic-bezier(.1,.25,.75,.9);animation-fill-mode:both}@keyframes slideLeftOut400{0%{transform:translateZ(0)}to{transform:translate3d(-400px,0,0)}}.ms-u-slideUpOut20{animation-name:fadeOut,slideUpOut20;-webkit-animation-duration:.167s;-moz-animation-duration:.167s;-ms-animation-duration:.167s;-o-animation-duration:.167s;animation-timing-function:cubic-bezier(.1,.25,.75,.9);animation-fill-mode:both}@keyframes slideUpOut20{0%{transform:translateZ(0)}to{transform:translate3d(0,-20px,0)}}.ms-u-slideUpOut10{animation-name:fadeOut,slideUpOut10;-webkit-animation-duration:.167s;-moz-animation-duration:.167s;-ms-animation-duration:.167s;-o-animation-duration:.167s;animation-timing-function:cubic-bezier(.1,.25,.75,.9);animation-fill-mode:both}@keyframes slideUpOut10{0%{transform:translateZ(0)}to{transform:translate3d(0,-10px,0)}}.ms-u-slideDownOut20{animation-name:fadeOut,slideDownOut20;-webkit-animation-duration:.167s;-moz-animation-duration:.167s;-ms-animation-duration:.167s;-o-animation-duration:.167s;animation-timing-function:cubic-bezier(.1,.25,.75,.9);animation-fill-mode:both}@keyframes slideDownOut20{0%{transform:translateZ(0)}to{transform:translate3d(0,20px,0)}}.ms-u-slideDownOut10{animation-name:fadeOut,slideDownOut10;-webkit-animation-duration:.167s;-moz-animation-duration:.167s;-ms-animation-duration:.167s;-o-animation-duration:.167s;animation-timing-function:cubic-bezier(.1,.25,.75,.9);animation-fill-mode:both}@keyframes slideDownOut10{0%{transform:translateZ(0)}to{transform:translate3d(0,10px,0)}}.ms-u-scaleUpIn100{animation-name:fadeIn,scaleUp100;-webkit-animation-duration:.367s;-moz-animation-duration:.367s;-ms-animation-duration:.367s;-o-animation-duration:.367s;animation-timing-function:cubic-bezier(.1,.9,.2,1);animation-fill-mode:both}@keyframes scaleUp100{0%{transform:scale3d(.98,.98,1)}to{transform:scaleX(1)}}.ms-u-scaleDownIn100{animation-name:fadeIn,scaleDown100;-webkit-animation-duration:.367s;-moz-animation-duration:.367s;-ms-animation-duration:.367s;-o-animation-duration:.367s;animation-timing-function:cubic-bezier(.1,.9,.2,1);animation-fill-mode:both}@keyframes scaleDown100{0%{transform:scale3d(1.03,1.03,1)}to{transform:scaleX(1)}}.ms-u-scaleUpOut103{animation-name:fadeOut,scaleUp103;-webkit-animation-duration:.167s;-moz-animation-duration:.167s;-ms-animation-duration:.167s;-o-animation-duration:.167s;animation-timing-function:cubic-bezier(.1,.25,.75,.9);animation-fill-mode:both}@keyframes scaleUp103{0%{transform:scaleX(1)}to{transform:scale3d(1.03,1.03,1)}}.ms-u-scaleDownOut98{animation-name:fadeOut,scaleDown98;-webkit-animation-duration:.167s;-moz-animation-duration:.167s;-ms-animation-duration:.167s;-o-animation-duration:.167s;animation-timing-function:cubic-bezier(.1,.25,.75,.9);animation-fill-mode:both}@keyframes scaleDown98{0%{transform:scaleX(1)}to{transform:scale3d(.98,.98,1)}}.ms-u-fadeIn100,.ms-u-fadeIn400{-webkit-animation-duration:.367s;-webkit-animation-name:fadeIn;-webkit-animation-fill-mode:both;animation-duration:.367s;animation-name:fadeIn;animation-fill-mode:both}.ms-u-fadeIn100{animation-duration:.167s}.ms-u-fadeIn200{-webkit-animation-duration:.367s;-webkit-animation-name:fadeIn;-webkit-animation-fill-mode:both;animation-duration:.367s;animation-name:fadeIn;animation-fill-mode:both;animation-duration:.267s}.ms-u-fadeIn500{-webkit-animation-duration:.367s;-webkit-animation-name:fadeIn;-webkit-animation-fill-mode:both;animation-duration:.367s;animation-name:fadeIn;animation-fill-mode:both;animation-duration:.467s}@keyframes fadeIn{0%{opacity:0;animation-timing-function:cubic-bezier(.1,.25,.75,.9)}to{opacity:1}}.ms-u-fadeOut100,.ms-u-fadeOut400{-webkit-animation-duration:.367s;-webkit-animation-name:fadeOut;-webkit-animation-fill-mode:both;animation-duration:.367s;animation-name:fadeOut;animation-fill-mode:both}.ms-u-fadeOut100{animation-duration:.1s}.ms-u-fadeOut200{-webkit-animation-duration:.367s;-webkit-animation-name:fadeOut;-webkit-animation-fill-mode:both;animation-duration:.367s;animation-name:fadeOut;animation-fill-mode:both;animation-duration:.167s}.ms-u-fadeOut500{-webkit-animation-duration:.367s;-webkit-animation-name:fadeOut;-webkit-animation-fill-mode:both;animation-duration:.367s;animation-name:fadeOut;animation-fill-mode:both;animation-duration:.467s}@keyframes fadeOut{0%{opacity:1;animation-timing-function:cubic-bezier(.1,.25,.75,.9)}to{opacity:0}}.ms-u-rotate90deg{animation-name:rotate90;-webkit-animation-duration:.1s;-moz-animation-duration:.1s;-ms-animation-duration:.1s;-o-animation-duration:.1s;animation-timing-function:cubic-bezier(.1,.25,.75,.9);animation-fill-mode:both}@keyframes rotate90{0%{transform:rotate(0deg)}to{transform:rotate(90deg)}}.ms-u-rotateN90deg{animation-name:rotateN90;-webkit-animation-duration:.1s;-moz-animation-duration:.1s;-ms-animation-duration:.1s;-o-animation-duration:.1s;animation-timing-function:cubic-bezier(.1,.25,.75,.9);animation-fill-mode:both}@keyframes rotateN90{0%{transform:rotate(90deg)}to{transform:rotate(0deg)}}.ms-u-expandCollapse400{transition:height .367s cubic-bezier(.1,.25,.75,.9)}.ms-u-expandCollapse200{transition:height .167s cubic-bezier(.1,.25,.75,.9)}.ms-u-expandCollapse100{transition:height .1s cubic-bezier(.1,.25,.75,.9)}.ms-u-delay100{animation-delay:.167s}.ms-u-delay200{animation-delay:.267s}@media (max-width:479px){.ms-u-hiddenLgDown,.ms-u-hiddenMdDown,.ms-u-hiddenSm,.ms-u-hiddenXlDown,.ms-u-hiddenXxlDown{display:none!important}}@media (min-width:480px) and (max-width:639px){.ms-u-hiddenLgDown,.ms-u-hiddenMd,.ms-u-hiddenMdDown,.ms-u-hiddenMdUp,.ms-u-hiddenXlDown,.ms-u-hiddenXxlDown{display:none!important}}@media (min-width:640px) and (max-width:1023px){.ms-u-hiddenLg,.ms-u-hiddenLgDown,.ms-u-hiddenLgUp,.ms-u-hiddenMdUp,.ms-u-hiddenXlDown,.ms-u-hiddenXxlDown{display:none!important}}@media (min-width:1024px) and (max-width:1365px){.ms-u-hiddenLgUp,.ms-u-hiddenMdUp,.ms-u-hiddenXl,.ms-u-hiddenXlDown,.ms-u-hiddenXlUp,.ms-u-hiddenXxlDown{display:none!important}}@media (min-width:1366px) and (max-width:1919px){.ms-u-hiddenLgUp,.ms-u-hiddenMdUp,.ms-u-hiddenXlUp,.ms-u-hiddenXxl,.ms-u-hiddenXxlDown,.ms-u-hiddenXxlUp{display:none!important}}@media (min-width:1920px){.ms-u-hiddenLgUp,.ms-u-hiddenMdUp,.ms-u-hiddenXlUp,.ms-u-hiddenXxlUp,.ms-u-hiddenXxxl{display:none!important}}.ms-u-sm12{width:100%}.ms-u-sm11{width:91.66666666666666%}.ms-u-sm10{width:83.33333333333334%}.ms-u-sm9{width:75%}.ms-u-sm8{width:66.66666666666666%}.ms-u-sm7{width:58.333333333333336%}.ms-u-sm6{width:50%}.ms-u-sm5{width:41.66666666666667%}.ms-u-sm4{width:33.33333333333333%}.ms-u-sm3{width:25%}.ms-u-sm2{width:16.666666666666664%}.ms-u-sm1{width:8.333333333333332%}.ms-u-smPull12{right:100%}.ms-u-smPull11{right:91.66666666666666%}.ms-u-smPull10{right:83.33333333333334%}.ms-u-smPull9{right:75%}.ms-u-smPull8{right:66.66666666666666%}.ms-u-smPull7{right:58.333333333333336%}.ms-u-smPull6{right:50%}.ms-u-smPull5{right:41.66666666666667%}.ms-u-smPull4{right:33.33333333333333%}.ms-u-smPull3{right:25%}.ms-u-smPull2{right:16.666666666666664%}.ms-u-smPull1{right:8.333333333333332%}.ms-u-smPull0{right:auto}.ms-u-smPush12{left:100%}.ms-u-smPush11{left:91.66666666666666%}.ms-u-smPush10{left:83.33333333333334%}.ms-u-smPush9{left:75%}.ms-u-smPush8{left:66.66666666666666%}.ms-u-smPush7{left:58.333333333333336%}.ms-u-smPush6{left:50%}.ms-u-smPush5{left:41.66666666666667%}.ms-u-smPush4{left:33.33333333333333%}.ms-u-smPush3{left:25%}.ms-u-smPush2{left:16.666666666666664%}.ms-u-smPush1{left:8.333333333333332%}.ms-u-smPush0{left:auto}.ms-u-smOffset11{margin-left:91.66666666666666%}.ms-u-smOffset10{margin-left:83.33333333333334%}.ms-u-smOffset9{margin-left:75%}.ms-u-smOffset8{margin-left:66.66666666666666%}.ms-u-smOffset7{margin-left:58.333333333333336%}.ms-u-smOffset6{margin-left:50%}.ms-u-smOffset5{margin-left:41.66666666666667%}.ms-u-smOffset4{margin-left:33.33333333333333%}.ms-u-smOffset3{margin-left:25%}.ms-u-smOffset2{margin-left:16.666666666666664%}.ms-u-smOffset1{margin-left:8.333333333333332%}.ms-u-smOffset0{margin-left:0}@media (min-width:480px){.ms-u-md12{width:100%}.ms-u-md11{width:91.66666666666666%}.ms-u-md10{width:83.33333333333334%}.ms-u-md9{width:75%}.ms-u-md8{width:66.66666666666666%}.ms-u-md7{width:58.333333333333336%}.ms-u-md6{width:50%}.ms-u-md5{width:41.66666666666667%}.ms-u-md4{width:33.33333333333333%}.ms-u-md3{width:25%}.ms-u-md2{width:16.666666666666664%}.ms-u-md1{width:8.333333333333332%}.ms-u-mdPull12{right:100%}.ms-u-mdPull11{right:91.66666666666666%}.ms-u-mdPull10{right:83.33333333333334%}.ms-u-mdPull9{right:75%}.ms-u-mdPull8{right:66.66666666666666%}.ms-u-mdPull7{right:58.333333333333336%}.ms-u-mdPull6{right:50%}.ms-u-mdPull5{right:41.66666666666667%}.ms-u-mdPull4{right:33.33333333333333%}.ms-u-mdPull3{right:25%}.ms-u-mdPull2{right:16.666666666666664%}.ms-u-mdPull1{right:8.333333333333332%}.ms-u-mdPull0{right:auto}.ms-u-mdPush12{left:100%}.ms-u-mdPush11{left:91.66666666666666%}.ms-u-mdPush10{left:83.33333333333334%}.ms-u-mdPush9{left:75%}.ms-u-mdPush8{left:66.66666666666666%}.ms-u-mdPush7{left:58.333333333333336%}.ms-u-mdPush6{left:50%}.ms-u-mdPush5{left:41.66666666666667%}.ms-u-mdPush4{left:33.33333333333333%}.ms-u-mdPush3{left:25%}.ms-u-mdPush2{left:16.666666666666664%}.ms-u-mdPush1{left:8.333333333333332%}.ms-u-mdPush0{left:auto}.ms-u-mdOffset11{margin-left:91.66666666666666%}.ms-u-mdOffset10{margin-left:83.33333333333334%}.ms-u-mdOffset9{margin-left:75%}.ms-u-mdOffset8{margin-left:66.66666666666666%}.ms-u-mdOffset7{margin-left:58.333333333333336%}.ms-u-mdOffset6{margin-left:50%}.ms-u-mdOffset5{margin-left:41.66666666666667%}.ms-u-mdOffset4{margin-left:33.33333333333333%}.ms-u-mdOffset3{margin-left:25%}.ms-u-mdOffset2{margin-left:16.666666666666664%}.ms-u-mdOffset1{margin-left:8.333333333333332%}.ms-u-mdOffset0{margin-left:0}}@media (min-width:640px){.ms-u-lg12{width:100%}.ms-u-lg11{width:91.66666666666666%}.ms-u-lg10{width:83.33333333333334%}.ms-u-lg9{width:75%}.ms-u-lg8{width:66.66666666666666%}.ms-u-lg7{width:58.333333333333336%}.ms-u-lg6{width:50%}.ms-u-lg5{width:41.66666666666667%}.ms-u-lg4{width:33.33333333333333%}.ms-u-lg3{width:25%}.ms-u-lg2{width:16.666666666666664%}.ms-u-lg1{width:8.333333333333332%}.ms-u-lgPull12{right:100%}.ms-u-lgPull11{right:91.66666666666666%}.ms-u-lgPull10{right:83.33333333333334%}.ms-u-lgPull9{right:75%}.ms-u-lgPull8{right:66.66666666666666%}.ms-u-lgPull7{right:58.333333333333336%}.ms-u-lgPull6{right:50%}.ms-u-lgPull5{right:41.66666666666667%}.ms-u-lgPull4{right:33.33333333333333%}.ms-u-lgPull3{right:25%}.ms-u-lgPull2{right:16.666666666666664%}.ms-u-lgPull1{right:8.333333333333332%}.ms-u-lgPull0{right:auto}.ms-u-lgPush12{left:100%}.ms-u-lgPush11{left:91.66666666666666%}.ms-u-lgPush10{left:83.33333333333334%}.ms-u-lgPush9{left:75%}.ms-u-lgPush8{left:66.66666666666666%}.ms-u-lgPush7{left:58.333333333333336%}.ms-u-lgPush6{left:50%}.ms-u-lgPush5{left:41.66666666666667%}.ms-u-lgPush4{left:33.33333333333333%}.ms-u-lgPush3{left:25%}.ms-u-lgPush2{left:16.666666666666664%}.ms-u-lgPush1{left:8.333333333333332%}.ms-u-lgPush0{left:auto}.ms-u-lgOffset11{margin-left:91.66666666666666%}.ms-u-lgOffset10{margin-left:83.33333333333334%}.ms-u-lgOffset9{margin-left:75%}.ms-u-lgOffset8{margin-left:66.66666666666666%}.ms-u-lgOffset7{margin-left:58.333333333333336%}.ms-u-lgOffset6{margin-left:50%}.ms-u-lgOffset5{margin-left:41.66666666666667%}.ms-u-lgOffset4{margin-left:33.33333333333333%}.ms-u-lgOffset3{margin-left:25%}.ms-u-lgOffset2{margin-left:16.666666666666664%}.ms-u-lgOffset1{margin-left:8.333333333333332%}.ms-u-lgOffset0{margin-left:0}}@media (min-width:1024px){.ms-u-xl12{width:100%}.ms-u-xl11{width:91.66666666666666%}.ms-u-xl10{width:83.33333333333334%}.ms-u-xl9{width:75%}.ms-u-xl8{width:66.66666666666666%}.ms-u-xl7{width:58.333333333333336%}.ms-u-xl6{width:50%}.ms-u-xl5{width:41.66666666666667%}.ms-u-xl4{width:33.33333333333333%}.ms-u-xl3{width:25%}.ms-u-xl2{width:16.666666666666664%}.ms-u-xl1{width:8.333333333333332%}.ms-u-xlPull12{right:100%}.ms-u-xlPull11{right:91.66666666666666%}.ms-u-xlPull10{right:83.33333333333334%}.ms-u-xlPull9{right:75%}.ms-u-xlPull8{right:66.66666666666666%}.ms-u-xlPull7{right:58.333333333333336%}.ms-u-xlPull6{right:50%}.ms-u-xlPull5{right:41.66666666666667%}.ms-u-xlPull4{right:33.33333333333333%}.ms-u-xlPull3{right:25%}.ms-u-xlPull2{right:16.666666666666664%}.ms-u-xlPull1{right:8.333333333333332%}.ms-u-xlPull0{right:auto}.ms-u-xlPush12{left:100%}.ms-u-xlPush11{left:91.66666666666666%}.ms-u-xlPush10{left:83.33333333333334%}.ms-u-xlPush9{left:75%}.ms-u-xlPush8{left:66.66666666666666%}.ms-u-xlPush7{left:58.333333333333336%}.ms-u-xlPush6{left:50%}.ms-u-xlPush5{left:41.66666666666667%}.ms-u-xlPush4{left:33.33333333333333%}.ms-u-xlPush3{left:25%}.ms-u-xlPush2{left:16.666666666666664%}.ms-u-xlPush1{left:8.333333333333332%}.ms-u-xlPush0{left:auto}.ms-u-xlOffset11{margin-left:91.66666666666666%}.ms-u-xlOffset10{margin-left:83.33333333333334%}.ms-u-xlOffset9{margin-left:75%}.ms-u-xlOffset8{margin-left:66.66666666666666%}.ms-u-xlOffset7{margin-left:58.333333333333336%}.ms-u-xlOffset6{margin-left:50%}.ms-u-xlOffset5{margin-left:41.66666666666667%}.ms-u-xlOffset4{margin-left:33.33333333333333%}.ms-u-xlOffset3{margin-left:25%}.ms-u-xlOffset2{margin-left:16.666666666666664%}.ms-u-xlOffset1{margin-left:8.333333333333332%}.ms-u-xlOffset0{margin-left:0}}@media (min-width:1366px){.ms-u-xxl12{width:100%}.ms-u-xxl11{width:91.66666666666666%}.ms-u-xxl10{width:83.33333333333334%}.ms-u-xxl9{width:75%}.ms-u-xxl8{width:66.66666666666666%}.ms-u-xxl7{width:58.333333333333336%}.ms-u-xxl6{width:50%}.ms-u-xxl5{width:41.66666666666667%}.ms-u-xxl4{width:33.33333333333333%}.ms-u-xxl3{width:25%}.ms-u-xxl2{width:16.666666666666664%}.ms-u-xxl1{width:8.333333333333332%}.ms-u-xxlPull12{right:100%}.ms-u-xxlPull11{right:91.66666666666666%}.ms-u-xxlPull10{right:83.33333333333334%}.ms-u-xxlPull9{right:75%}.ms-u-xxlPull8{right:66.66666666666666%}.ms-u-xxlPull7{right:58.333333333333336%}.ms-u-xxlPull6{right:50%}.ms-u-xxlPull5{right:41.66666666666667%}.ms-u-xxlPull4{right:33.33333333333333%}.ms-u-xxlPull3{right:25%}.ms-u-xxlPull2{right:16.666666666666664%}.ms-u-xxlPull1{right:8.333333333333332%}.ms-u-xxlPull0{right:auto}.ms-u-xxlPush12{left:100%}.ms-u-xxlPush11{left:91.66666666666666%}.ms-u-xxlPush10{left:83.33333333333334%}.ms-u-xxlPush9{left:75%}.ms-u-xxlPush8{left:66.66666666666666%}.ms-u-xxlPush7{left:58.333333333333336%}.ms-u-xxlPush6{left:50%}.ms-u-xxlPush5{left:41.66666666666667%}.ms-u-xxlPush4{left:33.33333333333333%}.ms-u-xxlPush3{left:25%}.ms-u-xxlPush2{left:16.666666666666664%}.ms-u-xxlPush1{left:8.333333333333332%}.ms-u-xxlPush0{left:auto}.ms-u-xxlOffset11{margin-left:91.66666666666666%}.ms-u-xxlOffset10{margin-left:83.33333333333334%}.ms-u-xxlOffset9{margin-left:75%}.ms-u-xxlOffset8{margin-left:66.66666666666666%}.ms-u-xxlOffset7{margin-left:58.333333333333336%}.ms-u-xxlOffset6{margin-left:50%}.ms-u-xxlOffset5{margin-left:41.66666666666667%}.ms-u-xxlOffset4{margin-left:33.33333333333333%}.ms-u-xxlOffset3{margin-left:25%}.ms-u-xxlOffset2{margin-left:16.666666666666664%}.ms-u-xxlOffset1{margin-left:8.333333333333332%}.ms-u-xxlOffset0{margin-left:0}}@media (min-width:1920px){.ms-u-xxxl12{width:100%}.ms-u-xxxl11{width:91.66666666666666%}.ms-u-xxxl10{width:83.33333333333334%}.ms-u-xxxl9{width:75%}.ms-u-xxxl8{width:66.66666666666666%}.ms-u-xxxl7{width:58.333333333333336%}.ms-u-xxxl6{width:50%}.ms-u-xxxl5{width:41.66666666666667%}.ms-u-xxxl4{width:33.33333333333333%}.ms-u-xxxl3{width:25%}.ms-u-xxxl2{width:16.666666666666664%}.ms-u-xxxl1{width:8.333333333333332%}.ms-u-xxxlPull12{right:100%}.ms-u-xxxlPull11{right:91.66666666666666%}.ms-u-xxxlPull10{right:83.33333333333334%}.ms-u-xxxlPull9{right:75%}.ms-u-xxxlPull8{right:66.66666666666666%}.ms-u-xxxlPull7{right:58.333333333333336%}.ms-u-xxxlPull6{right:50%}.ms-u-xxxlPull5{right:41.66666666666667%}.ms-u-xxxlPull4{right:33.33333333333333%}.ms-u-xxxlPull3{right:25%}.ms-u-xxxlPull2{right:16.666666666666664%}.ms-u-xxxlPull1{right:8.333333333333332%}.ms-u-xxxlPull0{right:auto}.ms-u-xxxlPush12{left:100%}.ms-u-xxxlPush11{left:91.66666666666666%}.ms-u-xxxlPush10{left:83.33333333333334%}.ms-u-xxxlPush9{left:75%}.ms-u-xxxlPush8{left:66.66666666666666%}.ms-u-xxxlPush7{left:58.333333333333336%}.ms-u-xxxlPush6{left:50%}.ms-u-xxxlPush5{left:41.66666666666667%}.ms-u-xxxlPush4{left:33.33333333333333%}.ms-u-xxxlPush3{left:25%}.ms-u-xxxlPush2{left:16.666666666666664%}.ms-u-xxxlPush1{left:8.333333333333332%}.ms-u-xxxlPush0{left:auto}.ms-u-xxxlOffset11{margin-left:91.66666666666666%}.ms-u-xxxlOffset10{margin-left:83.33333333333334%}.ms-u-xxxlOffset9{margin-left:75%}.ms-u-xxxlOffset8{margin-left:66.66666666666666%}.ms-u-xxxlOffset7{margin-left:58.333333333333336%}.ms-u-xxxlOffset6{margin-left:50%}.ms-u-xxxlOffset5{margin-left:41.66666666666667%}.ms-u-xxxlOffset4{margin-left:33.33333333333333%}.ms-u-xxxlOffset3{margin-left:25%}.ms-u-xxxlOffset2{margin-left:16.666666666666664%}.ms-u-xxxlOffset1{margin-left:8.333333333333332%}.ms-u-xxxlOffset0{margin-left:0}}.ms-Grid{box-sizing:border-box;*zoom:1;padding:0 8px}.ms-Grid:after,.ms-Grid:before{display:table;content:'';line-height:0}.ms-Grid:after{clear:both}.ms-Grid-row{margin:0 -8px;box-sizing:border-box;*zoom:1}.ms-Grid-row:after,.ms-Grid-row:before{display:table;content:'';line-height:0}.ms-Grid-row:after{clear:both}.ms-Grid-col{position:relative;min-height:1px;padding-left:8px;padding-right:8px;box-sizing:border-box;float:left}.ms-Grid-col .ms-Grid{padding:0}.ms-Fabric{color:#333} \ No newline at end of file diff --git a/dist/css/fabric.rtl.css b/dist/css/fabric.rtl.css new file mode 100644 index 000000000..9ecf222f0 --- /dev/null +++ b/dist/css/fabric.rtl.css @@ -0,0 +1,6303 @@ +/* Copyright (c) Microsoft. All rights reserved. Licensed under the MIT license. See LICENSE in the project root for license information. */ +/** + * Office UI Fabric 4.0.0 + * The front-end framework for building experiences for Office 365. + **/ + +.ms-u-borderBox, +.ms-u-borderBox::before, +.ms-u-borderBox::after { + box-sizing: border-box; +} + +.ms-u-borderBase { + border: 1px solid; +} + +.ms-u-clearfix { + *zoom: 1; +} + +.ms-u-clearfix::before, +.ms-u-clearfix::after { + display: table; + content: ''; + line-height: 0; +} + +.ms-u-clearfix::after { + clear: both; +} + +.ms-u-normalize { + box-sizing: border-box; + margin: 0; + padding: 0; + box-shadow: none; +} + +.ms-u-textAlignLeft { + text-align: right; +} + +.ms-u-textAlignCenter { + text-align: center; +} + +.ms-u-textAlignRight { + text-align: left; +} + +.ms-u-screenReaderOnly { + position: absolute; + width: 1px; + height: 1px; + padding: 0; + margin: -1px; + overflow: hidden; + clip: rect(0, 0, 0, 0); + border: 0; +} + +.ms-u-textTruncate { + overflow: hidden; + text-overflow: ellipsis; + white-space: nowrap; + word-wrap: normal; +} + +.ms-u-noWrap { + white-space: nowrap; +} + +.ms-bgColor-themeDark, +.ms-bgColor-themeDark--hover:hover { + background-color: #005a9e; +} + +.ms-bgColor-themeDarkAlt, +.ms-bgColor-themeDarkAlt--hover:hover { + background-color: #106ebe; +} + +.ms-bgColor-themeDarker, +.ms-bgColor-themeDarker--hover:hover { + background-color: #004578; +} + +.ms-bgColor-themePrimary, +.ms-bgColor-themePrimary--hover:hover { + background-color: #0078d7; +} + +.ms-bgColor-themeSecondary, +.ms-bgColor-themeSecondary--hover:hover { + background-color: #2488d8; +} + +.ms-bgColor-themeTertiary, +.ms-bgColor-themeTertiary--hover:hover { + background-color: #69afe5; +} + +.ms-bgColor-themeLight, +.ms-bgColor-themeLight--hover:hover { + background-color: #b3d6f2; +} + +.ms-bgColor-themeLighter, +.ms-bgColor-themeLighter--hover:hover { + background-color: #deecf9; +} + +.ms-bgColor-themeLighterAlt, +.ms-bgColor-themeLighterAlt--hover:hover { + background-color: #eff6fc; +} + +.ms-bgColor-black, +.ms-bgColor-black--hover:hover { + background-color: #000000; +} + +.ms-bgColor-neutralDark, +.ms-bgColor-neutralDark--hover:hover { + background-color: #212121; +} + +.ms-bgColor-neutralPrimary, +.ms-bgColor-neutralPrimary--hover:hover { + background-color: #333333; +} + +.ms-bgColor-neutralPrimaryAlt, +.ms-bgColor-neutralPrimaryAlt--hover:hover { + background-color: #3c3c3c; +} + +.ms-bgColor-neutralSecondary, +.ms-bgColor-neutralSecondary--hover:hover { + background-color: #666666; +} + +.ms-bgColor-neutralSecondaryAlt, +.ms-bgColor-neutralSecondaryAlt--hover:hover { + background-color: #767676; +} + +.ms-bgColor-neutralTertiary, +.ms-bgColor-neutralTertiary--hover:hover { + background-color: #a6a6a6; +} + +.ms-bgColor-neutralTertiaryAlt, +.ms-bgColor-neutralTertiaryAlt--hover:hover { + background-color: #c8c8c8; +} + +.ms-bgColor-neutralLight, +.ms-bgColor-neutralLight--hover:hover { + background-color: #eaeaea; +} + +.ms-bgColor-neutralLighter, +.ms-bgColor-neutralLighter--hover:hover { + background-color: #f4f4f4; +} + +.ms-bgColor-neutralLighterAlt, +.ms-bgColor-neutralLighterAlt--hover:hover { + background-color: #f8f8f8; +} + +.ms-bgColor-white, +.ms-bgColor-white--hover:hover { + background-color: #ffffff; +} + +.ms-bgColor-yellow { + background-color: #ffb900; +} + +.ms-bgColor-yellowLight { + background-color: #fff100; +} + +.ms-bgColor-orange { + background-color: #d83b01; +} + +.ms-bgColor-orangeLight { + background-color: #ea4300; +} + +.ms-bgColor-orangeLighter { + background-color: #ff8c00; +} + +.ms-bgColor-redDark { + background-color: #a80000; +} + +.ms-bgColor-red { + background-color: #e81123; +} + +.ms-bgColor-magentaDark { + background-color: #5c005c; +} + +.ms-bgColor-magenta { + background-color: #b4009e; +} + +.ms-bgColor-magentaLight { + background-color: #e3008c; +} + +.ms-bgColor-purpleDark { + background-color: #32145a; +} + +.ms-bgColor-purple { + background-color: #5c2d91; +} + +.ms-bgColor-purpleLight { + background-color: #b4a0ff; +} + +.ms-bgColor-blueDark { + background-color: #002050; +} + +.ms-bgColor-blueMid { + background-color: #00188f; +} + +.ms-bgColor-blue { + background-color: #0078d7; +} + +.ms-bgColor-blueLight { + background-color: #00bcf2; +} + +.ms-bgColor-tealDark { + background-color: #004b50; +} + +.ms-bgColor-teal { + background-color: #008272; +} + +.ms-bgColor-tealLight { + background-color: #00b294; +} + +.ms-bgColor-greenDark { + background-color: #004b1c; +} + +.ms-bgColor-green { + background-color: #107c10; +} + +.ms-bgColor-greenLight { + background-color: #bad80a; +} + +.ms-bgColor-info { + background-color: #f4f4f4; +} + +.ms-bgColor-success { + background-color: #dff6dd; +} + +.ms-bgColor-severeWarning { + background-color: #fed9cc; +} + +.ms-bgColor-warning { + background-color: #fff4ce; +} + +.ms-bgColor-error { + background-color: #fde7e9; +} + +.ms-borderColor-themeDark, +.ms-borderColor-themeDark--hover:hover { + border-color: #005a9e; +} + +.ms-borderColor-themeDarkAlt, +.ms-borderColor-themeDarkAlt--hover:hover { + border-color: #106ebe; +} + +.ms-borderColor-themeDarker, +.ms-borderColor-themeDarker--hover:hover { + border-color: #004578; +} + +.ms-borderColor-themePrimary, +.ms-borderColor-themePrimary--hover:hover { + border-color: #0078d7; +} + +.ms-borderColor-themeSecondary, +.ms-borderColor-themeSecondary--hover:hover { + border-color: #2488d8; +} + +.ms-borderColor-themeTertiary, +.ms-borderColor-themeTertiary--hover:hover { + border-color: #69afe5; +} + +.ms-borderColor-themeLight, +.ms-borderColor-themeLight--hover:hover { + border-color: #b3d6f2; +} + +.ms-borderColor-themeLighter, +.ms-borderColor-themeLighter--hover:hover { + border-color: #deecf9; +} + +.ms-borderColor-themeLighterAlt, +.ms-borderColor-themeLighterAlt--hover:hover { + border-color: #eff6fc; +} + +.ms-borderColor-black, +.ms-borderColor-black--hover:hover { + border-color: #000000; +} + +.ms-borderColor-neutralDark, +.ms-borderColor-neutralDark--hover:hover { + border-color: #212121; +} + +.ms-borderColor-neutralPrimary, +.ms-borderColor-neutralPrimary--hover:hover { + border-color: #333333; +} + +.ms-borderColor-neutralPrimaryAlt, +.ms-borderColor-neutralPrimaryAlt--hover:hover { + border-color: #3c3c3c; +} + +.ms-borderColor-neutralSecondary, +.ms-borderColor-neutralSecondary--hover:hover { + border-color: #666666; +} + +.ms-borderColor-neutralSecondaryAlt, +.ms-borderColor-neutralSecondaryAlt--hover:hover { + border-color: #767676; +} + +.ms-borderColor-neutralTertiary, +.ms-borderColor-neutralTertiary--hover:hover { + border-color: #a6a6a6; +} + +.ms-borderColor-neutralTertiaryAlt, +.ms-borderColor-neutralTertiaryAlt--hover:hover { + border-color: #c8c8c8; +} + +.ms-borderColor-neutralLight, +.ms-borderColor-neutralLight--hover:hover { + border-color: #eaeaea; +} + +.ms-borderColor-neutralLighter, +.ms-borderColor-neutralLighter--hover:hover { + border-color: #f4f4f4; +} + +.ms-borderColor-neutralLighterAlt, +.ms-borderColor-neutralLighterAlt--hover:hover { + border-color: #f8f8f8; +} + +.ms-borderColor-white, +.ms-borderColor-white--hover:hover { + border-color: #ffffff; +} + +.ms-borderColor-yellow { + border-color: #ffb900; +} + +.ms-borderColor-yellowLight { + border-color: #fff100; +} + +.ms-borderColor-orange { + border-color: #d83b01; +} + +.ms-borderColor-orangeLight { + border-color: #ea4300; +} + +.ms-borderColor-orangeLighter { + border-color: #ff8c00; +} + +.ms-borderColor-redDark { + border-color: #a80000; +} + +.ms-borderColor-red { + border-color: #e81123; +} + +.ms-borderColor-magentaDark { + border-color: #5c005c; +} + +.ms-borderColor-magenta { + border-color: #b4009e; +} + +.ms-borderColor-magentaLight { + border-color: #e3008c; +} + +.ms-borderColor-purpleDark { + border-color: #32145a; +} + +.ms-borderColor-purple { + border-color: #5c2d91; +} + +.ms-borderColor-purpleLight { + border-color: #b4a0ff; +} + +.ms-borderColor-blueDark { + border-color: #002050; +} + +.ms-borderColor-blueMid { + border-color: #00188f; +} + +.ms-borderColor-blue { + border-color: #0078d7; +} + +.ms-borderColor-blueLight { + border-color: #00bcf2; +} + +.ms-borderColor-tealDark { + border-color: #004b50; +} + +.ms-borderColor-teal { + border-color: #008272; +} + +.ms-borderColor-tealLight { + border-color: #00b294; +} + +.ms-borderColor-greenDark { + border-color: #004b1c; +} + +.ms-borderColor-green { + border-color: #107c10; +} + +.ms-borderColor-greenLight { + border-color: #bad80a; +} + +.ms-borderColorTop-themePrimary, +.ms-borderColorTop-themePrimary--hover:hover { + border-top-color: #0078d7; +} + +/* + Your use of the content in the files referenced here are subject to the terms of the license at http://aka.ms/fabric-font-license +*/ + +@font-face { + font-family: 'Segoe UI WestEuropean'; + src: local('Segoe UI Light'), url('https://appsforoffice.microsoft.com/fabric/fonts/SegoeUI-WestEuropean/SegoeUI-Light.woff2') format('woff2'), url('https://appsforoffice.microsoft.com/fabric/fonts/SegoeUI-WestEuropean/SegoeUI-Light.woff') format('woff'), url('https://appsforoffice.microsoft.com/fabric/fonts/SegoeUI-WestEuropean/SegoeUI-Light.ttf') format('truetype'); + font-weight: 100; + font-style: normal; +} + +@font-face { + font-family: 'Segoe UI WestEuropean'; + src: local('Segoe UI'), url('https://appsforoffice.microsoft.com/fabric/fonts/SegoeUI-WestEuropean/SegoeUI-Regular.woff2') format('woff2'), url('https://appsforoffice.microsoft.com/fabric/fonts/SegoeUI-WestEuropean/SegoeUI-Regular.woff') format('woff'), url('https://appsforoffice.microsoft.com/fabric/fonts/SegoeUI-WestEuropean/SegoeUI-Regular.ttf') format('truetype'); + font-weight: 400; + font-style: normal; +} + +@font-face { + font-family: 'Segoe UI WestEuropean'; + src: local('Segoe UI Semibold'), url('https://appsforoffice.microsoft.com/fabric/fonts/SegoeUI-WestEuropean/SegoeUI-Semibold.woff2') format('woff2'), url('https://appsforoffice.microsoft.com/fabric/fonts/SegoeUI-WestEuropean/SegoeUI-Semibold.woff') format('woff'), url('https://appsforoffice.microsoft.com/fabric/fonts/SegoeUI-WestEuropean/SegoeUI-Semibold.ttf') format('truetype'); + font-weight: 600; + font-style: normal; +} + +@font-face { + font-family: 'Segoe UI WestEuropean'; + src: local('Segoe UI Semilight'), url('https://appsforoffice.microsoft.com/fabric/fonts/SegoeUI-WestEuropean/SegoeUI-Semilight.woff2') format('woff2'), url('https://appsforoffice.microsoft.com/fabric/fonts/SegoeUI-WestEuropean/SegoeUI-Semilight.woff') format('woff'), url('https://appsforoffice.microsoft.com/fabric/fonts/SegoeUI-WestEuropean/SegoeUI-Semilight.ttf') format('truetype'); + font-weight: 200; + font-style: normal; +} + +.ms-font-su { + font-family: 'Segoe UI WestEuropean', 'Segoe UI', -apple-system, BlinkMacSystemFont, 'Roboto', 'Helvetica Neue', sans-serif; + -webkit-font-smoothing: antialiased; + font-size: 42px; + font-weight: 100; +} + +.ms-font-xxl { + font-family: 'Segoe UI WestEuropean', 'Segoe UI', -apple-system, BlinkMacSystemFont, 'Roboto', 'Helvetica Neue', sans-serif; + -webkit-font-smoothing: antialiased; + font-size: 28px; + font-weight: 100; +} + +.ms-font-xl { + font-family: 'Segoe UI WestEuropean', 'Segoe UI', -apple-system, BlinkMacSystemFont, 'Roboto', 'Helvetica Neue', sans-serif; + -webkit-font-smoothing: antialiased; + font-size: 21px; + font-weight: 100; +} + +.ms-font-l { + font-family: 'Segoe UI WestEuropean', 'Segoe UI', -apple-system, BlinkMacSystemFont, 'Roboto', 'Helvetica Neue', sans-serif; + -webkit-font-smoothing: antialiased; + font-size: 17px; + font-weight: 300; +} + +.ms-font-m-plus { + font-family: 'Segoe UI WestEuropean', 'Segoe UI', -apple-system, BlinkMacSystemFont, 'Roboto', 'Helvetica Neue', sans-serif; + -webkit-font-smoothing: antialiased; + font-size: 15px; + font-weight: 400; +} + +.ms-font-m { + font-family: 'Segoe UI WestEuropean', 'Segoe UI', -apple-system, BlinkMacSystemFont, 'Roboto', 'Helvetica Neue', sans-serif; + -webkit-font-smoothing: antialiased; + font-size: 14px; + font-weight: 400; +} + +.ms-font-s-plus { + font-family: 'Segoe UI WestEuropean', 'Segoe UI', -apple-system, BlinkMacSystemFont, 'Roboto', 'Helvetica Neue', sans-serif; + -webkit-font-smoothing: antialiased; + font-size: 13px; + font-weight: 400; +} + +.ms-font-s { + font-family: 'Segoe UI WestEuropean', 'Segoe UI', -apple-system, BlinkMacSystemFont, 'Roboto', 'Helvetica Neue', sans-serif; + -webkit-font-smoothing: antialiased; + font-size: 12px; + font-weight: 400; +} + +.ms-font-xs { + font-family: 'Segoe UI WestEuropean', 'Segoe UI', -apple-system, BlinkMacSystemFont, 'Roboto', 'Helvetica Neue', sans-serif; + -webkit-font-smoothing: antialiased; + font-size: 11px; + font-weight: 400; +} + +.ms-font-mi { + font-family: 'Segoe UI WestEuropean', 'Segoe UI', -apple-system, BlinkMacSystemFont, 'Roboto', 'Helvetica Neue', sans-serif; + -webkit-font-smoothing: antialiased; + font-size: 10px; + font-weight: 600; +} + +.ms-fontWeight-light, +.ms-fontWeight-light--hover:hover { + font-weight: 100; +} + +.ms-fontWeight-semilight, +.ms-fontWeight-semilight--hover:hover { + font-weight: 300; +} + +.ms-fontWeight-regular, +.ms-fontWeight-regular--hover:hover { + font-weight: 400; +} + +.ms-fontWeight-semibold, +.ms-fontWeight-semibold--hover:hover { + font-weight: 600; +} + +.ms-fontSize-su { + font-size: 42px; +} + +.ms-fontSize-xxl { + font-size: 28px; +} + +.ms-fontSize-xl { + font-size: 21px; +} + +.ms-fontSize-l { + font-size: 17px; +} + +.ms-fontSize-mPlus { + font-size: 15px; +} + +.ms-fontSize-m { + font-size: 14px; +} + +.ms-fontSize-sPlus { + font-size: 13px; +} + +.ms-fontSize-s { + font-size: 12px; +} + +.ms-fontSize-xs { + font-size: 11px; +} + +.ms-fontSize-mi { + font-size: 10px; +} + +.ms-fontColor-themeDarker, +.ms-fontColor-themeDarker--hover:hover { + color: #004578; +} + +.ms-fontColor-themeDark, +.ms-fontColor-themeDark--hover:hover { + color: #005a9e; +} + +.ms-fontColor-themeDarkAlt, +.ms-fontColor-themeDarkAlt--hover:hover { + color: #106ebe; +} + +.ms-fontColor-themePrimary, +.ms-fontColor-themePrimary--hover:hover { + color: #0078d7; +} + +.ms-fontColor-themeSecondary, +.ms-fontColor-themeSecondary--hover:hover { + color: #2488d8; +} + +.ms-fontColor-themeTertiary, +.ms-fontColor-themeTertiary--hover:hover { + color: #69afe5; +} + +.ms-fontColor-themeLight, +.ms-fontColor-themeLight--hover:hover { + color: #b3d6f2; +} + +.ms-fontColor-themeLighter, +.ms-fontColor-themeLighter--hover:hover { + color: #deecf9; +} + +.ms-fontColor-themeLighterAlt, +.ms-fontColor-themeLighterAlt--hover:hover { + color: #eff6fc; +} + +.ms-fontColor-black, +.ms-fontColor-black--hover:hover { + color: #000000; +} + +.ms-fontColor-neutralDark, +.ms-fontColor-neutralDark--hover:hover { + color: #212121; +} + +.ms-fontColor-neutralPrimary, +.ms-fontColor-neutralPrimary--hover:hover { + color: #333333; +} + +.ms-fontColor-neutralPrimaryAlt, +.ms-fontColor-neutralPrimaryAlt--hover:hover { + color: #3c3c3c; +} + +.ms-fontColor-neutralSecondary, +.ms-fontColor-neutralSecondary--hover:hover { + color: #666666; +} + +.ms-fontColor-neutralSecondaryAlt, +.ms-fontColor-neutralSecondaryAlt--hover:hover { + color: #767676; +} + +.ms-fontColor-neutralTertiary, +.ms-fontColor-neutralTertiary--hover:hover { + color: #a6a6a6; +} + +.ms-fontColor-neutralTertiaryAlt, +.ms-fontColor-neutralTertiaryAlt--hover:hover { + color: #c8c8c8; +} + +.ms-fontColor-neutralLight, +.ms-fontColor-neutralLight--hover:hover { + color: #eaeaea; +} + +.ms-fontColor-neutralLighter, +.ms-fontColor-neutralLighter--hover:hover { + color: #f4f4f4; +} + +.ms-fontColor-neutralLighterAlt, +.ms-fontColor-neutralLighterAlt--hover:hover { + color: #f8f8f8; +} + +.ms-fontColor-white, +.ms-fontColor-white--hover:hover { + color: #ffffff; +} + +.ms-fontColor-yellow, +.ms-fontColor-yellow--hover:hover { + color: #ffb900; +} + +.ms-fontColor-yellowLight, +.ms-fontColor-yellowLight--hover:hover { + color: #fff100; +} + +.ms-fontColor-orange, +.ms-fontColor-orange--hover:hover { + color: #d83b01; +} + +.ms-fontColor-orangeLight, +.ms-fontColor-orangeLight--hover:hover { + color: #ea4300; +} + +.ms-fontColor-orangeLighter, +.ms-fontColor-orangeLighter--hover:hover { + color: #ff8c00; +} + +.ms-fontColor-redDark, +.ms-fontColor-redDark--hover:hover { + color: #a80000; +} + +.ms-fontColor-red, +.ms-fontColor-red--hover:hover { + color: #e81123; +} + +.ms-fontColor-magentaDark, +.ms-fontColor-magentaDark--hover:hover { + color: #5c005c; +} + +.ms-fontColor-magenta, +.ms-fontColor-magenta--hover:hover { + color: #b4009e; +} + +.ms-fontColor-magentaLight, +.ms-fontColor-magentaLight--hover:hover { + color: #e3008c; +} + +.ms-fontColor-purpleDark, +.ms-fontColor-purpleDark--hover:hover { + color: #32145a; +} + +.ms-fontColor-purple, +.ms-fontColor-purple--hover:hover { + color: #5c2d91; +} + +.ms-fontColor-purpleLight, +.ms-fontColor-purpleLight--hover:hover { + color: #b4a0ff; +} + +.ms-fontColor-blueDark, +.ms-fontColor-blueDark--hover:hover { + color: #002050; +} + +.ms-fontColor-blueMid, +.ms-fontColor-blueMid--hover:hover { + color: #00188f; +} + +.ms-fontColor-blue, +.ms-fontColor-blue--hover:hover { + color: #0078d7; +} + +.ms-fontColor-blueLight, +.ms-fontColor-blueLight--hover:hover { + color: #00bcf2; +} + +.ms-fontColor-tealDark, +.ms-fontColor-tealDark--hover:hover { + color: #004b50; +} + +.ms-fontColor-teal, +.ms-fontColor-teal--hover:hover { + color: #008272; +} + +.ms-fontColor-tealLight, +.ms-fontColor-tealLight--hover:hover { + color: #00b294; +} + +.ms-fontColor-greenDark, +.ms-fontColor-greenDark--hover:hover { + color: #004b1c; +} + +.ms-fontColor-green, +.ms-fontColor-green--hover:hover { + color: #107c10; +} + +.ms-fontColor-greenLight, +.ms-fontColor-greenLight--hover:hover { + color: #bad80a; +} + +.ms-fontColor-info, +.ms-fontColor-info--hover:hover { + color: #767676; +} + +.ms-fontColor-success, +.ms-fontColor-success--hover:hover { + color: #107c10; +} + +.ms-fontColor-alert, +.ms-fontColor-alert--hover:hover { + color: #d83b01; +} + +.ms-fontColor-warning, +.ms-fontColor-warning--hover:hover { + color: #767676; +} + +.ms-fontColor-severeWarning, +.ms-fontColor-severeWarning--hover:hover { + color: #d83b01; +} + +.ms-fontColor-error, +.ms-fontColor-error--hover:hover { + color: #a80000; +} + +*[lang='jpn'] .ms-font-mi, +*[lang='jpn'] .ms-font-xs, +*[lang='jpn'] .ms-font-s, +*[lang='jpn'] .ms-font-s-plus, +*[lang='jpn'] .ms-font-m, +*[lang='jpn'] .ms-font-m-plus, +*[lang='jpn'] .ms-font-l, +*[lang='jpn'] .ms-font-xl, +*[lang='jpn'] .ms-font-xxl, +*[lang='jpn'] .ms-font-su, +*[lang='jpn'] .ms-fontWeight-light, +*[lang='jpn'] .ms-fontWeight-light-hover:hover, +*[lang='jpn'] .ms-fontWeight-semilight, +*[lang='jpn'] .ms-fontWeight-semilight-hover:hover, +*[lang='jpn'] .ms-fontWeight-regular, +*[lang='jpn'] .ms-fontWeight-regular-hover:hover, +*[lang='jpn'] .ms-fontWeight-semibold, +*[lang='jpn'] .ms-fontWeight-semibold-hover:hover { + font-family: 'Yu Gothic', 'Meiryo UI', Meiryo, 'MS Pgothic', Osaka, 'Segoe UI', -apple-system, BlinkMacSystemFont, 'Roboto', 'Helvetica Neue', sans-serif; +} + +*[lang='kor'] .ms-font-mi, +*[lang='kor'] .ms-font-xs, +*[lang='kor'] .ms-font-s, +*[lang='kor'] .ms-font-s-plus, +*[lang='kor'] .ms-font-m, +*[lang='kor'] .ms-font-m-plus, +*[lang='kor'] .ms-font-l, +*[lang='kor'] .ms-font-xl, +*[lang='kor'] .ms-font-xxl, +*[lang='kor'] .ms-font-su, +*[lang='kor'] .ms-fontWeight-light, +*[lang='kor'] .ms-fontWeight-light-hover:hover, +*[lang='kor'] .ms-fontWeight-semilight, +*[lang='kor'] .ms-fontWeight-semilight-hover:hover, +*[lang='kor'] .ms-fontWeight-regular, +*[lang='kor'] .ms-fontWeight-regular-hover:hover, +*[lang='kor'] .ms-fontWeight-semibold, +*[lang='kor'] .ms-fontWeight-semibold-hover:hover { + font-family: 'Malgun Gothic', Gulim, 'Segoe UI', -apple-system, BlinkMacSystemFont, 'Roboto', 'Helvetica Neue', sans-serif; +} + +*[lang='cmn'] .ms-font-mi, +*[lang='cmn'] .ms-font-xs, +*[lang='cmn'] .ms-font-s, +*[lang='cmn'] .ms-font-s-plus, +*[lang='cmn'] .ms-font-m, +*[lang='cmn'] .ms-font-m-plus, +*[lang='cmn'] .ms-font-l, +*[lang='cmn'] .ms-font-xl, +*[lang='cmn'] .ms-font-xxl, +*[lang='cmn'] .ms-font-su, +*[lang='cmn'] .ms-fontWeight-light, +*[lang='cmn'] .ms-fontWeight-light-hover:hover, +*[lang='cmn'] .ms-fontWeight-semilight, +*[lang='cmn'] .ms-fontWeight-semilight-hover:hover, +*[lang='cmn'] .ms-fontWeight-regular, +*[lang='cmn'] .ms-fontWeight-regular-hover:hover, +*[lang='cmn'] .ms-fontWeight-semibold, +*[lang='cmn'] .ms-fontWeight-semibold-hover:hover { + font-family: 'Microsoft Yahei', Verdana, Simsun, 'Segoe UI', -apple-system, BlinkMacSystemFont, 'Roboto', 'Helvetica Neue', sans-serif; +} + +*[lang='yue'] .ms-font-mi, +*[lang='yue'] .ms-font-xs, +*[lang='yue'] .ms-font-s, +*[lang='yue'] .ms-font-s-plus, +*[lang='yue'] .ms-font-m, +*[lang='yue'] .ms-font-m-plus, +*[lang='yue'] .ms-font-l, +*[lang='yue'] .ms-font-xl, +*[lang='yue'] .ms-font-xxl, +*[lang='yue'] .ms-font-su, +*[lang='yue'] .ms-fontWeight-light, +*[lang='yue'] .ms-fontWeight-light-hover:hover, +*[lang='yue'] .ms-fontWeight-semilight, +*[lang='yue'] .ms-fontWeight-semilight-hover:hover, +*[lang='yue'] .ms-fontWeight-regular, +*[lang='yue'] .ms-fontWeight-regular-hover:hover, +*[lang='yue'] .ms-fontWeight-semibold, +*[lang='yue'] .ms-fontWeight-semibold-hover:hover { + font-family: 'Microsoft Jhenghei', Pmingliu, 'Segoe UI', -apple-system, BlinkMacSystemFont, 'Roboto', 'Helvetica Neue', sans-serif; +} + +*[lang='hin'] .ms-font-mi, +*[lang='hin'] .ms-font-xs, +*[lang='hin'] .ms-font-s, +*[lang='hin'] .ms-font-s-plus, +*[lang='hin'] .ms-font-m, +*[lang='hin'] .ms-font-m-plus, +*[lang='hin'] .ms-font-l, +*[lang='hin'] .ms-font-xl, +*[lang='hin'] .ms-font-xxl, +*[lang='hin'] .ms-font-su, +*[lang='hin'] .ms-fontWeight-light, +*[lang='hin'] .ms-fontWeight-light-hover:hover, +*[lang='hin'] .ms-fontWeight-semilight, +*[lang='hin'] .ms-fontWeight-semilight-hover:hover, +*[lang='hin'] .ms-fontWeight-regular, +*[lang='hin'] .ms-fontWeight-regular-hover:hover, +*[lang='hin'] .ms-fontWeight-semibold, +*[lang='hin'] .ms-fontWeight-semibold-hover:hover { + font-family: 'Nirmala UI', 'Segoe UI', -apple-system, BlinkMacSystemFont, 'Roboto', 'Helvetica Neue', sans-serif; +} + +*[lang='tha'] .ms-font-mi, +*[lang='tha'] .ms-font-xs, +*[lang='tha'] .ms-font-s, +*[lang='tha'] .ms-font-s-plus, +*[lang='tha'] .ms-font-m, +*[lang='tha'] .ms-font-m-plus, +*[lang='tha'] .ms-font-l, +*[lang='tha'] .ms-font-xl, +*[lang='tha'] .ms-font-xxl, +*[lang='tha'] .ms-font-su, +*[lang='tha'] .ms-fontWeight-light, +*[lang='tha'] .ms-fontWeight-light-hover:hover, +*[lang='tha'] .ms-fontWeight-semilight, +*[lang='tha'] .ms-fontWeight-semilight-hover:hover, +*[lang='tha'] .ms-fontWeight-regular, +*[lang='tha'] .ms-fontWeight-regular-hover:hover, +*[lang='tha'] .ms-fontWeight-semibold, +*[lang='tha'] .ms-fontWeight-semibold-hover:hover { + font-family: 'Leelawadee UI', 'Kmer UI', 'Segoe UI WestEuropean', 'Segoe UI', -apple-system, BlinkMacSystemFont, 'Roboto', 'Helvetica Neue', sans-serif; +} + +*[lang='ara'] .ms-font-mi, +*[lang='ara'] .ms-font-xs, +*[lang='ara'] .ms-font-s, +*[lang='ara'] .ms-font-s-plus, +*[lang='ara'] .ms-font-m, +*[lang='ara'] .ms-font-m-plus, +*[lang='ara'] .ms-font-l, +*[lang='ara'] .ms-font-xl, +*[lang='ara'] .ms-font-xxl, +*[lang='ara'] .ms-font-su, +*[lang='ara'] .ms-fontWeight-light, +*[lang='ara'] .ms-fontWeight-light-hover:hover, +*[lang='ara'] .ms-fontWeight-semilight, +*[lang='ara'] .ms-fontWeight-semilight-hover:hover, +*[lang='ara'] .ms-fontWeight-regular, +*[lang='ara'] .ms-fontWeight-regular-hover:hover, +*[lang='ara'] .ms-fontWeight-semibold, +*[lang='ara'] .ms-fontWeight-semibold-hover:hover { + font-family: 'Segoe UI Arabic', 'Segoe UI WestEuropean', 'Segoe UI', -apple-system, BlinkMacSystemFont, 'Roboto', 'Helvetica Neue', sans-serif; +} + +*[lang='ces'] .ms-font-mi, +*[lang='ces'] .ms-font-xs, +*[lang='ces'] .ms-font-s, +*[lang='ces'] .ms-font-s-plus, +*[lang='ces'] .ms-font-m, +*[lang='ces'] .ms-font-m-plus, +*[lang='ces'] .ms-font-l, +*[lang='ces'] .ms-font-xl, +*[lang='ces'] .ms-font-xxl, +*[lang='ces'] .ms-font-su, +*[lang='ces'] .ms-fontWeight-light, +*[lang='ces'] .ms-fontWeight-light-hover:hover, +*[lang='ces'] .ms-fontWeight-semilight, +*[lang='ces'] .ms-fontWeight-semilight-hover:hover, +*[lang='ces'] .ms-fontWeight-regular, +*[lang='ces'] .ms-fontWeight-regular-hover:hover, +*[lang='ces'] .ms-fontWeight-semibold, +*[lang='ces'] .ms-fontWeight-semibold-hover:hover { + font-family: 'Segoe UI EastEuropean', 'Segoe UI WestEuropean', 'Segoe UI', -apple-system, BlinkMacSystemFont, 'Roboto', 'Helvetica Neue', sans-serif; +} + +*[lang='est'] .ms-font-mi, +*[lang='est'] .ms-font-xs, +*[lang='est'] .ms-font-s, +*[lang='est'] .ms-font-s-plus, +*[lang='est'] .ms-font-m, +*[lang='est'] .ms-font-m-plus, +*[lang='est'] .ms-font-l, +*[lang='est'] .ms-font-xl, +*[lang='est'] .ms-font-xxl, +*[lang='est'] .ms-font-su, +*[lang='est'] .ms-fontWeight-light, +*[lang='est'] .ms-fontWeight-light-hover:hover, +*[lang='est'] .ms-fontWeight-semilight, +*[lang='est'] .ms-fontWeight-semilight-hover:hover, +*[lang='est'] .ms-fontWeight-regular, +*[lang='est'] .ms-fontWeight-regular-hover:hover, +*[lang='est'] .ms-fontWeight-semibold, +*[lang='est'] .ms-fontWeight-semibold-hover:hover { + font-family: 'Segoe UI EastEuropean', 'Segoe UI WestEuropean', 'Segoe UI', -apple-system, BlinkMacSystemFont, 'Roboto', 'Helvetica Neue', sans-serif; +} + +*[lang='hrv'] .ms-font-mi, +*[lang='hrv'] .ms-font-xs, +*[lang='hrv'] .ms-font-s, +*[lang='hrv'] .ms-font-s-plus, +*[lang='hrv'] .ms-font-m, +*[lang='hrv'] .ms-font-m-plus, +*[lang='hrv'] .ms-font-l, +*[lang='hrv'] .ms-font-xl, +*[lang='hrv'] .ms-font-xxl, +*[lang='hrv'] .ms-font-su, +*[lang='hrv'] .ms-fontWeight-light, +*[lang='hrv'] .ms-fontWeight-light-hover:hover, +*[lang='hrv'] .ms-fontWeight-semilight, +*[lang='hrv'] .ms-fontWeight-semilight-hover:hover, +*[lang='hrv'] .ms-fontWeight-regular, +*[lang='hrv'] .ms-fontWeight-regular-hover:hover, +*[lang='hrv'] .ms-fontWeight-semibold, +*[lang='hrv'] .ms-fontWeight-semibold-hover:hover { + font-family: 'Segoe UI EastEuropean', 'Segoe UI WestEuropean', 'Segoe UI', -apple-system, BlinkMacSystemFont, 'Roboto', 'Helvetica Neue', sans-serif; +} + +*[lang='hun'] .ms-font-mi, +*[lang='hun'] .ms-font-xs, +*[lang='hun'] .ms-font-s, +*[lang='hun'] .ms-font-s-plus, +*[lang='hun'] .ms-font-m, +*[lang='hun'] .ms-font-m-plus, +*[lang='hun'] .ms-font-l, +*[lang='hun'] .ms-font-xl, +*[lang='hun'] .ms-font-xxl, +*[lang='hun'] .ms-font-su, +*[lang='hun'] .ms-fontWeight-light, +*[lang='hun'] .ms-fontWeight-light-hover:hover, +*[lang='hun'] .ms-fontWeight-semilight, +*[lang='hun'] .ms-fontWeight-semilight-hover:hover, +*[lang='hun'] .ms-fontWeight-regular, +*[lang='hun'] .ms-fontWeight-regular-hover:hover, +*[lang='hun'] .ms-fontWeight-semibold, +*[lang='hun'] .ms-fontWeight-semibold-hover:hover { + font-family: 'Segoe UI EastEuropean', 'Segoe UI WestEuropean', 'Segoe UI', -apple-system, BlinkMacSystemFont, 'Roboto', 'Helvetica Neue', sans-serif; +} + +*[lang='kaz'] .ms-font-mi, +*[lang='kaz'] .ms-font-xs, +*[lang='kaz'] .ms-font-s, +*[lang='kaz'] .ms-font-s-plus, +*[lang='kaz'] .ms-font-m, +*[lang='kaz'] .ms-font-m-plus, +*[lang='kaz'] .ms-font-l, +*[lang='kaz'] .ms-font-xl, +*[lang='kaz'] .ms-font-xxl, +*[lang='kaz'] .ms-font-su, +*[lang='kaz'] .ms-fontWeight-light, +*[lang='kaz'] .ms-fontWeight-light-hover:hover, +*[lang='kaz'] .ms-fontWeight-semilight, +*[lang='kaz'] .ms-fontWeight-semilight-hover:hover, +*[lang='kaz'] .ms-fontWeight-regular, +*[lang='kaz'] .ms-fontWeight-regular-hover:hover, +*[lang='kaz'] .ms-fontWeight-semibold, +*[lang='kaz'] .ms-fontWeight-semibold-hover:hover { + font-family: 'Segoe UI EastEuropean', 'Segoe UI WestEuropean', 'Segoe UI', -apple-system, BlinkMacSystemFont, 'Roboto', 'Helvetica Neue', sans-serif; +} + +*[lang='lav'] .ms-font-mi, +*[lang='lav'] .ms-font-xs, +*[lang='lav'] .ms-font-s, +*[lang='lav'] .ms-font-s-plus, +*[lang='lav'] .ms-font-m, +*[lang='lav'] .ms-font-m-plus, +*[lang='lav'] .ms-font-l, +*[lang='lav'] .ms-font-xl, +*[lang='lav'] .ms-font-xxl, +*[lang='lav'] .ms-font-su, +*[lang='lav'] .ms-fontWeight-light, +*[lang='lav'] .ms-fontWeight-light-hover:hover, +*[lang='lav'] .ms-fontWeight-semilight, +*[lang='lav'] .ms-fontWeight-semilight-hover:hover, +*[lang='lav'] .ms-fontWeight-regular, +*[lang='lav'] .ms-fontWeight-regular-hover:hover, +*[lang='lav'] .ms-fontWeight-semibold, +*[lang='lav'] .ms-fontWeight-semibold-hover:hover { + font-family: 'Segoe UI EastEuropean', 'Segoe UI WestEuropean', 'Segoe UI', -apple-system, BlinkMacSystemFont, 'Roboto', 'Helvetica Neue', sans-serif; +} + +*[lang='lit'] .ms-font-mi, +*[lang='lit'] .ms-font-xs, +*[lang='lit'] .ms-font-s, +*[lang='lit'] .ms-font-s-plus, +*[lang='lit'] .ms-font-m, +*[lang='lit'] .ms-font-m-plus, +*[lang='lit'] .ms-font-l, +*[lang='lit'] .ms-font-xl, +*[lang='lit'] .ms-font-xxl, +*[lang='lit'] .ms-font-su, +*[lang='lit'] .ms-fontWeight-light, +*[lang='lit'] .ms-fontWeight-light-hover:hover, +*[lang='lit'] .ms-fontWeight-semilight, +*[lang='lit'] .ms-fontWeight-semilight-hover:hover, +*[lang='lit'] .ms-fontWeight-regular, +*[lang='lit'] .ms-fontWeight-regular-hover:hover, +*[lang='lit'] .ms-fontWeight-semibold, +*[lang='lit'] .ms-fontWeight-semibold-hover:hover { + font-family: 'Segoe UI EastEuropean', 'Segoe UI WestEuropean', 'Segoe UI', -apple-system, BlinkMacSystemFont, 'Roboto', 'Helvetica Neue', sans-serif; +} + +*[lang='pol'] .ms-font-mi, +*[lang='pol'] .ms-font-xs, +*[lang='pol'] .ms-font-s, +*[lang='pol'] .ms-font-s-plus, +*[lang='pol'] .ms-font-m, +*[lang='pol'] .ms-font-m-plus, +*[lang='pol'] .ms-font-l, +*[lang='pol'] .ms-font-xl, +*[lang='pol'] .ms-font-xxl, +*[lang='pol'] .ms-font-su, +*[lang='pol'] .ms-fontWeight-light, +*[lang='pol'] .ms-fontWeight-light-hover:hover, +*[lang='pol'] .ms-fontWeight-semilight, +*[lang='pol'] .ms-fontWeight-semilight-hover:hover, +*[lang='pol'] .ms-fontWeight-regular, +*[lang='pol'] .ms-fontWeight-regular-hover:hover, +*[lang='pol'] .ms-fontWeight-semibold, +*[lang='pol'] .ms-fontWeight-semibold-hover:hover { + font-family: 'Segoe UI EastEuropean', 'Segoe UI WestEuropean', 'Segoe UI', -apple-system, BlinkMacSystemFont, 'Roboto', 'Helvetica Neue', sans-serif; +} + +*[lang='slk'] .ms-font-mi, +*[lang='slk'] .ms-font-xs, +*[lang='slk'] .ms-font-s, +*[lang='slk'] .ms-font-s-plus, +*[lang='slk'] .ms-font-m, +*[lang='slk'] .ms-font-m-plus, +*[lang='slk'] .ms-font-l, +*[lang='slk'] .ms-font-xl, +*[lang='slk'] .ms-font-xxl, +*[lang='slk'] .ms-font-su, +*[lang='slk'] .ms-fontWeight-light, +*[lang='slk'] .ms-fontWeight-light-hover:hover, +*[lang='slk'] .ms-fontWeight-semilight, +*[lang='slk'] .ms-fontWeight-semilight-hover:hover, +*[lang='slk'] .ms-fontWeight-regular, +*[lang='slk'] .ms-fontWeight-regular-hover:hover, +*[lang='slk'] .ms-fontWeight-semibold, +*[lang='slk'] .ms-fontWeight-semibold-hover:hover { + font-family: 'Segoe UI EastEuropean', 'Segoe UI WestEuropean', 'Segoe UI', -apple-system, BlinkMacSystemFont, 'Roboto', 'Helvetica Neue', sans-serif; +} + +*[lang='tur'] .ms-font-mi, +*[lang='tur'] .ms-font-xs, +*[lang='tur'] .ms-font-s, +*[lang='tur'] .ms-font-s-plus, +*[lang='tur'] .ms-font-m, +*[lang='tur'] .ms-font-m-plus, +*[lang='tur'] .ms-font-l, +*[lang='tur'] .ms-font-xl, +*[lang='tur'] .ms-font-xxl, +*[lang='tur'] .ms-font-su, +*[lang='tur'] .ms-fontWeight-light, +*[lang='tur'] .ms-fontWeight-light-hover:hover, +*[lang='tur'] .ms-fontWeight-semilight, +*[lang='tur'] .ms-fontWeight-semilight-hover:hover, +*[lang='tur'] .ms-fontWeight-regular, +*[lang='tur'] .ms-fontWeight-regular-hover:hover, +*[lang='tur'] .ms-fontWeight-semibold, +*[lang='tur'] .ms-fontWeight-semibold-hover:hover { + font-family: 'Segoe UI EastEuropean', 'Segoe UI WestEuropean', 'Segoe UI', -apple-system, BlinkMacSystemFont, 'Roboto', 'Helvetica Neue', sans-serif; +} + +*[lang='rus'] .ms-font-mi, +*[lang='rus'] .ms-font-xs, +*[lang='rus'] .ms-font-s, +*[lang='rus'] .ms-font-s-plus, +*[lang='rus'] .ms-font-m, +*[lang='rus'] .ms-font-m-plus, +*[lang='rus'] .ms-font-l, +*[lang='rus'] .ms-font-xl, +*[lang='rus'] .ms-font-xxl, +*[lang='rus'] .ms-font-su, +*[lang='rus'] .ms-fontWeight-light, +*[lang='rus'] .ms-fontWeight-light-hover:hover, +*[lang='rus'] .ms-fontWeight-semilight, +*[lang='rus'] .ms-fontWeight-semilight-hover:hover, +*[lang='rus'] .ms-fontWeight-regular, +*[lang='rus'] .ms-fontWeight-regular-hover:hover, +*[lang='rus'] .ms-fontWeight-semibold, +*[lang='rus'] .ms-fontWeight-semibold-hover:hover { + font-family: 'Segoe UI Cyrillic', 'Segoe UI WestEuropean', 'Segoe UI', -apple-system, BlinkMacSystemFont, 'Roboto', 'Helvetica Neue', sans-serif; +} + +*[lang='ell'] .ms-font-mi, +*[lang='ell'] .ms-font-xs, +*[lang='ell'] .ms-font-s, +*[lang='ell'] .ms-font-s-plus, +*[lang='ell'] .ms-font-m, +*[lang='ell'] .ms-font-m-plus, +*[lang='ell'] .ms-font-l, +*[lang='ell'] .ms-font-xl, +*[lang='ell'] .ms-font-xxl, +*[lang='ell'] .ms-font-su, +*[lang='ell'] .ms-fontWeight-light, +*[lang='ell'] .ms-fontWeight-light-hover:hover, +*[lang='ell'] .ms-fontWeight-semilight, +*[lang='ell'] .ms-fontWeight-semilight-hover:hover, +*[lang='ell'] .ms-fontWeight-regular, +*[lang='ell'] .ms-fontWeight-regular-hover:hover, +*[lang='ell'] .ms-fontWeight-semibold, +*[lang='ell'] .ms-fontWeight-semibold-hover:hover { + font-family: 'Segoe UI Greek', 'Segoe UI WestEuropean', 'Segoe UI', -apple-system, BlinkMacSystemFont, 'Roboto', 'Helvetica Neue', sans-serif; +} + +*[lang='heb'] .ms-font-mi, +*[lang='heb'] .ms-font-xs, +*[lang='heb'] .ms-font-s, +*[lang='heb'] .ms-font-s-plus, +*[lang='heb'] .ms-font-m, +*[lang='heb'] .ms-font-m-plus, +*[lang='heb'] .ms-font-l, +*[lang='heb'] .ms-font-xl, +*[lang='heb'] .ms-font-xxl, +*[lang='heb'] .ms-font-su, +*[lang='heb'] .ms-fontWeight-light, +*[lang='heb'] .ms-fontWeight-light-hover:hover, +*[lang='heb'] .ms-fontWeight-semilight, +*[lang='heb'] .ms-fontWeight-semilight-hover:hover, +*[lang='heb'] .ms-fontWeight-regular, +*[lang='heb'] .ms-fontWeight-regular-hover:hover, +*[lang='heb'] .ms-fontWeight-semibold, +*[lang='heb'] .ms-fontWeight-semibold-hover:hover { + font-family: 'Segoe UI Hebrew', 'Segoe UI WestEuropean', 'Segoe UI', -apple-system, BlinkMacSystemFont, 'Roboto', 'Helvetica Neue', sans-serif; +} + +*[lang='vie'] .ms-font-mi, +*[lang='vie'] .ms-font-xs, +*[lang='vie'] .ms-font-s, +*[lang='vie'] .ms-font-s-plus, +*[lang='vie'] .ms-font-m, +*[lang='vie'] .ms-font-m-plus, +*[lang='vie'] .ms-font-l, +*[lang='vie'] .ms-font-xl, +*[lang='vie'] .ms-font-xxl, +*[lang='vie'] .ms-font-su, +*[lang='vie'] .ms-fontWeight-light, +*[lang='vie'] .ms-fontWeight-light-hover:hover, +*[lang='vie'] .ms-fontWeight-semilight, +*[lang='vie'] .ms-fontWeight-semilight-hover:hover, +*[lang='vie'] .ms-fontWeight-regular, +*[lang='vie'] .ms-fontWeight-regular-hover:hover, +*[lang='vie'] .ms-fontWeight-semibold, +*[lang='vie'] .ms-fontWeight-semibold-hover:hover { + font-family: 'Segoe UI Vietnamese', 'Segoe UI WestEuropean', 'Segoe UI', -apple-system, BlinkMacSystemFont, 'Roboto', 'Helvetica Neue', sans-serif; +} + +/* + Your use of the content in the files referenced here are subject to the terms of the license at http://aka.ms/fabric-font-license +*/ + +/* + Your use of the content in the files referenced here are subject to the terms of the license at http://aka.ms/fabric-font-license +*/ + +@font-face { + font-family: 'FabricMDL2Icons'; + src: url('https://appsforoffice.microsoft.com/fabric/fonts/icons/FabricMDL2Icons.woff') format('woff'), url('https://appsforoffice.microsoft.com/fabric/fonts/icons/FabricMDL2Icons.ttf') format('truetype'); + font-weight: normal; + font-style: normal; +} + +.ms-Icon { + -moz-osx-font-smoothing: grayscale; + -webkit-font-smoothing: antialiased; + display: inline-block; + font-family: 'FabricMDL2Icons'; + font-style: normal; + font-weight: normal; + speak: none; +} + +.ms-Icon--DecreaseIndentLegacy::before { + content: '\E290'; +} + +.ms-Icon--IncreaseIndentLegacy::before { + content: '\E291'; +} + +.ms-Icon--GlobalNavButton::before { + content: '\E700'; +} + +.ms-Icon--InternetSharing::before { + content: '\E704'; +} + +.ms-Icon--Brightness::before { + content: '\E706'; +} + +.ms-Icon--MapPin::before { + content: '\E707'; +} + +.ms-Icon--Airplane::before { + content: '\E709'; +} + +.ms-Icon--Tablet::before { + content: '\E70A'; +} + +.ms-Icon--QuickNote::before { + content: '\E70B'; +} + +.ms-Icon--ChevronDown::before { + content: '\E70D'; +} + +.ms-Icon--ChevronUp::before { + content: '\E70E'; +} + +.ms-Icon--Edit::before { + content: '\E70F'; +} + +.ms-Icon--Add::before { + content: '\E710'; +} + +.ms-Icon--Cancel::before { + content: '\E711'; +} + +.ms-Icon--More::before { + content: '\E712'; +} + +.ms-Icon--Settings::before { + content: '\E713'; +} + +.ms-Icon--Video::before { + content: '\E714'; +} + +.ms-Icon--Mail::before { + content: '\E715'; +} + +.ms-Icon--People::before { + content: '\E716'; +} + +.ms-Icon--Phone::before { + content: '\E717'; +} + +.ms-Icon--Pin::before { + content: '\E718'; +} + +.ms-Icon--Shop::before { + content: '\E719'; +} + +.ms-Icon--Link::before { + content: '\E71B'; +} + +.ms-Icon--Filter::before { + content: '\E71C'; +} + +.ms-Icon--Zoom::before { + content: '\E71E'; +} + +.ms-Icon--ZoomOut::before { + content: '\E71F'; +} + +.ms-Icon--Microphone::before { + content: '\E720'; +} + +.ms-Icon--Search::before { + content: '\E721'; +} + +.ms-Icon--Camera::before { + content: '\E722'; +} + +.ms-Icon--Attach::before { + content: '\E723'; +} + +.ms-Icon--Send::before { + content: '\E724'; +} + +.ms-Icon--FavoriteList::before { + content: '\E728'; +} + +.ms-Icon--PageSolid::before { + content: '\E729'; +} + +.ms-Icon--Forward::before { + content: '\E72A'; +} + +.ms-Icon--Back::before { + content: '\E72B'; +} + +.ms-Icon--Refresh::before { + content: '\E72C'; +} + +.ms-Icon--Share::before { + content: '\E72D'; +} + +.ms-Icon--Lock::before { + content: '\E72E'; +} + +.ms-Icon--EMI::before { + content: '\E731'; +} + +.ms-Icon--MiniLink::before { + content: '\E732'; +} + +.ms-Icon--Blocked::before { + content: '\E733'; +} + +.ms-Icon--FavoriteStar::before { + content: '\E734'; +} + +.ms-Icon--FavoriteStarFill::before { + content: '\E735'; +} + +.ms-Icon--ReadingMode::before { + content: '\E736'; +} + +.ms-Icon--Remove::before { + content: '\E738'; +} + +.ms-Icon--Checkbox::before { + content: '\E739'; +} + +.ms-Icon--CheckboxComposite::before { + content: '\E73A'; +} + +.ms-Icon--CheckboxIndeterminate::before { + content: '\E73C'; +} + +.ms-Icon--CheckMark::before { + content: '\E73E'; +} + +.ms-Icon--BackToWindow::before { + content: '\E73F'; +} + +.ms-Icon--FullScreen::before { + content: '\E740'; +} + +.ms-Icon--Print::before { + content: '\E749'; +} + +.ms-Icon--Up::before { + content: '\E74A'; +} + +.ms-Icon--Down::before { + content: '\E74B'; +} + +.ms-Icon--Delete::before { + content: '\E74D'; +} + +.ms-Icon--Save::before { + content: '\E74E'; +} + +.ms-Icon--Sad::before { + content: '\E757'; +} + +.ms-Icon--SIPMove::before { + content: '\E759'; +} + +.ms-Icon--EraseTool::before { + content: '\E75C'; +} + +.ms-Icon--GripperTool::before { + content: '\E75E'; +} + +.ms-Icon--Dialpad::before { + content: '\E75F'; +} + +.ms-Icon--PageLeft::before { + content: '\E760'; +} + +.ms-Icon--PageRight::before { + content: '\E761'; +} + +.ms-Icon--MultiSelect::before { + content: '\E762'; +} + +.ms-Icon--Play::before { + content: '\E768'; +} + +.ms-Icon--Pause::before { + content: '\E769'; +} + +.ms-Icon--ChevronLeft::before { + content: '\E76B'; +} + +.ms-Icon--ChevronRight::before { + content: '\E76C'; +} + +.ms-Icon--Emoji2::before { + content: '\E76E'; +} + +.ms-Icon--System::before { + content: '\E770'; +} + +.ms-Icon--Globe::before { + content: '\E774'; +} + +.ms-Icon--ContactInfo::before { + content: '\E779'; +} + +.ms-Icon--Unpin::before { + content: '\E77A'; +} + +.ms-Icon--Contact::before { + content: '\E77B'; +} + +.ms-Icon--Memo::before { + content: '\E77C'; +} + +.ms-Icon--WindowsLogo::before { + content: '\E782'; +} + +.ms-Icon--Error::before { + content: '\E783'; +} + +.ms-Icon--Unlock::before { + content: '\E785'; +} + +.ms-Icon--Calendar::before { + content: '\E787'; +} + +.ms-Icon--Megaphone::before { + content: '\E789'; +} + +.ms-Icon--AutoEnhanceOn::before { + content: '\E78D'; +} + +.ms-Icon--AutoEnhanceOff::before { + content: '\E78E'; +} + +.ms-Icon--Color::before { + content: '\E790'; +} + +.ms-Icon--SaveAs::before { + content: '\E792'; +} + +.ms-Icon--Light::before { + content: '\E793'; +} + +.ms-Icon--Filters::before { + content: '\E795'; +} + +.ms-Icon--Contrast::before { + content: '\E7A1'; +} + +.ms-Icon--Redo::before { + content: '\E7A6'; +} + +.ms-Icon--Undo::before { + content: '\E7A7'; +} + +.ms-Icon--Album::before { + content: '\E7AB'; +} + +.ms-Icon--Rotate::before { + content: '\E7AD'; +} + +.ms-Icon--PanoIndicator::before { + content: '\E7B0'; +} + +.ms-Icon--ThumbnailView::before { + content: '\E7B6'; +} + +.ms-Icon--Package::before { + content: '\E7B8'; +} + +.ms-Icon--Warning::before { + content: '\E7BA'; +} + +.ms-Icon--Financial::before { + content: '\E7BB'; +} + +.ms-Icon--ShoppingCart::before { + content: '\E7BF'; +} + +.ms-Icon--Train::before { + content: '\E7C0'; +} + +.ms-Icon--Flag::before { + content: '\E7C1'; +} + +.ms-Icon--Move::before { + content: '\E7C2'; +} + +.ms-Icon--Page::before { + content: '\E7C3'; +} + +.ms-Icon--TouchPointer::before { + content: '\E7C9'; +} + +.ms-Icon--Merge::before { + content: '\E7D5'; +} + +.ms-Icon--TurnRight::before { + content: '\E7DB'; +} + +.ms-Icon--Ferry::before { + content: '\E7E3'; +} + +.ms-Icon--Tab::before { + content: '\E7E9'; +} + +.ms-Icon--Admin::before { + content: '\E7EF'; +} + +.ms-Icon--TVMonitor::before { + content: '\E7F4'; +} + +.ms-Icon--Speakers::before { + content: '\E7F5'; +} + +.ms-Icon--Car::before { + content: '\E804'; +} + +.ms-Icon--EatDrink::before { + content: '\E807'; +} + +.ms-Icon--LocationCircle::before { + content: '\E80E'; +} + +.ms-Icon--Home::before { + content: '\E80F'; +} + +.ms-Icon--SwitcherStartEnd::before { + content: '\E810'; +} + +.ms-Icon--IncidentTriangle::before { + content: '\E814'; +} + +.ms-Icon--Touch::before { + content: '\E815'; +} + +.ms-Icon--MapDirections::before { + content: '\E816'; +} + +.ms-Icon--History::before { + content: '\E81C'; +} + +.ms-Icon--Location::before { + content: '\E81D'; +} + +.ms-Icon--Work::before { + content: '\E821'; +} + +.ms-Icon--Recent::before { + content: '\E823'; +} + +.ms-Icon--Hotel::before { + content: '\E824'; +} + +.ms-Icon--LocationDot::before { + content: '\E827'; +} + +.ms-Icon--News::before { + content: '\E900'; +} + +.ms-Icon--Chat::before { + content: '\E901'; +} + +.ms-Icon--Group::before { + content: '\E902'; +} + +.ms-Icon--View::before { + content: '\E890'; +} + +.ms-Icon--Clear::before { + content: '\E894'; +} + +.ms-Icon--Sync::before { + content: '\E895'; +} + +.ms-Icon--Download::before { + content: '\E896'; +} + +.ms-Icon--Help::before { + content: '\E897'; +} + +.ms-Icon--Upload::before { + content: '\E898'; +} + +.ms-Icon--Emoji::before { + content: '\E899'; +} + +.ms-Icon--MailForward::before { + content: '\E89C'; +} + +.ms-Icon--ClosePane::before { + content: '\E89F'; +} + +.ms-Icon--OpenPane::before { + content: '\E8A0'; +} + +.ms-Icon--PreviewLink::before { + content: '\E8A1'; +} + +.ms-Icon--ZoomIn::before { + content: '\E8A3'; +} + +.ms-Icon--Bookmarks::before { + content: '\E8A4'; +} + +.ms-Icon--Document::before { + content: '\E8A5'; +} + +.ms-Icon--ProtectedDocument::before { + content: '\E8A6'; +} + +.ms-Icon--OpenInNewWindow::before { + content: '\E8A7'; +} + +.ms-Icon--MailFill::before { + content: '\E8A8'; +} + +.ms-Icon--ViewAll::before { + content: '\E8A9'; +} + +.ms-Icon--Switch::before { + content: '\E8AB'; +} + +.ms-Icon--Rename::before { + content: '\E8AC'; +} + +.ms-Icon--Folder::before { + content: '\E8B7'; +} + +.ms-Icon--Picture::before { + content: '\E8B9'; +} + +.ms-Icon--ShowResults::before { + content: '\E8BC'; +} + +.ms-Icon--Message::before { + content: '\E8BD'; +} + +.ms-Icon--CalendarDay::before { + content: '\E8BF'; +} + +.ms-Icon--CalendarWeek::before { + content: '\E8C0'; +} + +.ms-Icon--MailReplyAll::before { + content: '\E8C2'; +} + +.ms-Icon--Read::before { + content: '\E8C3'; +} + +.ms-Icon--PaymentCard::before { + content: '\E8C7'; +} + +.ms-Icon--Copy::before { + content: '\E8C8'; +} + +.ms-Icon--Important::before { + content: '\E8C9'; +} + +.ms-Icon--MailReply::before { + content: '\E8CA'; +} + +.ms-Icon--Sort::before { + content: '\E8CB'; +} + +.ms-Icon--GotoToday::before { + content: '\E8D1'; +} + +.ms-Icon--Font::before { + content: '\E8D2'; +} + +.ms-Icon--FontColor::before { + content: '\E8D3'; +} + +.ms-Icon--FolderFill::before { + content: '\E8D5'; +} + +.ms-Icon--Permissions::before { + content: '\E8D7'; +} + +.ms-Icon--DisableUpdates::before { + content: '\E8D8'; +} + +.ms-Icon--Unfavorite::before { + content: '\E8D9'; +} + +.ms-Icon--Italic::before { + content: '\E8DB'; +} + +.ms-Icon--Underline::before { + content: '\E8DC'; +} + +.ms-Icon--Bold::before { + content: '\E8DD'; +} + +.ms-Icon--MoveToFolder::before { + content: '\E8DE'; +} + +.ms-Icon--Dislike::before { + content: '\E8E0'; +} + +.ms-Icon--Like::before { + content: '\E8E1'; +} + +.ms-Icon--AlignRight::before { + content: '\E8E2'; +} + +.ms-Icon--AlignCenter::before { + content: '\E8E3'; +} + +.ms-Icon--AlignLeft::before { + content: '\E8E4'; +} + +.ms-Icon--OpenFile::before { + content: '\E8E5'; +} + +.ms-Icon--FontDecrease::before { + content: '\E8E7'; +} + +.ms-Icon--FontIncrease::before { + content: '\E8E8'; +} + +.ms-Icon--FontSize::before { + content: '\E8E9'; +} + +.ms-Icon--CellPhone::before { + content: '\E8EA'; +} + +.ms-Icon--Tag::before { + content: '\E8EC'; +} + +.ms-Icon--Library::before { + content: '\E8F1'; +} + +.ms-Icon--PostUpdate::before { + content: '\E8F3'; +} + +.ms-Icon--NewFolder::before { + content: '\E8F4'; +} + +.ms-Icon--CalendarReply::before { + content: '\E8F5'; +} + +.ms-Icon--UnsyncFolder::before { + content: '\E8F6'; +} + +.ms-Icon--SyncFolder::before { + content: '\E8F7'; +} + +.ms-Icon--BlockContact::before { + content: '\E8F8'; +} + +.ms-Icon--AddFriend::before { + content: '\E8FA'; +} + +.ms-Icon--BulletedList::before { + content: '\E8FD'; +} + +.ms-Icon--Preview::before { + content: '\E8FF'; +} + +.ms-Icon--DockLeft::before { + content: '\E90C'; +} + +.ms-Icon--DockRight::before { + content: '\E90D'; +} + +.ms-Icon--Repair::before { + content: '\E90F'; +} + +.ms-Icon--Accounts::before { + content: '\E910'; +} + +.ms-Icon--RadioBullet::before { + content: '\E915'; +} + +.ms-Icon--Stopwatch::before { + content: '\E916'; +} + +.ms-Icon--Clock::before { + content: '\E917'; +} + +.ms-Icon--AlarmClock::before { + content: '\E919'; +} + +.ms-Icon--Hospital::before { + content: '\E91D'; +} + +.ms-Icon--Timer::before { + content: '\E91E'; +} + +.ms-Icon--FullCircleMask::before { + content: '\E91F'; +} + +.ms-Icon--LocationFill::before { + content: '\E920'; +} + +.ms-Icon--ChromeMinimize::before { + content: '\E921'; +} + +.ms-Icon--Annotation::before { + content: '\E924'; +} + +.ms-Icon--ChromeClose::before { + content: '\E8BB'; +} + +.ms-Icon--Accept::before { + content: '\E8FB'; +} + +.ms-Icon--Fingerprint::before { + content: '\E928'; +} + +.ms-Icon--Handwriting::before { + content: '\E929'; +} + +.ms-Icon--StackIndicator::before { + content: '\E7FF'; +} + +.ms-Icon--Completed::before { + content: '\E930'; +} + +.ms-Icon--Label::before { + content: '\E932'; +} + +.ms-Icon--FlickDown::before { + content: '\E935'; +} + +.ms-Icon--FlickUp::before { + content: '\E936'; +} + +.ms-Icon--FlickLeft::before { + content: '\E937'; +} + +.ms-Icon--FlickRight::before { + content: '\E938'; +} + +.ms-Icon--MusicInCollection::before { + content: '\E940'; +} + +.ms-Icon--OneDrive::before { + content: '\E941'; +} + +.ms-Icon--CompassNW::before { + content: '\E942'; +} + +.ms-Icon--Code::before { + content: '\E943'; +} + +.ms-Icon--LightningBolt::before { + content: '\E945'; +} + +.ms-Icon--Info::before { + content: '\E946'; +} + +.ms-Icon--CalculatorAddition::before { + content: '\E948'; +} + +.ms-Icon--CalculatorSubtract::before { + content: '\E949'; +} + +.ms-Icon--PrintfaxPrinterFile::before { + content: '\E956'; +} + +.ms-Icon--Health::before { + content: '\E95E'; +} + +.ms-Icon--ChevronUpSmall::before { + content: '\E96D'; +} + +.ms-Icon--ChevronDownSmall::before { + content: '\E96E'; +} + +.ms-Icon--ChevronLeftSmall::before { + content: '\E96F'; +} + +.ms-Icon--ChevronRightSmall::before { + content: '\E970'; +} + +.ms-Icon--ChevronUpMed::before { + content: '\E971'; +} + +.ms-Icon--ChevronDownMed::before { + content: '\E972'; +} + +.ms-Icon--ChevronLeftMed::before { + content: '\E973'; +} + +.ms-Icon--ChevronRightMed::before { + content: '\E974'; +} + +.ms-Icon--Dictionary::before { + content: '\E82D'; +} + +.ms-Icon--ChromeBack::before { + content: '\E830'; +} + +.ms-Icon--PC1::before { + content: '\E977'; +} + +.ms-Icon--PresenceChickletVideo::before { + content: '\E979'; +} + +.ms-Icon--Reply::before { + content: '\E97A'; +} + +.ms-Icon--DoubleChevronLeftMed::before { + content: '\E991'; +} + +.ms-Icon--Volume0::before { + content: '\E992'; +} + +.ms-Icon--Volume1::before { + content: '\E993'; +} + +.ms-Icon--Volume2::before { + content: '\E994'; +} + +.ms-Icon--Volume3::before { + content: '\E995'; +} + +.ms-Icon--CaretHollow::before { + content: '\E817'; +} + +.ms-Icon--CaretSolid::before { + content: '\E818'; +} + +.ms-Icon--Pinned::before { + content: '\E840'; +} + +.ms-Icon--PinnedFill::before { + content: '\E842'; +} + +.ms-Icon--Chart::before { + content: '\E999'; +} + +.ms-Icon--BidiLtr::before { + content: '\E9AA'; +} + +.ms-Icon--BidiRtl::before { + content: '\E9AB'; +} + +.ms-Icon--RevToggleKey::before { + content: '\E845'; +} + +.ms-Icon--RightDoubleQuote::before { + content: '\E9B1'; +} + +.ms-Icon--Sunny::before { + content: '\E9BD'; +} + +.ms-Icon--CloudWeather::before { + content: '\E9BE'; +} + +.ms-Icon--Cloudy::before { + content: '\E9BF'; +} + +.ms-Icon--PartlyCloudyDay::before { + content: '\E9C0'; +} + +.ms-Icon--PartlyCloudyNight::before { + content: '\E9C1'; +} + +.ms-Icon--ClearNight::before { + content: '\E9C2'; +} + +.ms-Icon--RainShowersDay::before { + content: '\E9C3'; +} + +.ms-Icon--Rain::before { + content: '\E9C4'; +} + +.ms-Icon--Thunderstorms::before { + content: '\E9C6'; +} + +.ms-Icon--RainSnow::before { + content: '\E9C7'; +} + +.ms-Icon--Snow::before { + content: '\EB46'; +} + +.ms-Icon--BlowingSnow::before { + content: '\E9C9'; +} + +.ms-Icon--Frigid::before { + content: '\E9CA'; +} + +.ms-Icon--Fog::before { + content: '\E9CB'; +} + +.ms-Icon--Squalls::before { + content: '\E9CC'; +} + +.ms-Icon--Duststorm::before { + content: '\E9CD'; +} + +.ms-Icon--Precipitation::before { + content: '\E9CF'; +} + +.ms-Icon--Ringer::before { + content: '\EA8F'; +} + +.ms-Icon--PDF::before { + content: '\EA90'; +} + +.ms-Icon--SortLines::before { + content: '\E9D0'; +} + +.ms-Icon--Ribbon::before { + content: '\E9D1'; +} + +.ms-Icon--CheckList::before { + content: '\E9D5'; +} + +.ms-Icon--Generate::before { + content: '\E9DA'; +} + +.ms-Icon--Equalizer::before { + content: '\E9E9'; +} + +.ms-Icon--BarChartHorizontal::before { + content: '\E9EB'; +} + +.ms-Icon--Freezing::before { + content: '\E9EF'; +} + +.ms-Icon--SnowShowerDay::before { + content: '\E9FD'; +} + +.ms-Icon--HailDay::before { + content: '\EA00'; +} + +.ms-Icon--WorkFlow::before { + content: '\EA01'; +} + +.ms-Icon--StoreLogoMed::before { + content: '\EA04'; +} + +.ms-Icon--RainShowersNight::before { + content: '\EA0F'; +} + +.ms-Icon--SnowShowerNight::before { + content: '\EA11'; +} + +.ms-Icon--HailNight::before { + content: '\EA13'; +} + +.ms-Icon--Info2::before { + content: '\EA1F'; +} + +.ms-Icon--StoreLogo::before { + content: '\EA96'; +} + +.ms-Icon--MultiSelectMirrored::before { + content: '\EA98'; +} + +.ms-Icon--Broom::before { + content: '\EA99'; +} + +.ms-Icon--MusicInCollectionFill::before { + content: '\EA36'; +} + +.ms-Icon--List::before { + content: '\EA37'; +} + +.ms-Icon--Asterisk::before { + content: '\EA38'; +} + +.ms-Icon--ErrorBadge::before { + content: '\EA39'; +} + +.ms-Icon--CircleRing::before { + content: '\EA3A'; +} + +.ms-Icon--CircleFill::before { + content: '\EA3B'; +} + +.ms-Icon--BookmarksMirrored::before { + content: '\EA41'; +} + +.ms-Icon--BulletedListMirrored::before { + content: '\EA42'; +} + +.ms-Icon--CaretHollowMirrored::before { + content: '\EA45'; +} + +.ms-Icon--CaretSolidMirrored::before { + content: '\EA46'; +} + +.ms-Icon--ChromeBackMirrored::before { + content: '\EA47'; +} + +.ms-Icon--ClosePaneMirrored::before { + content: '\EA49'; +} + +.ms-Icon--DockLeftMirrored::before { + content: '\EA4C'; +} + +.ms-Icon--DoubleChevronLeftMedMirrored::before { + content: '\EA4D'; +} + +.ms-Icon--HelpMirrored::before { + content: '\EA51'; +} + +.ms-Icon--ListMirrored::before { + content: '\EA55'; +} + +.ms-Icon--MailForwardMirrored::before { + content: '\EA56'; +} + +.ms-Icon--MailReplyMirrored::before { + content: '\EA57'; +} + +.ms-Icon--MailReplyAllMirrored::before { + content: '\EA58'; +} + +.ms-Icon--OpenPaneMirrored::before { + content: '\EA5B'; +} + +.ms-Icon--SendMirrored::before { + content: '\EA63'; +} + +.ms-Icon--ShowResultsMirrored::before { + content: '\EA65'; +} + +.ms-Icon--ThumbnailViewMirrored::before { + content: '\EA67'; +} + +.ms-Icon--Lightbulb::before { + content: '\EA80'; +} + +.ms-Icon--StatusTriangle::before { + content: '\EA82'; +} + +.ms-Icon--VolumeDisabled::before { + content: '\EA85'; +} + +.ms-Icon--Puzzle::before { + content: '\EA86'; +} + +.ms-Icon--EmojiNeutral::before { + content: '\EA87'; +} + +.ms-Icon--EmojiDisappointed::before { + content: '\EA88'; +} + +.ms-Icon--HomeSolid::before { + content: '\EA8A'; +} + +.ms-Icon--Cocktails::before { + content: '\EA9D'; +} + +.ms-Icon--Articles::before { + content: '\EAC1'; +} + +.ms-Icon--Cycling::before { + content: '\EAC7'; +} + +.ms-Icon--DietPlanNotebook::before { + content: '\EAC8'; +} + +.ms-Icon--Pill::before { + content: '\EACB'; +} + +.ms-Icon--Running::before { + content: '\EADA'; +} + +.ms-Icon--Weights::before { + content: '\EADB'; +} + +.ms-Icon--BarChart4::before { + content: '\EAE7'; +} + +.ms-Icon--CirclePlus::before { + content: '\EAEE'; +} + +.ms-Icon--Coffee::before { + content: '\EAEF'; +} + +.ms-Icon--Cotton::before { + content: '\EAF3'; +} + +.ms-Icon--Market::before { + content: '\EAFC'; +} + +.ms-Icon--Money::before { + content: '\EAFD'; +} + +.ms-Icon--PieDouble::before { + content: '\EB04'; +} + +.ms-Icon--RemoveFilter::before { + content: '\EB08'; +} + +.ms-Icon--StockDown::before { + content: '\EB0F'; +} + +.ms-Icon--StockUp::before { + content: '\EB11'; +} + +.ms-Icon--Cricket::before { + content: '\EB1E'; +} + +.ms-Icon--Golf::before { + content: '\EB1F'; +} + +.ms-Icon--Baseball::before { + content: '\EB20'; +} + +.ms-Icon--Soccer::before { + content: '\EB21'; +} + +.ms-Icon--MoreSports::before { + content: '\EB22'; +} + +.ms-Icon--AutoRacing::before { + content: '\EB24'; +} + +.ms-Icon--CollegeHoops::before { + content: '\EB25'; +} + +.ms-Icon--CollegeFootball::before { + content: '\EB26'; +} + +.ms-Icon--ProFootball::before { + content: '\EB27'; +} + +.ms-Icon--ProHockey::before { + content: '\EB28'; +} + +.ms-Icon--Rugby::before { + content: '\EB2D'; +} + +.ms-Icon--Tennis::before { + content: '\EB33'; +} + +.ms-Icon--Arrivals::before { + content: '\EB34'; +} + +.ms-Icon--Design::before { + content: '\EB3C'; +} + +.ms-Icon--Website::before { + content: '\EB41'; +} + +.ms-Icon--Drop::before { + content: '\EB42'; +} + +.ms-Icon--Snow::before { + content: '\EB46'; +} + +.ms-Icon--BusSolid::before { + content: '\EB47'; +} + +.ms-Icon--FerrySolid::before { + content: '\EB48'; +} + +.ms-Icon--TrainSolid::before { + content: '\EB4D'; +} + +.ms-Icon--Heart::before { + content: '\EB51'; +} + +.ms-Icon--HeartFill::before { + content: '\EB52'; +} + +.ms-Icon--Ticket::before { + content: '\EB54'; +} + +.ms-Icon--AzureLogo::before { + content: '\EB6A'; +} + +.ms-Icon--BingLogo::before { + content: '\EB6B'; +} + +.ms-Icon--MSNLogo::before { + content: '\EB6C'; +} + +.ms-Icon--OutlookLogo::before { + content: '\EB6D'; +} + +.ms-Icon--OfficeLogo::before { + content: '\EB6E'; +} + +.ms-Icon--SkypeLogo::before { + content: '\EB6F'; +} + +.ms-Icon--Door::before { + content: '\EB75'; +} + +.ms-Icon--EditMirrored::before { + content: '\EB7E'; +} + +.ms-Icon--GiftCard::before { + content: '\EB8E'; +} + +.ms-Icon--DoubleBookmark::before { + content: '\EB8F'; +} + +.ms-Icon--StatusErrorFull::before { + content: '\EB90'; +} + +.ms-Icon--Certificate::before { + content: '\EB95'; +} + +.ms-Icon--Photo2::before { + content: '\EB9F'; +} + +.ms-Icon--CloudDownload::before { + content: '\EBD3'; +} + +.ms-Icon--WindDirection::before { + content: '\EBE6'; +} + +.ms-Icon--Family::before { + content: '\EBDA'; +} + +.ms-Icon--CSS::before { + content: '\EBEF'; +} + +.ms-Icon--JS::before { + content: '\EBF0'; +} + +.ms-Icon--ReminderGroup::before { + content: '\EBF8'; +} + +.ms-Icon--Section::before { + content: '\EC0C'; +} + +.ms-Icon--OneNoteLogo::before { + content: '\EC0D'; +} + +.ms-Icon--ToggleFilled::before { + content: '\EC11'; +} + +.ms-Icon--ToggleBorder::before { + content: '\EC12'; +} + +.ms-Icon--SliderThumb::before { + content: '\EC13'; +} + +.ms-Icon--ToggleThumb::before { + content: '\EC14'; +} + +.ms-Icon--Documentation::before { + content: '\EC17'; +} + +.ms-Icon--Badge::before { + content: '\EC1B'; +} + +.ms-Icon--Giftbox::before { + content: '\EC1F'; +} + +.ms-Icon--ExcelLogo::before { + content: '\EC28'; +} + +.ms-Icon--WordLogo::before { + content: '\EC29'; +} + +.ms-Icon--PowerPointLogo::before { + content: '\EC2A'; +} + +.ms-Icon--Cafe::before { + content: '\EC32'; +} + +.ms-Icon--SpeedHigh::before { + content: '\EC4A'; +} + +.ms-Icon--MusicNote::before { + content: '\EC4F'; +} + +.ms-Icon--EdgeLogo::before { + content: '\EC60'; +} + +.ms-Icon--CompletedSolid::before { + content: '\EC61'; +} + +.ms-Icon--AlbumRemove::before { + content: '\EC62'; +} + +.ms-Icon--MessageFill::before { + content: '\EC70'; +} + +.ms-Icon--TabletSelected::before { + content: '\EC74'; +} + +.ms-Icon--MobileSelected::before { + content: '\EC75'; +} + +.ms-Icon--LaptopSelected::before { + content: '\EC76'; +} + +.ms-Icon--TVMonitorSelected::before { + content: '\EC77'; +} + +.ms-Icon--DeveloperTools::before { + content: '\EC7A'; +} + +.ms-Icon--InsertTextBox::before { + content: '\EC7D'; +} + +.ms-Icon--LowerBrightness::before { + content: '\EC8A'; +} + +.ms-Icon--CloudUpload::before { + content: '\EC8E'; +} + +.ms-Icon--DateTime::before { + content: '\EC92'; +} + +.ms-Icon--Event::before { + content: '\ECA3'; +} + +.ms-Icon--Cake::before { + content: '\ECA4'; +} + +.ms-Icon--Tiles::before { + content: '\ECA5'; +} + +.ms-Icon--Org::before { + content: '\ECA6'; +} + +.ms-Icon--PartyLeader::before { + content: '\ECA7'; +} + +.ms-Icon--DRM::before { + content: '\ECA8'; +} + +.ms-Icon--CloudAdd::before { + content: '\ECA9'; +} + +.ms-Icon--AppIconDefault::before { + content: '\ECAA'; +} + +.ms-Icon--Photo2Add::before { + content: '\ECAB'; +} + +.ms-Icon--Photo2Remove::before { + content: '\ECAC'; +} + +.ms-Icon--POI::before { + content: '\ECAF'; +} + +.ms-Icon--FacebookLogo::before { + content: '\ECB3'; +} + +.ms-Icon--AddTo::before { + content: '\ECC8'; +} + +.ms-Icon--RadioBtnOn::before { + content: '\ECCB'; +} + +.ms-Icon--Embed::before { + content: '\ECCE'; +} + +.ms-Icon--VideoSolid::before { + content: '\EA0C'; +} + +.ms-Icon--Teamwork::before { + content: '\EA12'; +} + +.ms-Icon--PeopleAdd::before { + content: '\EA15'; +} + +.ms-Icon--Glasses::before { + content: '\EA16'; +} + +.ms-Icon--DateTime2::before { + content: '\EA17'; +} + +.ms-Icon--Shield::before { + content: '\EA18'; +} + +.ms-Icon--Header1::before { + content: '\EA19'; +} + +.ms-Icon--PageAdd::before { + content: '\EA1A'; +} + +.ms-Icon--NumberedList::before { + content: '\EA1C'; +} + +.ms-Icon--PowerBILogo::before { + content: '\EA1E'; +} + +.ms-Icon--Product::before { + content: '\ECDC'; +} + +.ms-Icon--Blocked2::before { + content: '\ECE4'; +} + +.ms-Icon--FangBody::before { + content: '\ECEB'; +} + +.ms-Icon--Glimmer::before { + content: '\ECF4'; +} + +.ms-Icon--ChatInviteFriend::before { + content: '\ECFE'; +} + +.ms-Icon--SharepointLogo::before { + content: '\ED18'; +} + +.ms-Icon--YammerLogo::before { + content: '\ED19'; +} + +.ms-Icon--ReturnToSession::before { + content: '\ED24'; +} + +.ms-Icon--OpenFolderHorizontal::before { + content: '\ED25'; +} + +.ms-Icon--CalendarMirrored::before { + content: '\ED28'; +} + +.ms-Icon--SwayLogo::before { + content: '\ED29'; +} + +.ms-Icon--OutOfOffice::before { + content: '\ED34'; +} + +.ms-Icon--Trophy::before { + content: '\ED3F'; +} + +.ms-Icon--ReopenPages::before { + content: '\ED50'; +} + +.ms-Icon--AADLogo::before { + content: '\ED68'; +} + +.ms-Icon--AccessLogo::before { + content: '\ED69'; +} + +.ms-Icon--AdminALogo::before { + content: '\ED6A'; +} + +.ms-Icon--AdminCLogo::before { + content: '\ED6B'; +} + +.ms-Icon--AdminDLogo::before { + content: '\ED6C'; +} + +.ms-Icon--AdminELogo::before { + content: '\ED6D'; +} + +.ms-Icon--AdminLLogo::before { + content: '\ED6E'; +} + +.ms-Icon--AdminMLogo::before { + content: '\ED6F'; +} + +.ms-Icon--AdminOLogo::before { + content: '\ED70'; +} + +.ms-Icon--AdminPLogo::before { + content: '\ED71'; +} + +.ms-Icon--AdminSLogo::before { + content: '\ED72'; +} + +.ms-Icon--AdminYLogo::before { + content: '\ED73'; +} + +.ms-Icon--AlchemyLogo::before { + content: '\ED74'; +} + +.ms-Icon--BoxLogo::before { + content: '\ED75'; +} + +.ms-Icon--DelveLogo::before { + content: '\ED76'; +} + +.ms-Icon--DropboxLogo::before { + content: '\ED77'; +} + +.ms-Icon--ExchangeLogo::before { + content: '\ED78'; +} + +.ms-Icon--LyncLogo::before { + content: '\ED79'; +} + +.ms-Icon--OfficeVideoLogo::before { + content: '\ED7A'; +} + +.ms-Icon--ParatureLogo::before { + content: '\ED7B'; +} + +.ms-Icon--SocialListeningLogo::before { + content: '\ED7C'; +} + +.ms-Icon--VisioLogo::before { + content: '\ED7D'; +} + +.ms-Icon--Balloons::before { + content: '\ED7E'; +} + +.ms-Icon--Cat::before { + content: '\ED7F'; +} + +.ms-Icon--MailAlert::before { + content: '\ED80'; +} + +.ms-Icon--MailCheck::before { + content: '\ED81'; +} + +.ms-Icon--MailLowImportance::before { + content: '\ED82'; +} + +.ms-Icon--MailPause::before { + content: '\ED83'; +} + +.ms-Icon--MailRepeat::before { + content: '\ED84'; +} + +.ms-Icon--SecurityGroup::before { + content: '\ED85'; +} + +.ms-Icon--Table::before { + content: '\ED86'; +} + +.ms-Icon--VoicemailForward::before { + content: '\ED87'; +} + +.ms-Icon--VoicemailReply::before { + content: '\ED88'; +} + +.ms-Icon--Waffle::before { + content: '\ED89'; +} + +.ms-Icon--RemoveEvent::before { + content: '\ED8A'; +} + +.ms-Icon--EventInfo::before { + content: '\ED8B'; +} + +.ms-Icon--ForwardEvent::before { + content: '\ED8C'; +} + +.ms-Icon--WipePhone::before { + content: '\ED8D'; +} + +.ms-Icon--AddOnlineMeeting::before { + content: '\ED8E'; +} + +.ms-Icon--JoinOnlineMeeting::before { + content: '\ED8F'; +} + +.ms-Icon--RemoveLink::before { + content: '\ED90'; +} + +.ms-Icon--PeopleBlock::before { + content: '\ED91'; +} + +.ms-Icon--PeopleRepeat::before { + content: '\ED92'; +} + +.ms-Icon--PeopleAlert::before { + content: '\ED93'; +} + +.ms-Icon--PeoplePause::before { + content: '\ED94'; +} + +.ms-Icon--TransferCall::before { + content: '\ED95'; +} + +.ms-Icon--AddPhone::before { + content: '\ED96'; +} + +.ms-Icon--UnknownCall::before { + content: '\ED97'; +} + +.ms-Icon--NoteReply::before { + content: '\ED98'; +} + +.ms-Icon--NoteForward::before { + content: '\ED99'; +} + +.ms-Icon--NotePinned::before { + content: '\ED9A'; +} + +.ms-Icon--RemoveOccurrence::before { + content: '\ED9B'; +} + +.ms-Icon--Timeline::before { + content: '\ED9C'; +} + +.ms-Icon--EditNote::before { + content: '\ED9D'; +} + +.ms-Icon--CircleHalfFull::before { + content: '\ED9E'; +} + +.ms-Icon--Room::before { + content: '\ED9F'; +} + +.ms-Icon--Unsubscribe::before { + content: '\EDA0'; +} + +.ms-Icon--Subscribe::before { + content: '\EDA1'; +} + +.ms-Icon--RecurringTask::before { + content: '\EDB2'; +} + +.ms-Icon--TaskManager::before { + content: '\EDB7'; +} + +.ms-Icon--TaskManagerMirrored::before { + content: '\EDB8'; +} + +.ms-Icon--Combine::before { + content: '\EDBB'; +} + +.ms-Icon--Split::before { + content: '\EDBC'; +} + +.ms-Icon--DoubleChevronUp::before { + content: '\EDBD'; +} + +.ms-Icon--DoubleChevronLeft::before { + content: '\EDBE'; +} + +.ms-Icon--DoubleChevronRight::before { + content: '\EDBF'; +} + +.ms-Icon--Ascending::before { + content: '\EDC0'; +} + +.ms-Icon--Descending::before { + content: '\EDC1'; +} + +.ms-Icon--TextBox::before { + content: '\EDC2'; +} + +.ms-Icon--TextField::before { + content: '\EDC3'; +} + +.ms-Icon--NumberField::before { + content: '\EDC4'; +} + +.ms-Icon--Dropdown::before { + content: '\EDC5'; +} + +.ms-Icon--BookingsLogo::before { + content: '\EDC7'; +} + +.ms-Icon--ClassNotebookLogo::before { + content: '\EDC8'; +} + +.ms-Icon--CollabsDBLogo::before { + content: '\EDC9'; +} + +.ms-Icon--DelveAnalyticsLogo::before { + content: '\EDCA'; +} + +.ms-Icon--DocsLogo::before { + content: '\EDCB'; +} + +.ms-Icon--DynamicsCRMLogo::before { + content: '\EDCC'; +} + +.ms-Icon--DynamicSMBLogo::before { + content: '\EDCD'; +} + +.ms-Icon--OfficeAssistantLogo::before { + content: '\EDCE'; +} + +.ms-Icon--OfficeStoreLogo::before { + content: '\EDCF'; +} + +.ms-Icon--OneNoteEduLogo::before { + content: '\EDD0'; +} + +.ms-Icon--Planner::before { + content: '\EDD1'; +} + +.ms-Icon--PowerApps::before { + content: '\EDD2'; +} + +.ms-Icon--Suitcase::before { + content: '\EDD3'; +} + +.ms-Icon--ProjectLogo::before { + content: '\EDD4'; +} + +.ms-Icon--CaretLeft8::before { + content: '\EDD5'; +} + +.ms-Icon--CaretRight8::before { + content: '\EDD6'; +} + +.ms-Icon--CaretUp8::before { + content: '\EDD7'; +} + +.ms-Icon--CaretDown8::before { + content: '\EDD8'; +} + +.ms-Icon--CaretLeftSolid8::before { + content: '\EDD9'; +} + +.ms-Icon--CarotRightSolid8::before { + content: '\EDDA'; +} + +.ms-Icon--CaretUpSolid8::before { + content: '\EDDB'; +} + +.ms-Icon--CaretDownSolid8::before { + content: '\EDDC'; +} + +.ms-Icon--ClearFormatting::before { + content: '\EDDD'; +} + +.ms-Icon--Superscript::before { + content: '\EDDE'; +} + +.ms-Icon--Subscript::before { + content: '\EDDF'; +} + +.ms-Icon--Strikethrough::before { + content: '\EDE0'; +} + +.ms-Icon--SingleBookmark::before { + content: '\EDFF'; +} + +.ms-Icon--DoubleChevronDown::before { + content: '\EE04'; +} + +.ms-Icon--ReplyAll::before { + content: '\EE0A'; +} + +.ms-Icon--GoogleDriveLogo::before { + content: '\EE0B'; +} + +.ms-Icon--Questionnaire::before { + content: '\EE19'; +} + +.ms-Icon--ReplyMirrored::before { + content: '\EE35'; +} + +.ms-Icon--ReplyAllMirrored::before { + content: '\EE36'; +} + +.ms-Icon--AddGroup::before { + content: '\EE3D'; +} + +.ms-Icon--QuestionnaireMirrored::before { + content: '\EE4B'; +} + +.ms-Icon--TemporaryUser::before { + content: '\EE58'; +} + +.ms-Icon--GroupedDescending::before { + content: '\EE66'; +} + +.ms-Icon--GroupedAscending::before { + content: '\EE67'; +} + +.ms-Icon--SortUp::before { + content: '\EE68'; +} + +.ms-Icon--SortDown::before { + content: '\EE69'; +} + +.ms-Icon--AwayStatus::before { + content: '\EE6A'; +} + +.ms-Icon--SyncToPC::before { + content: '\EE6E'; +} + +.ms-Icon--AustralianRules::before { + content: '\EE70'; +} + +.ms-Icon--DateTimeMirrored::before { + content: '\EE93'; +} + +.ms-Icon--DoubleChevronUp12::before { + content: '\EE96'; +} + +.ms-Icon--DoubleChevronDown12::before { + content: '\EE97'; +} + +.ms-Icon--DoubleChevronLeft12::before { + content: '\EE98'; +} + +.ms-Icon--DoubleChevronRight12::before { + content: '\EE99'; +} + +.ms-Icon--CalendarAgenda::before { + content: '\EE9A'; +} + +.ms-Icon--AddEvent::before { + content: '\EEB5'; +} + +.ms-Icon--AssetLibrary::before { + content: '\EEB6'; +} + +.ms-Icon--DataConnectionLibrary::before { + content: '\EEB7'; +} + +.ms-Icon--DocLibrary::before { + content: '\EEB8'; +} + +.ms-Icon--FormLibrary::before { + content: '\EEB9'; +} + +.ms-Icon--FormLibraryMirrored::before { + content: '\EEBA'; +} + +.ms-Icon--ReportLibrary::before { + content: '\EEBB'; +} + +.ms-Icon--ReportLibraryMirrored::before { + content: '\EEBC'; +} + +.ms-Icon--ContactCard::before { + content: '\EEBD'; +} + +.ms-Icon--CustomList::before { + content: '\EEBE'; +} + +.ms-Icon--CustomListMirrored::before { + content: '\EEBF'; +} + +.ms-Icon--IssueTracking::before { + content: '\EEC0'; +} + +.ms-Icon--IssueTrackingMirrored::before { + content: '\EEC1'; +} + +.ms-Icon--PictureLibrary::before { + content: '\EEC2'; +} + +.ms-Icon--AppForOfficeLogo::before { + content: '\EEC7'; +} + +.ms-Icon--OfflineOneDriveParachute::before { + content: '\EEC8'; +} + +.ms-Icon--OfflineOneDriveParachuteDisabled::before { + content: '\EEC9'; +} + +.ms-Icon--LargeGrid::before { + content: '\EECB'; +} + +.ms-Icon--TriangleSolidUp12::before { + content: '\EECC'; +} + +.ms-Icon--TriangleSolidDown12::before { + content: '\EECD'; +} + +.ms-Icon--TriangleSolidLeft12::before { + content: '\EECE'; +} + +.ms-Icon--TriangleSolidRight12::before { + content: '\EECF'; +} + +.ms-Icon--TriangleUp12::before { + content: '\EED0'; +} + +.ms-Icon--TriangleDown12::before { + content: '\EED1'; +} + +.ms-Icon--TriangleLeft12::before { + content: '\EED2'; +} + +.ms-Icon--TriangleRight12::before { + content: '\EED3'; +} + +.ms-Icon--ArrowUpRight8::before { + content: '\EED4'; +} + +.ms-Icon--ArrowDownRight8::before { + content: '\EED5'; +} + +.ms-Icon--DocumentSet::before { + content: '\EED6'; +} + +.ms-Icon--DelveAnalytics::before { + content: '\EEEE'; +} + +.ms-Icon--ArrowUpRightMirrored8::before { + content: '\EEEF'; +} + +.ms-Icon--ArrowDownRightMirrored8::before { + content: '\EEF0'; +} + +.ms-Icon--OneDriveAdd::before { + content: '\EF32'; +} + +.ms-Icon--Header2::before { + content: '\EF36'; +} + +.ms-Icon--Header3::before { + content: '\EF37'; +} + +.ms-Icon--Header4::before { + content: '\EF38'; +} + +.ms-Icon--MarketDown::before { + content: '\EF42'; +} + +.ms-Icon--CalendarWorkWeek::before { + content: '\EF51'; +} + +.ms-Icon--SidePanel::before { + content: '\EF52'; +} + +.ms-Icon--GlobeFavorite::before { + content: '\EF53'; +} + +.ms-Icon--CaretTopLeftSolid8::before { + content: '\EF54'; +} + +.ms-Icon--CaretTopRightSolid8::before { + content: '\EF55'; +} + +.ms-Icon--ViewAll2::before { + content: '\EF56'; +} + +.ms-Icon--DocumentReply::before { + content: '\EF57'; +} + +.ms-Icon--PlayerSettings::before { + content: '\EF58'; +} + +.ms-Icon--ReceiptForward::before { + content: '\EF59'; +} + +.ms-Icon--ReceiptReply::before { + content: '\EF5A'; +} + +.ms-Icon--ReceiptCheck::before { + content: '\EF5B'; +} + +.ms-Icon--Fax::before { + content: '\EF5C'; +} + +.ms-Icon--RecurringEvent::before { + content: '\EF5D'; +} + +.ms-Icon--ReplyAlt::before { + content: '\EF5E'; +} + +.ms-Icon--ReplyAllAlt::before { + content: '\EF5F'; +} + +.ms-Icon--EditStyle::before { + content: '\EF60'; +} + +.ms-Icon--EditMail::before { + content: '\EF61'; +} + +.ms-Icon--Lifesaver::before { + content: '\EF62'; +} + +.ms-Icon--LifesaverLock::before { + content: '\EF63'; +} + +.ms-Icon--InboxCheck::before { + content: '\EF64'; +} + +.ms-Icon--FolderSearch::before { + content: '\EF65'; +} + +.ms-Icon--CollapseMenu::before { + content: '\EF66'; +} + +.ms-Icon--ExpandMenu::before { + content: '\EF67'; +} + +.ms-Icon--Boards::before { + content: '\EF68'; +} + +.ms-Icon--SunAdd::before { + content: '\EF69'; +} + +.ms-Icon--SunQuestionMark::before { + content: '\EF6A'; +} + +.ms-Icon--LandscapeOrientation::before { + content: '\EF6B'; +} + +.ms-Icon--DocumentSearch::before { + content: '\EF6C'; +} + +.ms-Icon--PublicCalendar::before { + content: '\EF6D'; +} + +.ms-Icon--PublicContactCard::before { + content: '\EF6E'; +} + +.ms-Icon--PublicEmail::before { + content: '\EF6F'; +} + +.ms-Icon--PublicFolder::before { + content: '\EF70'; +} + +.ms-Icon--WordDocument::before { + content: '\EF71'; +} + +.ms-Icon--PowerPointDocument::before { + content: '\EF72'; +} + +.ms-Icon--ExcelDocument::before { + content: '\EF73'; +} + +.ms-Icon--GroupedList::before { + content: '\EF74'; +} + +.ms-Icon--ClassroomLogo::before { + content: '\EF75'; +} + +.ms-Icon--Sections::before { + content: '\EF76'; +} + +.ms-Icon--EditPhoto::before { + content: '\EF77'; +} + +.ms-Icon--Starburst::before { + content: '\EF78'; +} + +.ms-Icon--ShareiOS::before { + content: '\EF79'; +} + +.ms-Icon--AirTickets::before { + content: '\EF7A'; +} + +.ms-Icon--PencilReply::before { + content: '\EF7B'; +} + +.ms-Icon--Tiles2::before { + content: '\EF7C'; +} + +.ms-Icon--SkypeCircleCheck::before { + content: '\EF7D'; +} + +.ms-Icon--SkypeCircleClock::before { + content: '\EF7E'; +} + +.ms-Icon--SkypeCircleMinus::before { + content: '\EF7F'; +} + +.ms-Icon--SkypeCheck::before { + content: '\EF80'; +} + +.ms-Icon--SkypeClock::before { + content: '\EF81'; +} + +.ms-Icon--SkypeMinus::before { + content: '\EF82'; +} + +.ms-Icon--SkypeMessage::before { + content: '\EF83'; +} + +.ms-Icon--ClosedCaption::before { + content: '\EF84'; +} + +.ms-Icon--ATPLogo::before { + content: '\EF85'; +} + +.ms-Icon--OfficeFormLogo::before { + content: '\EF86'; +} + +.ms-Icon--RecycleBin::before { + content: '\EF87'; +} + +.ms-Icon--EmptyRecycleBin::before { + content: '\EF88'; +} + +.ms-Icon--Hide2::before { + content: '\EF89'; +} + +.ms-Icon--iOSAppStoreLogo::before { + content: '\EF8A'; +} + +.ms-Icon--AndroidLogo::before { + content: '\EF8B'; +} + +.ms-Icon--Breadcrumb::before { + content: '\EF8C'; +} + +.ms-Icon--ClearFilter::before { + content: '\EF8F'; +} + +.ms-Icon--Flow::before { + content: '\EF90'; +} + +.ms-Icon--PowerAppsLogo::before { + content: '\F091'; +} + +.ms-Icon--PowerApps2Logo::before { + content: '\F092'; +} + +.ms-Icon--circle { + position: relative; + display: inline-block; + font-size: 1rem; + width: 1em; + height: 1em; + margin: 0 0 0 0.5em; + padding: 0; + text-align: right; + -webkit-font-smoothing: antialiased; +} + +.ms-Icon--circle::before, +.ms-Icon--circle::after { + line-height: 1; + font-size: inherit; +} + +.ms-Icon--circle::before { + display: block; + width: 100%; + height: 100%; + margin: 0; + padding: 0; + vertical-align: top; + position: absolute; +} + +.ms-Icon--circle::after { + content: '\e000'; + position: absolute; + top: 0; + right: 0; + -ms-transform: scale(2); + transform: scale(2); + -ms-transform-origin: 50% 50%; + transform-origin: 50% 50%; + z-index: 0; +} + +.ms-Icon--xs { + font-size: 10px; +} + +.ms-Icon--s { + font-size: 12px; +} + +.ms-Icon--m { + font-size: 16px; +} + +.ms-Icon--l { + font-size: 20px; +} + +.ms-Icon--question, +.ms-Icon--calendar, +.ms-Icon--folder, +.ms-Icon--chat, +.ms-Icon--listBullets, +.ms-Icon--folderMove, +.ms-Icon--mailSend, +.ms-Icon--reply, +.ms-Icon--play, +.ms-Icon--replyAll, +.ms-Icon--refresh, +.ms-Icon--questionReverse, +.ms-Icon--notRecurring, +.ms-Icon--tasks, +.ms-Icon--check, +.ms-Icon--arrowLeft, +.ms-Icon--arrowRight, +.ms-Icon--directions, +.ms-Icon--caretLeft, +.ms-Icon--caretRight, +.ms-Icon--caretUpLeft, +.ms-Icon--caretUpRight, +.ms-Icon--caretDownRight, +.ms-Icon--caretDownLeft, +.ms-Icon--note, +.ms-Icon--noteReply, +.ms-Icon--noteForward, +.ms-Icon--taskRecurring, +.ms-Icon--documentReply, +.ms-Icon--documentForward, +.ms-Icon--reactivate, +.ms-Icon--chevronLeft, +.ms-Icon--chevronRight, +.ms-Icon--notebook, +.ms-Icon--chevronsLeft, +.ms-Icon--chevronsRight, +.ms-Icon--receiptForward, +.ms-Icon--receiptReply, +.ms-Icon--receiptCheck, +.ms-Icon--eventShare, +.ms-Icon--oofReply, +.ms-Icon--voicemailReply, +.ms-Icon--voicemailForward, +.ms-Icon--post, +.ms-Icon--toggle, +.ms-Icon--late, +.ms-Icon--eventRecurring, +.ms-Icon--cart, +.ms-Icon--socialListening, +.ms-Icon--replyAlt, +.ms-Icon--replyAllAlt, +.ms-Icon--graph, +.ms-Icon--pinLeft, +.ms-Icon--chart, +.ms-Icon--page, +.ms-Icon--document, +.ms-Icon--metadata, +.ms-Icon--pointItem, +.ms-Icon--dropdown, +.ms-Icon--checkbox, +.ms-Icon--reload, +.ms-Icon--multiChoice, +.ms-Icon--contactForm, +.ms-Icon--inboxCheck, +.ms-Icon--checkboxCheck, +.ms-Icon--folderSearch, +.ms-Icon--listCheck, +.ms-Icon--listGroup, +.ms-Icon--timeline +.ms-Icon--mailCheck, +.ms-Icon--listCheckbox, +.ms-Icon--sunQuestion, +.ms-Icon--chevronThinLeft, +.ms-Icon--chevronThinRight, +.ms-Icon--chevronThickLeft, +.ms-Icon--chevronThickRight, +.ms-Icon--documentLandscape, +.ms-Icon--peopleCheck, +.ms-Icon--caretLeftOutline, +.ms-Icon--caretRightOutline, +.ms-Icon--mailSync, +.ms-Icon--peopleSync, +.ms-Icon--checkPeople, +.ms-Icon--sortLines, +.ms-Icon--triangleRight::before, +.ms-Icon--triangleLeft::before, +.ms-Icon--contactPublic::before, +.ms-Icon--triangleEmptyRight::before, +.ms-Icon--triangleEmptyLeft::before, +.ms-Icon--fileDocument::before, +.ms-Icon--listGroup2::before, +.ms-Icon--copy::before, +.ms-Icon--sections::before, +.ms-Icon--arrowUpRight::before, +.ms-Icon--arrowDownRight::before, +.ms-Icon--arrowDownLeft::before, +.ms-Icon--arrowUpLeft::before, +.ms-Icon--bundle::before { + -ms-transform: scaleX(-1); + transform: scaleX(-1); +} + +.ms-u-slideRightIn10 { + animation-name: fadeIn, slideRightIn10; + -webkit-animation-duration: 0.367s; + -moz-animation-duration: 0.367s; + -ms-animation-duration: 0.367s; + -o-animation-duration: 0.367s; + animation-timing-function: cubic-bezier(0.1, 0.9, 0.2, 1); + animation-fill-mode: both; +} + +@keyframes slideRightIn10 { + from { + transform: translate3d(-10px, 0px, 0px); + } + + to { + transform: translate3d(0px, 0px, 0px); + } +} + +.ms-u-slideRightIn20 { + animation-name: fadeIn, slideRightIn20; + -webkit-animation-duration: 0.367s; + -moz-animation-duration: 0.367s; + -ms-animation-duration: 0.367s; + -o-animation-duration: 0.367s; + animation-timing-function: cubic-bezier(0.1, 0.9, 0.2, 1); + animation-fill-mode: both; +} + +@keyframes slideRightIn20 { + from { + transform: translate3d(-20px, 0px, 0px); + } + + to { + transform: translate3d(0px, 0px, 0px); + } +} + +.ms-u-slideRightIn40 { + animation-name: fadeIn, slideRightIn40; + -webkit-animation-duration: 0.367s; + -moz-animation-duration: 0.367s; + -ms-animation-duration: 0.367s; + -o-animation-duration: 0.367s; + animation-timing-function: cubic-bezier(0.1, 0.9, 0.2, 1); + animation-fill-mode: both; +} + +@keyframes slideRightIn40 { + from { + transform: translate3d(-40px, 0px, 0px); + } + + to { + transform: translate3d(0px, 0px, 0px); + } +} + +.ms-u-slideLeftIn10 { + animation-name: fadeIn, slideLeftIn10; + -webkit-animation-duration: 0.367s; + -moz-animation-duration: 0.367s; + -ms-animation-duration: 0.367s; + -o-animation-duration: 0.367s; + animation-timing-function: cubic-bezier(0.1, 0.9, 0.2, 1); + animation-fill-mode: both; +} + +@keyframes slideLeftIn10 { + from { + transform: translate3d(10px, 0px, 0px); + } + + to { + transform: translate3d(0px, 0px, 0px); + } +} + +.ms-u-slideLeftIn20 { + animation-name: fadeIn, slideLeftIn20; + -webkit-animation-duration: 0.367s; + -moz-animation-duration: 0.367s; + -ms-animation-duration: 0.367s; + -o-animation-duration: 0.367s; + animation-timing-function: cubic-bezier(0.1, 0.9, 0.2, 1); + animation-fill-mode: both; +} + +@keyframes slideLeftIn20 { + from { + transform: translate3d(20px, 0px, 0px); + } + + to { + transform: translate3d(0px, 0px, 0px); + } +} + +.ms-u-slideLeftIn40 { + animation-name: fadeIn, slideLeftIn40; + -webkit-animation-duration: 0.367s; + -moz-animation-duration: 0.367s; + -ms-animation-duration: 0.367s; + -o-animation-duration: 0.367s; + animation-timing-function: cubic-bezier(0.1, 0.9, 0.2, 1); + animation-fill-mode: both; +} + +@keyframes slideLeftIn40 { + from { + transform: translate3d(40px, 0px, 0px); + } + + to { + transform: translate3d(0px, 0px, 0px); + } +} + +.ms-u-slideRightIn400 { + animation-name: fadeIn, slideRightIn400; + -webkit-animation-duration: 0.367s; + -moz-animation-duration: 0.367s; + -ms-animation-duration: 0.367s; + -o-animation-duration: 0.367s; + animation-timing-function: cubic-bezier(0.1, 0.9, 0.2, 1); + animation-fill-mode: both; +} + +@keyframes slideRightIn400 { + from { + transform: translate3d(-400px, 0px, 0px); + } + + to { + transform: translate3d(0px, 0px, 0px); + } +} + +.ms-u-slideLeftIn400 { + animation-name: fadeIn, slideLeft400; + -webkit-animation-duration: 0.367s; + -moz-animation-duration: 0.367s; + -ms-animation-duration: 0.367s; + -o-animation-duration: 0.367s; + animation-timing-function: cubic-bezier(0.1, 0.9, 0.2, 1); + animation-fill-mode: both; +} + +@keyframes slideLeft400 { + from { + transform: translate3d(400px, 0px, 0px); + } + + to { + transform: translate3d(0px, 0px, 0px); + } +} + +.ms-u-slideUpIn20 { + animation-name: fadeIn, slideUpIn20; + -webkit-animation-duration: 0.367s; + -moz-animation-duration: 0.367s; + -ms-animation-duration: 0.367s; + -o-animation-duration: 0.367s; + animation-timing-function: cubic-bezier(0.1, 0.9, 0.2, 1); + animation-fill-mode: both; +} + +@keyframes slideUpIn20 { + from { + transform: translate3d(0px, 20px, 0px); + } + + to { + transform: translate3d(0px, 0px, 0px); + } +} + +.ms-u-slideUpIn10 { + animation-name: fadeIn, slideUpIn10; + -webkit-animation-duration: 0.167s; + -moz-animation-duration: 0.167s; + -ms-animation-duration: 0.167s; + -o-animation-duration: 0.167s; + animation-timing-function: cubic-bezier(0.1, 0.25, 0.75, 0.9); + animation-fill-mode: both; +} + +@keyframes slideUpIn10 { + from { + transform: translate3d(0px, 10px, 0px); + } + + to { + transform: translate3d(0px, 0px, 0px); + } +} + +.ms-u-slideDownIn20 { + animation-name: fadeIn, slideDownIn20; + -webkit-animation-duration: 0.367s; + -moz-animation-duration: 0.367s; + -ms-animation-duration: 0.367s; + -o-animation-duration: 0.367s; + animation-timing-function: cubic-bezier(0.1, 0.9, 0.2, 1); + animation-fill-mode: both; +} + +@keyframes slideDownIn20 { + from { + transform: translate3d(0px, -20px, 0px); + } + + to { + transform: translate3d(0px, 0px, 0px); + } +} + +.ms-u-slideDownIn10 { + animation-name: fadeIn, slideDownIn10; + -webkit-animation-duration: 0.167s; + -moz-animation-duration: 0.167s; + -ms-animation-duration: 0.167s; + -o-animation-duration: 0.167s; + animation-timing-function: cubic-bezier(0.1, 0.25, 0.75, 0.9); + animation-fill-mode: both; +} + +@keyframes slideDownIn10 { + from { + transform: translate3d(0px, -10px, 0px); + } + + to { + transform: translate3d(0px, 0px, 0px); + } +} + +.ms-u-slideRightOut40 { + animation-name: fadeOut, slideRightOut40; + -webkit-animation-duration: 0.167s; + -moz-animation-duration: 0.167s; + -ms-animation-duration: 0.167s; + -o-animation-duration: 0.167s; + animation-timing-function: cubic-bezier(0.1, 0.25, 0.75, 0.9); + animation-fill-mode: both; +} + +@keyframes slideRightOut40 { + from { + transform: translate3d(0px, 0px, 0px); + } + + to { + transform: translate3d(40px, 0px, 0px); + } +} + +.ms-u-slideLeftOut40 { + animation-name: fadeOut, slideLeftOut40; + -webkit-animation-duration: 0.167s; + -moz-animation-duration: 0.167s; + -ms-animation-duration: 0.167s; + -o-animation-duration: 0.167s; + animation-timing-function: cubic-bezier(0.1, 0.25, 0.75, 0.9); + animation-fill-mode: both; +} + +@keyframes slideLeftOut40 { + from { + transform: translate3d(0, 0px, 0px); + } + + to { + transform: translate3d(-40px, 0px, 0px); + } +} + +.ms-u-slideRightOut400 { + animation-name: fadeOut, slideRightOut400; + -webkit-animation-duration: 0.167s; + -moz-animation-duration: 0.167s; + -ms-animation-duration: 0.167s; + -o-animation-duration: 0.167s; + animation-timing-function: cubic-bezier(0.1, 0.25, 0.75, 0.9); + animation-fill-mode: both; +} + +@keyframes slideRightOut400 { + from { + transform: translate3d(0, 0px, 0px); + } + + to { + transform: translate3d(400px, 0px, 0px); + } +} + +.ms-u-slideLeftOut400 { + animation-name: fadeOut, slideLeftOut400; + -webkit-animation-duration: 0.167s; + -moz-animation-duration: 0.167s; + -ms-animation-duration: 0.167s; + -o-animation-duration: 0.167s; + animation-timing-function: cubic-bezier(0.1, 0.25, 0.75, 0.9); + animation-fill-mode: both; +} + +@keyframes slideLeftOut400 { + from { + transform: translate3d(0, 0px, 0px); + } + + to { + transform: translate3d(-400px, 0px, 0px); + } +} + +.ms-u-slideUpOut20 { + animation-name: fadeOut, slideUpOut20; + -webkit-animation-duration: 0.167s; + -moz-animation-duration: 0.167s; + -ms-animation-duration: 0.167s; + -o-animation-duration: 0.167s; + animation-timing-function: cubic-bezier(0.1, 0.25, 0.75, 0.9); + animation-fill-mode: both; +} + +@keyframes slideUpOut20 { + from { + transform: translate3d(0px, 0, 0px); + } + + to { + transform: translate3d(0px, -20px, 0px); + } +} + +.ms-u-slideUpOut10 { + animation-name: fadeOut, slideUpOut10; + -webkit-animation-duration: 0.167s; + -moz-animation-duration: 0.167s; + -ms-animation-duration: 0.167s; + -o-animation-duration: 0.167s; + animation-timing-function: cubic-bezier(0.1, 0.25, 0.75, 0.9); + animation-fill-mode: both; +} + +@keyframes slideUpOut10 { + from { + transform: translate3d(0px, 0, 0px); + } + + to { + transform: translate3d(0px, -10px, 0px); + } +} + +.ms-u-slideDownOut20 { + animation-name: fadeOut, slideDownOut20; + -webkit-animation-duration: 0.167s; + -moz-animation-duration: 0.167s; + -ms-animation-duration: 0.167s; + -o-animation-duration: 0.167s; + animation-timing-function: cubic-bezier(0.1, 0.25, 0.75, 0.9); + animation-fill-mode: both; +} + +@keyframes slideDownOut20 { + from { + transform: translate3d(0px, 0, 0px); + } + + to { + transform: translate3d(0px, 20px, 0px); + } +} + +.ms-u-slideDownOut10 { + animation-name: fadeOut, slideDownOut10; + -webkit-animation-duration: 0.167s; + -moz-animation-duration: 0.167s; + -ms-animation-duration: 0.167s; + -o-animation-duration: 0.167s; + animation-timing-function: cubic-bezier(0.1, 0.25, 0.75, 0.9); + animation-fill-mode: both; +} + +@keyframes slideDownOut10 { + from { + transform: translate3d(0px, 0, 0px); + } + + to { + transform: translate3d(0px, 10px, 0px); + } +} + +.ms-u-scaleUpIn100 { + animation-name: fadeIn, scaleUp100; + -webkit-animation-duration: 0.367s; + -moz-animation-duration: 0.367s; + -ms-animation-duration: 0.367s; + -o-animation-duration: 0.367s; + animation-timing-function: cubic-bezier(0.1, 0.9, 0.2, 1); + animation-fill-mode: both; +} + +@keyframes scaleUp100 { + from { + transform: scale3d(0.98, 0.98, 1); + } + + to { + transform: scale3d(1, 1, 1); + } +} + +.ms-u-scaleDownIn100 { + animation-name: fadeIn, scaleDown100; + -webkit-animation-duration: 0.367s; + -moz-animation-duration: 0.367s; + -ms-animation-duration: 0.367s; + -o-animation-duration: 0.367s; + animation-timing-function: cubic-bezier(0.1, 0.9, 0.2, 1); + animation-fill-mode: both; +} + +@keyframes scaleDown100 { + from { + transform: scale3d(1.03, 1.03, 1); + } + + to { + transform: scale3d(1, 1, 1); + } +} + +.ms-u-scaleUpOut103 { + animation-name: fadeOut, scaleUp103; + -webkit-animation-duration: 0.167s; + -moz-animation-duration: 0.167s; + -ms-animation-duration: 0.167s; + -o-animation-duration: 0.167s; + animation-timing-function: cubic-bezier(0.1, 0.25, 0.75, 0.9); + animation-fill-mode: both; +} + +@keyframes scaleUp103 { + from { + transform: scale3d(1, 1, 1); + } + + to { + transform: scale3d(1.03, 1.03, 1); + } +} + +.ms-u-scaleDownOut98 { + animation-name: fadeOut, scaleDown98; + -webkit-animation-duration: 0.167s; + -moz-animation-duration: 0.167s; + -ms-animation-duration: 0.167s; + -o-animation-duration: 0.167s; + animation-timing-function: cubic-bezier(0.1, 0.25, 0.75, 0.9); + animation-fill-mode: both; +} + +@keyframes scaleDown98 { + from { + transform: scale3d(1, 1, 1); + } + + to { + transform: scale3d(0.98, 0.98, 1); + } +} + +.ms-u-fadeIn400 { + -webkit-animation-duration: 0.367s; + -webkit-animation-name: fadeIn; + -webkit-animation-fill-mode: both; + animation-duration: 0.367s; + animation-name: fadeIn; + animation-fill-mode: both; +} + +.ms-u-fadeIn100 { + -webkit-animation-duration: 0.367s; + -webkit-animation-name: fadeIn; + -webkit-animation-fill-mode: both; + animation-duration: 0.367s; + animation-name: fadeIn; + animation-fill-mode: both; + animation-duration: 0.167s; +} + +.ms-u-fadeIn200 { + -webkit-animation-duration: 0.367s; + -webkit-animation-name: fadeIn; + -webkit-animation-fill-mode: both; + animation-duration: 0.367s; + animation-name: fadeIn; + animation-fill-mode: both; + animation-duration: 0.267s; +} + +.ms-u-fadeIn500 { + -webkit-animation-duration: 0.367s; + -webkit-animation-name: fadeIn; + -webkit-animation-fill-mode: both; + animation-duration: 0.367s; + animation-name: fadeIn; + animation-fill-mode: both; + animation-duration: 0.467s; +} + +@keyframes fadeIn { + from { + opacity: 0; + animation-timing-function: cubic-bezier(0.1, 0.25, 0.75, 0.9); + } + + to { + opacity: 1; + } +} + +.ms-u-fadeOut400 { + -webkit-animation-duration: 0.367s; + -webkit-animation-name: fadeOut; + -webkit-animation-fill-mode: both; + animation-duration: 0.367s; + animation-name: fadeOut; + animation-fill-mode: both; +} + +.ms-u-fadeOut100 { + -webkit-animation-duration: 0.367s; + -webkit-animation-name: fadeOut; + -webkit-animation-fill-mode: both; + animation-duration: 0.367s; + animation-name: fadeOut; + animation-fill-mode: both; + animation-duration: 0.1s; +} + +.ms-u-fadeOut200 { + -webkit-animation-duration: 0.367s; + -webkit-animation-name: fadeOut; + -webkit-animation-fill-mode: both; + animation-duration: 0.367s; + animation-name: fadeOut; + animation-fill-mode: both; + animation-duration: 0.167s; +} + +.ms-u-fadeOut500 { + -webkit-animation-duration: 0.367s; + -webkit-animation-name: fadeOut; + -webkit-animation-fill-mode: both; + animation-duration: 0.367s; + animation-name: fadeOut; + animation-fill-mode: both; + animation-duration: 0.467s; +} + +@keyframes fadeOut { + from { + opacity: 1; + animation-timing-function: cubic-bezier(0.1, 0.25, 0.75, 0.9); + } + + to { + opacity: 0; + } +} + +.ms-u-rotate90deg { + animation-name: rotate90; + -webkit-animation-duration: 0.1s; + -moz-animation-duration: 0.1s; + -ms-animation-duration: 0.1s; + -o-animation-duration: 0.1s; + animation-timing-function: cubic-bezier(0.1, 0.25, 0.75, 0.9); + animation-fill-mode: both; +} + +@keyframes rotate90 { + from { + transform: rotateZ(0deg); + } + + to { + transform: rotateZ(90deg); + } +} + +.ms-u-rotateN90deg { + animation-name: rotateN90; + -webkit-animation-duration: 0.1s; + -moz-animation-duration: 0.1s; + -ms-animation-duration: 0.1s; + -o-animation-duration: 0.1s; + animation-timing-function: cubic-bezier(0.1, 0.25, 0.75, 0.9); + animation-fill-mode: both; +} + +@keyframes rotateN90 { + from { + transform: rotateZ(90deg); + } + + to { + transform: rotateZ(0deg); + } +} + +.ms-u-expandCollapse400 { + transition: height 0.367s cubic-bezier(0.1, 0.25, 0.75, 0.9); +} + +.ms-u-expandCollapse200 { + transition: height 0.167s cubic-bezier(0.1, 0.25, 0.75, 0.9); +} + +.ms-u-expandCollapse100 { + transition: height 0.1s cubic-bezier(0.1, 0.25, 0.75, 0.9); +} + +.ms-u-delay100 { + animation-delay: 0.167s; +} + +.ms-u-delay200 { + animation-delay: 0.267s; +} + +.ms-u-slideRightIn10 { + animation-name: fadeIn, slideLeft10; + -webkit-animation-duration: 0.367s; + -moz-animation-duration: 0.367s; + -ms-animation-duration: 0.367s; + -o-animation-duration: 0.367s; + animation-timing-function: cubic-bezier(0.1, 0.9, 0.2, 1); + animation-fill-mode: both; +} + +.ms-u-slideRightIn20 { + animation-name: fadeIn, slideLeft20; + -webkit-animation-duration: 0.367s; + -moz-animation-duration: 0.367s; + -ms-animation-duration: 0.367s; + -o-animation-duration: 0.367s; + animation-timing-function: cubic-bezier(0.1, 0.9, 0.2, 1); + animation-fill-mode: both; +} + +.ms-u-slideRightIn40 { + animation-name: fadeIn, slideLeft40; + -webkit-animation-duration: 0.367s; + -moz-animation-duration: 0.367s; + -ms-animation-duration: 0.367s; + -o-animation-duration: 0.367s; + animation-timing-function: cubic-bezier(0.1, 0.9, 0.2, 1); + animation-fill-mode: both; +} + +.ms-u-slideLeftIn10 { + animation-name: fadeIn, slideRight10; + -webkit-animation-duration: 0.367s; + -moz-animation-duration: 0.367s; + -ms-animation-duration: 0.367s; + -o-animation-duration: 0.367s; + animation-timing-function: cubic-bezier(0.1, 0.9, 0.2, 1); + animation-fill-mode: both; +} + +.ms-u-slideLeftIn20 { + animation-name: fadeIn, slideRight20; + -webkit-animation-duration: 0.367s; + -moz-animation-duration: 0.367s; + -ms-animation-duration: 0.367s; + -o-animation-duration: 0.367s; + animation-timing-function: cubic-bezier(0.1, 0.9, 0.2, 1); + animation-fill-mode: both; +} + +.ms-u-slideLeftIn40 { + animation-name: fadeIn, slideRight40; + -webkit-animation-duration: 0.367s; + -moz-animation-duration: 0.367s; + -ms-animation-duration: 0.367s; + -o-animation-duration: 0.367s; + animation-timing-function: cubic-bezier(0.1, 0.9, 0.2, 1); + animation-fill-mode: both; +} + +.ms-u-slideRightIn400 { + animation-name: fadeIn, slideLeft400; + -webkit-animation-duration: 0.367s; + -moz-animation-duration: 0.367s; + -ms-animation-duration: 0.367s; + -o-animation-duration: 0.367s; + animation-timing-function: cubic-bezier(0.1, 0.9, 0.2, 1); + animation-fill-mode: both; +} + +.ms-u-slideLeftIn400 { + animation-name: fadeIn, slideRight400; + -webkit-animation-duration: 0.367s; + -moz-animation-duration: 0.367s; + -ms-animation-duration: 0.367s; + -o-animation-duration: 0.367s; + animation-timing-function: cubic-bezier(0.1, 0.9, 0.2, 1); + animation-fill-mode: both; +} + +.ms-u-slideRightOut40 { + animation-name: fadeOut, slideLeftOut40; + -webkit-animation-duration: 0.167s; + -moz-animation-duration: 0.167s; + -ms-animation-duration: 0.167s; + -o-animation-duration: 0.167s; + animation-timing-function: cubic-bezier(0.1, 0.25, 0.75, 0.9); + animation-fill-mode: both; +} + +.ms-u-slideLeftOut40 { + animation-name: fadeOut, slideRightOut40; + -webkit-animation-duration: 0.167s; + -moz-animation-duration: 0.167s; + -ms-animation-duration: 0.167s; + -o-animation-duration: 0.167s; + animation-timing-function: cubic-bezier(0.1, 0.25, 0.75, 0.9); + animation-fill-mode: both; +} + +.ms-u-slideRightOut400 { + animation-name: fadeOut, slideLeftOut400; + -webkit-animation-duration: 0.167s; + -moz-animation-duration: 0.167s; + -ms-animation-duration: 0.167s; + -o-animation-duration: 0.167s; + animation-timing-function: cubic-bezier(0.1, 0.25, 0.75, 0.9); + animation-fill-mode: both; +} + +.ms-u-slideLeftOut400 { + animation-name: fadeOut, slideRightOut400; + -webkit-animation-duration: 0.167s; + -moz-animation-duration: 0.167s; + -ms-animation-duration: 0.167s; + -o-animation-duration: 0.167s; + animation-timing-function: cubic-bezier(0.1, 0.25, 0.75, 0.9); + animation-fill-mode: both; +} + +.ms-u-rotate90deg { + animation-name: rotateN90; + -webkit-animation-duration: 0.1s; + -moz-animation-duration: 0.1s; + -ms-animation-duration: 0.1s; + -o-animation-duration: 0.1s; + animation-timing-function: cubic-bezier(0.1, 0.25, 0.75, 0.9); + animation-fill-mode: both; +} + +.ms-u-rotateN90deg { + animation-name: rotate90; + -webkit-animation-duration: 0.1s; + -moz-animation-duration: 0.1s; + -ms-animation-duration: 0.1s; + -o-animation-duration: 0.1s; + animation-timing-function: cubic-bezier(0.1, 0.25, 0.75, 0.9); + animation-fill-mode: both; +} + +@media (max-width: 479px) { + .ms-u-hiddenSm, + .ms-u-hiddenMdDown, + .ms-u-hiddenLgDown, + .ms-u-hiddenXlDown, + .ms-u-hiddenXxlDown { + display: none !important; + } +} + +@media (min-width: 480px) and (max-width: 639px) { + .ms-u-hiddenMd, + .ms-u-hiddenMdUp, + .ms-u-hiddenMdDown, + .ms-u-hiddenLgDown, + .ms-u-hiddenXlDown, + .ms-u-hiddenXxlDown { + display: none !important; + } +} + +@media (min-width: 640px) and (max-width: 1023px) { + .ms-u-hiddenMdUp, + .ms-u-hiddenLg, + .ms-u-hiddenLgUp, + .ms-u-hiddenLgDown, + .ms-u-hiddenXlDown, + .ms-u-hiddenXxlDown { + display: none !important; + } +} + +@media (min-width: 1024px) and (max-width: 1365px) { + .ms-u-hiddenMdUp, + .ms-u-hiddenLgUp, + .ms-u-hiddenXl, + .ms-u-hiddenXlUp, + .ms-u-hiddenXlDown, + .ms-u-hiddenXxlDown { + display: none !important; + } +} + +@media (min-width: 1366px) and (max-width: 1919px) { + .ms-u-hiddenMdUp, + .ms-u-hiddenLgUp, + .ms-u-hiddenXlUp, + .ms-u-hiddenXxl, + .ms-u-hiddenXxlUp, + .ms-u-hiddenXxlDown { + display: none !important; + } +} + +@media (min-width: 1920px) { + .ms-u-hiddenMdUp, + .ms-u-hiddenLgUp, + .ms-u-hiddenXlUp, + .ms-u-hiddenXxlUp, + .ms-u-hiddenXxxl { + display: none !important; + } +} + +.ms-u-sm12 { + width: 100%; +} + +.ms-u-sm11 { + width: 91.66666666666666%; +} + +.ms-u-sm10 { + width: 83.33333333333334%; +} + +.ms-u-sm9 { + width: 75%; +} + +.ms-u-sm8 { + width: 66.66666666666666%; +} + +.ms-u-sm7 { + width: 58.333333333333336%; +} + +.ms-u-sm6 { + width: 50%; +} + +.ms-u-sm5 { + width: 41.66666666666667%; +} + +.ms-u-sm4 { + width: 33.33333333333333%; +} + +.ms-u-sm3 { + width: 25%; +} + +.ms-u-sm2 { + width: 16.666666666666664%; +} + +.ms-u-sm1 { + width: 8.333333333333332%; +} + +.ms-u-smPull12 { + left: 100%; +} + +.ms-u-smPull11 { + left: 91.66666666666666%; +} + +.ms-u-smPull10 { + left: 83.33333333333334%; +} + +.ms-u-smPull9 { + left: 75%; +} + +.ms-u-smPull8 { + left: 66.66666666666666%; +} + +.ms-u-smPull7 { + left: 58.333333333333336%; +} + +.ms-u-smPull6 { + left: 50%; +} + +.ms-u-smPull5 { + left: 41.66666666666667%; +} + +.ms-u-smPull4 { + left: 33.33333333333333%; +} + +.ms-u-smPull3 { + left: 25%; +} + +.ms-u-smPull2 { + left: 16.666666666666664%; +} + +.ms-u-smPull1 { + left: 8.333333333333332%; +} + +.ms-u-smPull0 { + left: auto; +} + +.ms-u-smPush12 { + right: 100%; +} + +.ms-u-smPush11 { + right: 91.66666666666666%; +} + +.ms-u-smPush10 { + right: 83.33333333333334%; +} + +.ms-u-smPush9 { + right: 75%; +} + +.ms-u-smPush8 { + right: 66.66666666666666%; +} + +.ms-u-smPush7 { + right: 58.333333333333336%; +} + +.ms-u-smPush6 { + right: 50%; +} + +.ms-u-smPush5 { + right: 41.66666666666667%; +} + +.ms-u-smPush4 { + right: 33.33333333333333%; +} + +.ms-u-smPush3 { + right: 25%; +} + +.ms-u-smPush2 { + right: 16.666666666666664%; +} + +.ms-u-smPush1 { + right: 8.333333333333332%; +} + +.ms-u-smPush0 { + right: auto; +} + +.ms-u-smOffset11 { + margin-right: 91.66666666666666%; +} + +.ms-u-smOffset10 { + margin-right: 83.33333333333334%; +} + +.ms-u-smOffset9 { + margin-right: 75%; +} + +.ms-u-smOffset8 { + margin-right: 66.66666666666666%; +} + +.ms-u-smOffset7 { + margin-right: 58.333333333333336%; +} + +.ms-u-smOffset6 { + margin-right: 50%; +} + +.ms-u-smOffset5 { + margin-right: 41.66666666666667%; +} + +.ms-u-smOffset4 { + margin-right: 33.33333333333333%; +} + +.ms-u-smOffset3 { + margin-right: 25%; +} + +.ms-u-smOffset2 { + margin-right: 16.666666666666664%; +} + +.ms-u-smOffset1 { + margin-right: 8.333333333333332%; +} + +.ms-u-smOffset0 { + margin-right: 0; +} + +@media (min-width: 480px) { + .ms-u-md12 { + width: 100%; + } + + .ms-u-md11 { + width: 91.66666666666666%; + } + + .ms-u-md10 { + width: 83.33333333333334%; + } + + .ms-u-md9 { + width: 75%; + } + + .ms-u-md8 { + width: 66.66666666666666%; + } + + .ms-u-md7 { + width: 58.333333333333336%; + } + + .ms-u-md6 { + width: 50%; + } + + .ms-u-md5 { + width: 41.66666666666667%; + } + + .ms-u-md4 { + width: 33.33333333333333%; + } + + .ms-u-md3 { + width: 25%; + } + + .ms-u-md2 { + width: 16.666666666666664%; + } + + .ms-u-md1 { + width: 8.333333333333332%; + } + + .ms-u-mdPull12 { + left: 100%; + } + + .ms-u-mdPull11 { + left: 91.66666666666666%; + } + + .ms-u-mdPull10 { + left: 83.33333333333334%; + } + + .ms-u-mdPull9 { + left: 75%; + } + + .ms-u-mdPull8 { + left: 66.66666666666666%; + } + + .ms-u-mdPull7 { + left: 58.333333333333336%; + } + + .ms-u-mdPull6 { + left: 50%; + } + + .ms-u-mdPull5 { + left: 41.66666666666667%; + } + + .ms-u-mdPull4 { + left: 33.33333333333333%; + } + + .ms-u-mdPull3 { + left: 25%; + } + + .ms-u-mdPull2 { + left: 16.666666666666664%; + } + + .ms-u-mdPull1 { + left: 8.333333333333332%; + } + + .ms-u-mdPull0 { + left: auto; + } + + .ms-u-mdPush12 { + right: 100%; + } + + .ms-u-mdPush11 { + right: 91.66666666666666%; + } + + .ms-u-mdPush10 { + right: 83.33333333333334%; + } + + .ms-u-mdPush9 { + right: 75%; + } + + .ms-u-mdPush8 { + right: 66.66666666666666%; + } + + .ms-u-mdPush7 { + right: 58.333333333333336%; + } + + .ms-u-mdPush6 { + right: 50%; + } + + .ms-u-mdPush5 { + right: 41.66666666666667%; + } + + .ms-u-mdPush4 { + right: 33.33333333333333%; + } + + .ms-u-mdPush3 { + right: 25%; + } + + .ms-u-mdPush2 { + right: 16.666666666666664%; + } + + .ms-u-mdPush1 { + right: 8.333333333333332%; + } + + .ms-u-mdPush0 { + right: auto; + } + + .ms-u-mdOffset11 { + margin-right: 91.66666666666666%; + } + + .ms-u-mdOffset10 { + margin-right: 83.33333333333334%; + } + + .ms-u-mdOffset9 { + margin-right: 75%; + } + + .ms-u-mdOffset8 { + margin-right: 66.66666666666666%; + } + + .ms-u-mdOffset7 { + margin-right: 58.333333333333336%; + } + + .ms-u-mdOffset6 { + margin-right: 50%; + } + + .ms-u-mdOffset5 { + margin-right: 41.66666666666667%; + } + + .ms-u-mdOffset4 { + margin-right: 33.33333333333333%; + } + + .ms-u-mdOffset3 { + margin-right: 25%; + } + + .ms-u-mdOffset2 { + margin-right: 16.666666666666664%; + } + + .ms-u-mdOffset1 { + margin-right: 8.333333333333332%; + } + + .ms-u-mdOffset0 { + margin-right: 0; + } +} + +@media (min-width: 640px) { + .ms-u-lg12 { + width: 100%; + } + + .ms-u-lg11 { + width: 91.66666666666666%; + } + + .ms-u-lg10 { + width: 83.33333333333334%; + } + + .ms-u-lg9 { + width: 75%; + } + + .ms-u-lg8 { + width: 66.66666666666666%; + } + + .ms-u-lg7 { + width: 58.333333333333336%; + } + + .ms-u-lg6 { + width: 50%; + } + + .ms-u-lg5 { + width: 41.66666666666667%; + } + + .ms-u-lg4 { + width: 33.33333333333333%; + } + + .ms-u-lg3 { + width: 25%; + } + + .ms-u-lg2 { + width: 16.666666666666664%; + } + + .ms-u-lg1 { + width: 8.333333333333332%; + } + + .ms-u-lgPull12 { + left: 100%; + } + + .ms-u-lgPull11 { + left: 91.66666666666666%; + } + + .ms-u-lgPull10 { + left: 83.33333333333334%; + } + + .ms-u-lgPull9 { + left: 75%; + } + + .ms-u-lgPull8 { + left: 66.66666666666666%; + } + + .ms-u-lgPull7 { + left: 58.333333333333336%; + } + + .ms-u-lgPull6 { + left: 50%; + } + + .ms-u-lgPull5 { + left: 41.66666666666667%; + } + + .ms-u-lgPull4 { + left: 33.33333333333333%; + } + + .ms-u-lgPull3 { + left: 25%; + } + + .ms-u-lgPull2 { + left: 16.666666666666664%; + } + + .ms-u-lgPull1 { + left: 8.333333333333332%; + } + + .ms-u-lgPull0 { + left: auto; + } + + .ms-u-lgPush12 { + right: 100%; + } + + .ms-u-lgPush11 { + right: 91.66666666666666%; + } + + .ms-u-lgPush10 { + right: 83.33333333333334%; + } + + .ms-u-lgPush9 { + right: 75%; + } + + .ms-u-lgPush8 { + right: 66.66666666666666%; + } + + .ms-u-lgPush7 { + right: 58.333333333333336%; + } + + .ms-u-lgPush6 { + right: 50%; + } + + .ms-u-lgPush5 { + right: 41.66666666666667%; + } + + .ms-u-lgPush4 { + right: 33.33333333333333%; + } + + .ms-u-lgPush3 { + right: 25%; + } + + .ms-u-lgPush2 { + right: 16.666666666666664%; + } + + .ms-u-lgPush1 { + right: 8.333333333333332%; + } + + .ms-u-lgPush0 { + right: auto; + } + + .ms-u-lgOffset11 { + margin-right: 91.66666666666666%; + } + + .ms-u-lgOffset10 { + margin-right: 83.33333333333334%; + } + + .ms-u-lgOffset9 { + margin-right: 75%; + } + + .ms-u-lgOffset8 { + margin-right: 66.66666666666666%; + } + + .ms-u-lgOffset7 { + margin-right: 58.333333333333336%; + } + + .ms-u-lgOffset6 { + margin-right: 50%; + } + + .ms-u-lgOffset5 { + margin-right: 41.66666666666667%; + } + + .ms-u-lgOffset4 { + margin-right: 33.33333333333333%; + } + + .ms-u-lgOffset3 { + margin-right: 25%; + } + + .ms-u-lgOffset2 { + margin-right: 16.666666666666664%; + } + + .ms-u-lgOffset1 { + margin-right: 8.333333333333332%; + } + + .ms-u-lgOffset0 { + margin-right: 0; + } +} + +@media (min-width: 1024px) { + .ms-u-xl12 { + width: 100%; + } + + .ms-u-xl11 { + width: 91.66666666666666%; + } + + .ms-u-xl10 { + width: 83.33333333333334%; + } + + .ms-u-xl9 { + width: 75%; + } + + .ms-u-xl8 { + width: 66.66666666666666%; + } + + .ms-u-xl7 { + width: 58.333333333333336%; + } + + .ms-u-xl6 { + width: 50%; + } + + .ms-u-xl5 { + width: 41.66666666666667%; + } + + .ms-u-xl4 { + width: 33.33333333333333%; + } + + .ms-u-xl3 { + width: 25%; + } + + .ms-u-xl2 { + width: 16.666666666666664%; + } + + .ms-u-xl1 { + width: 8.333333333333332%; + } + + .ms-u-xlPull12 { + left: 100%; + } + + .ms-u-xlPull11 { + left: 91.66666666666666%; + } + + .ms-u-xlPull10 { + left: 83.33333333333334%; + } + + .ms-u-xlPull9 { + left: 75%; + } + + .ms-u-xlPull8 { + left: 66.66666666666666%; + } + + .ms-u-xlPull7 { + left: 58.333333333333336%; + } + + .ms-u-xlPull6 { + left: 50%; + } + + .ms-u-xlPull5 { + left: 41.66666666666667%; + } + + .ms-u-xlPull4 { + left: 33.33333333333333%; + } + + .ms-u-xlPull3 { + left: 25%; + } + + .ms-u-xlPull2 { + left: 16.666666666666664%; + } + + .ms-u-xlPull1 { + left: 8.333333333333332%; + } + + .ms-u-xlPull0 { + left: auto; + } + + .ms-u-xlPush12 { + right: 100%; + } + + .ms-u-xlPush11 { + right: 91.66666666666666%; + } + + .ms-u-xlPush10 { + right: 83.33333333333334%; + } + + .ms-u-xlPush9 { + right: 75%; + } + + .ms-u-xlPush8 { + right: 66.66666666666666%; + } + + .ms-u-xlPush7 { + right: 58.333333333333336%; + } + + .ms-u-xlPush6 { + right: 50%; + } + + .ms-u-xlPush5 { + right: 41.66666666666667%; + } + + .ms-u-xlPush4 { + right: 33.33333333333333%; + } + + .ms-u-xlPush3 { + right: 25%; + } + + .ms-u-xlPush2 { + right: 16.666666666666664%; + } + + .ms-u-xlPush1 { + right: 8.333333333333332%; + } + + .ms-u-xlPush0 { + right: auto; + } + + .ms-u-xlOffset11 { + margin-right: 91.66666666666666%; + } + + .ms-u-xlOffset10 { + margin-right: 83.33333333333334%; + } + + .ms-u-xlOffset9 { + margin-right: 75%; + } + + .ms-u-xlOffset8 { + margin-right: 66.66666666666666%; + } + + .ms-u-xlOffset7 { + margin-right: 58.333333333333336%; + } + + .ms-u-xlOffset6 { + margin-right: 50%; + } + + .ms-u-xlOffset5 { + margin-right: 41.66666666666667%; + } + + .ms-u-xlOffset4 { + margin-right: 33.33333333333333%; + } + + .ms-u-xlOffset3 { + margin-right: 25%; + } + + .ms-u-xlOffset2 { + margin-right: 16.666666666666664%; + } + + .ms-u-xlOffset1 { + margin-right: 8.333333333333332%; + } + + .ms-u-xlOffset0 { + margin-right: 0; + } +} + +@media (min-width: 1366px) { + .ms-u-xxl12 { + width: 100%; + } + + .ms-u-xxl11 { + width: 91.66666666666666%; + } + + .ms-u-xxl10 { + width: 83.33333333333334%; + } + + .ms-u-xxl9 { + width: 75%; + } + + .ms-u-xxl8 { + width: 66.66666666666666%; + } + + .ms-u-xxl7 { + width: 58.333333333333336%; + } + + .ms-u-xxl6 { + width: 50%; + } + + .ms-u-xxl5 { + width: 41.66666666666667%; + } + + .ms-u-xxl4 { + width: 33.33333333333333%; + } + + .ms-u-xxl3 { + width: 25%; + } + + .ms-u-xxl2 { + width: 16.666666666666664%; + } + + .ms-u-xxl1 { + width: 8.333333333333332%; + } + + .ms-u-xxlPull12 { + left: 100%; + } + + .ms-u-xxlPull11 { + left: 91.66666666666666%; + } + + .ms-u-xxlPull10 { + left: 83.33333333333334%; + } + + .ms-u-xxlPull9 { + left: 75%; + } + + .ms-u-xxlPull8 { + left: 66.66666666666666%; + } + + .ms-u-xxlPull7 { + left: 58.333333333333336%; + } + + .ms-u-xxlPull6 { + left: 50%; + } + + .ms-u-xxlPull5 { + left: 41.66666666666667%; + } + + .ms-u-xxlPull4 { + left: 33.33333333333333%; + } + + .ms-u-xxlPull3 { + left: 25%; + } + + .ms-u-xxlPull2 { + left: 16.666666666666664%; + } + + .ms-u-xxlPull1 { + left: 8.333333333333332%; + } + + .ms-u-xxlPull0 { + left: auto; + } + + .ms-u-xxlPush12 { + right: 100%; + } + + .ms-u-xxlPush11 { + right: 91.66666666666666%; + } + + .ms-u-xxlPush10 { + right: 83.33333333333334%; + } + + .ms-u-xxlPush9 { + right: 75%; + } + + .ms-u-xxlPush8 { + right: 66.66666666666666%; + } + + .ms-u-xxlPush7 { + right: 58.333333333333336%; + } + + .ms-u-xxlPush6 { + right: 50%; + } + + .ms-u-xxlPush5 { + right: 41.66666666666667%; + } + + .ms-u-xxlPush4 { + right: 33.33333333333333%; + } + + .ms-u-xxlPush3 { + right: 25%; + } + + .ms-u-xxlPush2 { + right: 16.666666666666664%; + } + + .ms-u-xxlPush1 { + right: 8.333333333333332%; + } + + .ms-u-xxlPush0 { + right: auto; + } + + .ms-u-xxlOffset11 { + margin-right: 91.66666666666666%; + } + + .ms-u-xxlOffset10 { + margin-right: 83.33333333333334%; + } + + .ms-u-xxlOffset9 { + margin-right: 75%; + } + + .ms-u-xxlOffset8 { + margin-right: 66.66666666666666%; + } + + .ms-u-xxlOffset7 { + margin-right: 58.333333333333336%; + } + + .ms-u-xxlOffset6 { + margin-right: 50%; + } + + .ms-u-xxlOffset5 { + margin-right: 41.66666666666667%; + } + + .ms-u-xxlOffset4 { + margin-right: 33.33333333333333%; + } + + .ms-u-xxlOffset3 { + margin-right: 25%; + } + + .ms-u-xxlOffset2 { + margin-right: 16.666666666666664%; + } + + .ms-u-xxlOffset1 { + margin-right: 8.333333333333332%; + } + + .ms-u-xxlOffset0 { + margin-right: 0; + } +} + +@media (min-width: 1920px) { + .ms-u-xxxl12 { + width: 100%; + } + + .ms-u-xxxl11 { + width: 91.66666666666666%; + } + + .ms-u-xxxl10 { + width: 83.33333333333334%; + } + + .ms-u-xxxl9 { + width: 75%; + } + + .ms-u-xxxl8 { + width: 66.66666666666666%; + } + + .ms-u-xxxl7 { + width: 58.333333333333336%; + } + + .ms-u-xxxl6 { + width: 50%; + } + + .ms-u-xxxl5 { + width: 41.66666666666667%; + } + + .ms-u-xxxl4 { + width: 33.33333333333333%; + } + + .ms-u-xxxl3 { + width: 25%; + } + + .ms-u-xxxl2 { + width: 16.666666666666664%; + } + + .ms-u-xxxl1 { + width: 8.333333333333332%; + } + + .ms-u-xxxlPull12 { + left: 100%; + } + + .ms-u-xxxlPull11 { + left: 91.66666666666666%; + } + + .ms-u-xxxlPull10 { + left: 83.33333333333334%; + } + + .ms-u-xxxlPull9 { + left: 75%; + } + + .ms-u-xxxlPull8 { + left: 66.66666666666666%; + } + + .ms-u-xxxlPull7 { + left: 58.333333333333336%; + } + + .ms-u-xxxlPull6 { + left: 50%; + } + + .ms-u-xxxlPull5 { + left: 41.66666666666667%; + } + + .ms-u-xxxlPull4 { + left: 33.33333333333333%; + } + + .ms-u-xxxlPull3 { + left: 25%; + } + + .ms-u-xxxlPull2 { + left: 16.666666666666664%; + } + + .ms-u-xxxlPull1 { + left: 8.333333333333332%; + } + + .ms-u-xxxlPull0 { + left: auto; + } + + .ms-u-xxxlPush12 { + right: 100%; + } + + .ms-u-xxxlPush11 { + right: 91.66666666666666%; + } + + .ms-u-xxxlPush10 { + right: 83.33333333333334%; + } + + .ms-u-xxxlPush9 { + right: 75%; + } + + .ms-u-xxxlPush8 { + right: 66.66666666666666%; + } + + .ms-u-xxxlPush7 { + right: 58.333333333333336%; + } + + .ms-u-xxxlPush6 { + right: 50%; + } + + .ms-u-xxxlPush5 { + right: 41.66666666666667%; + } + + .ms-u-xxxlPush4 { + right: 33.33333333333333%; + } + + .ms-u-xxxlPush3 { + right: 25%; + } + + .ms-u-xxxlPush2 { + right: 16.666666666666664%; + } + + .ms-u-xxxlPush1 { + right: 8.333333333333332%; + } + + .ms-u-xxxlPush0 { + right: auto; + } + + .ms-u-xxxlOffset11 { + margin-right: 91.66666666666666%; + } + + .ms-u-xxxlOffset10 { + margin-right: 83.33333333333334%; + } + + .ms-u-xxxlOffset9 { + margin-right: 75%; + } + + .ms-u-xxxlOffset8 { + margin-right: 66.66666666666666%; + } + + .ms-u-xxxlOffset7 { + margin-right: 58.333333333333336%; + } + + .ms-u-xxxlOffset6 { + margin-right: 50%; + } + + .ms-u-xxxlOffset5 { + margin-right: 41.66666666666667%; + } + + .ms-u-xxxlOffset4 { + margin-right: 33.33333333333333%; + } + + .ms-u-xxxlOffset3 { + margin-right: 25%; + } + + .ms-u-xxxlOffset2 { + margin-right: 16.666666666666664%; + } + + .ms-u-xxxlOffset1 { + margin-right: 8.333333333333332%; + } + + .ms-u-xxxlOffset0 { + margin-right: 0; + } +} + +.ms-Grid { + box-sizing: border-box; + *zoom: 1; + padding: 0 8px; +} + +.ms-Grid::before, +.ms-Grid::after { + display: table; + content: ''; + line-height: 0; +} + +.ms-Grid::after { + clear: both; +} + +.ms-Grid-row { + margin: 0 -8px; + box-sizing: border-box; + *zoom: 1; +} + +.ms-Grid-row::before, +.ms-Grid-row::after { + display: table; + content: ''; + line-height: 0; +} + +.ms-Grid-row::after { + clear: both; +} + +.ms-Grid-col { + position: relative; + min-height: 1px; + padding-right: 8px; + padding-left: 8px; + box-sizing: border-box; + float: right; +} + +.ms-Grid-col .ms-Grid { + padding: 0; +} + +.ms-Fabric { + color: #333333; +} diff --git a/dist/css/fabric.rtl.min.css b/dist/css/fabric.rtl.min.css new file mode 100644 index 000000000..0318eb836 --- /dev/null +++ b/dist/css/fabric.rtl.min.css @@ -0,0 +1,6 @@ +/* Copyright (c) Microsoft. All rights reserved. Licensed under the MIT license. See LICENSE in the project root for license information. */ +/** + * Office UI Fabric 4.0.0 + * The front-end framework for building experiences for Office 365. + **/ +.ms-u-borderBox,.ms-u-borderBox:after,.ms-u-borderBox:before{box-sizing:border-box}.ms-u-borderBase{border:1px solid}.ms-u-clearfix{*zoom:1}.ms-u-clearfix:after,.ms-u-clearfix:before{display:table;content:'';line-height:0}.ms-u-clearfix:after{clear:both}.ms-u-normalize{box-sizing:border-box;margin:0;padding:0;box-shadow:none}.ms-u-textAlignLeft{text-align:right}.ms-u-textAlignCenter{text-align:center}.ms-u-textAlignRight{text-align:left}.ms-u-screenReaderOnly{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);border:0}.ms-u-textTruncate{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;word-wrap:normal}.ms-u-noWrap{white-space:nowrap}.ms-bgColor-themeDark,.ms-bgColor-themeDark--hover:hover{background-color:#005a9e}.ms-bgColor-themeDarkAlt,.ms-bgColor-themeDarkAlt--hover:hover{background-color:#106ebe}.ms-bgColor-themeDarker,.ms-bgColor-themeDarker--hover:hover{background-color:#004578}.ms-bgColor-themePrimary,.ms-bgColor-themePrimary--hover:hover{background-color:#0078d7}.ms-bgColor-themeSecondary,.ms-bgColor-themeSecondary--hover:hover{background-color:#2488d8}.ms-bgColor-themeTertiary,.ms-bgColor-themeTertiary--hover:hover{background-color:#69afe5}.ms-bgColor-themeLight,.ms-bgColor-themeLight--hover:hover{background-color:#b3d6f2}.ms-bgColor-themeLighter,.ms-bgColor-themeLighter--hover:hover{background-color:#deecf9}.ms-bgColor-themeLighterAlt,.ms-bgColor-themeLighterAlt--hover:hover{background-color:#eff6fc}.ms-bgColor-black,.ms-bgColor-black--hover:hover{background-color:#000}.ms-bgColor-neutralDark,.ms-bgColor-neutralDark--hover:hover{background-color:#212121}.ms-bgColor-neutralPrimary,.ms-bgColor-neutralPrimary--hover:hover{background-color:#333}.ms-bgColor-neutralPrimaryAlt,.ms-bgColor-neutralPrimaryAlt--hover:hover{background-color:#3c3c3c}.ms-bgColor-neutralSecondary,.ms-bgColor-neutralSecondary--hover:hover{background-color:#666}.ms-bgColor-neutralSecondaryAlt,.ms-bgColor-neutralSecondaryAlt--hover:hover{background-color:#767676}.ms-bgColor-neutralTertiary,.ms-bgColor-neutralTertiary--hover:hover{background-color:#a6a6a6}.ms-bgColor-neutralTertiaryAlt,.ms-bgColor-neutralTertiaryAlt--hover:hover{background-color:#c8c8c8}.ms-bgColor-neutralLight,.ms-bgColor-neutralLight--hover:hover{background-color:#eaeaea}.ms-bgColor-neutralLighter,.ms-bgColor-neutralLighter--hover:hover{background-color:#f4f4f4}.ms-bgColor-neutralLighterAlt,.ms-bgColor-neutralLighterAlt--hover:hover{background-color:#f8f8f8}.ms-bgColor-white,.ms-bgColor-white--hover:hover{background-color:#fff}.ms-bgColor-yellow{background-color:#ffb900}.ms-bgColor-yellowLight{background-color:#fff100}.ms-bgColor-orange{background-color:#d83b01}.ms-bgColor-orangeLight{background-color:#ea4300}.ms-bgColor-orangeLighter{background-color:#ff8c00}.ms-bgColor-redDark{background-color:#a80000}.ms-bgColor-red{background-color:#e81123}.ms-bgColor-magentaDark{background-color:#5c005c}.ms-bgColor-magenta{background-color:#b4009e}.ms-bgColor-magentaLight{background-color:#e3008c}.ms-bgColor-purpleDark{background-color:#32145a}.ms-bgColor-purple{background-color:#5c2d91}.ms-bgColor-purpleLight{background-color:#b4a0ff}.ms-bgColor-blueDark{background-color:#002050}.ms-bgColor-blueMid{background-color:#00188f}.ms-bgColor-blue{background-color:#0078d7}.ms-bgColor-blueLight{background-color:#00bcf2}.ms-bgColor-tealDark{background-color:#004b50}.ms-bgColor-teal{background-color:#008272}.ms-bgColor-tealLight{background-color:#00b294}.ms-bgColor-greenDark{background-color:#004b1c}.ms-bgColor-green{background-color:#107c10}.ms-bgColor-greenLight{background-color:#bad80a}.ms-bgColor-info{background-color:#f4f4f4}.ms-bgColor-success{background-color:#dff6dd}.ms-bgColor-severeWarning{background-color:#fed9cc}.ms-bgColor-warning{background-color:#fff4ce}.ms-bgColor-error{background-color:#fde7e9}.ms-borderColor-themeDark,.ms-borderColor-themeDark--hover:hover{border-color:#005a9e}.ms-borderColor-themeDarkAlt,.ms-borderColor-themeDarkAlt--hover:hover{border-color:#106ebe}.ms-borderColor-themeDarker,.ms-borderColor-themeDarker--hover:hover{border-color:#004578}.ms-borderColor-themePrimary,.ms-borderColor-themePrimary--hover:hover{border-color:#0078d7}.ms-borderColor-themeSecondary,.ms-borderColor-themeSecondary--hover:hover{border-color:#2488d8}.ms-borderColor-themeTertiary,.ms-borderColor-themeTertiary--hover:hover{border-color:#69afe5}.ms-borderColor-themeLight,.ms-borderColor-themeLight--hover:hover{border-color:#b3d6f2}.ms-borderColor-themeLighter,.ms-borderColor-themeLighter--hover:hover{border-color:#deecf9}.ms-borderColor-themeLighterAlt,.ms-borderColor-themeLighterAlt--hover:hover{border-color:#eff6fc}.ms-borderColor-black,.ms-borderColor-black--hover:hover{border-color:#000}.ms-borderColor-neutralDark,.ms-borderColor-neutralDark--hover:hover{border-color:#212121}.ms-borderColor-neutralPrimary,.ms-borderColor-neutralPrimary--hover:hover{border-color:#333}.ms-borderColor-neutralPrimaryAlt,.ms-borderColor-neutralPrimaryAlt--hover:hover{border-color:#3c3c3c}.ms-borderColor-neutralSecondary,.ms-borderColor-neutralSecondary--hover:hover{border-color:#666}.ms-borderColor-neutralSecondaryAlt,.ms-borderColor-neutralSecondaryAlt--hover:hover{border-color:#767676}.ms-borderColor-neutralTertiary,.ms-borderColor-neutralTertiary--hover:hover{border-color:#a6a6a6}.ms-borderColor-neutralTertiaryAlt,.ms-borderColor-neutralTertiaryAlt--hover:hover{border-color:#c8c8c8}.ms-borderColor-neutralLight,.ms-borderColor-neutralLight--hover:hover{border-color:#eaeaea}.ms-borderColor-neutralLighter,.ms-borderColor-neutralLighter--hover:hover{border-color:#f4f4f4}.ms-borderColor-neutralLighterAlt,.ms-borderColor-neutralLighterAlt--hover:hover{border-color:#f8f8f8}.ms-borderColor-white,.ms-borderColor-white--hover:hover{border-color:#fff}.ms-borderColor-yellow{border-color:#ffb900}.ms-borderColor-yellowLight{border-color:#fff100}.ms-borderColor-orange{border-color:#d83b01}.ms-borderColor-orangeLight{border-color:#ea4300}.ms-borderColor-orangeLighter{border-color:#ff8c00}.ms-borderColor-redDark{border-color:#a80000}.ms-borderColor-red{border-color:#e81123}.ms-borderColor-magentaDark{border-color:#5c005c}.ms-borderColor-magenta{border-color:#b4009e}.ms-borderColor-magentaLight{border-color:#e3008c}.ms-borderColor-purpleDark{border-color:#32145a}.ms-borderColor-purple{border-color:#5c2d91}.ms-borderColor-purpleLight{border-color:#b4a0ff}.ms-borderColor-blueDark{border-color:#002050}.ms-borderColor-blueMid{border-color:#00188f}.ms-borderColor-blue{border-color:#0078d7}.ms-borderColor-blueLight{border-color:#00bcf2}.ms-borderColor-tealDark{border-color:#004b50}.ms-borderColor-teal{border-color:#008272}.ms-borderColor-tealLight{border-color:#00b294}.ms-borderColor-greenDark{border-color:#004b1c}.ms-borderColor-green{border-color:#107c10}.ms-borderColor-greenLight{border-color:#bad80a}.ms-borderColorTop-themePrimary,.ms-borderColorTop-themePrimary--hover:hover{border-top-color:#0078d7}@font-face{font-family:Segoe UI WestEuropean;src:local('Segoe UI Light'),url(https://appsforoffice.microsoft.com/fabric/fonts/SegoeUI-WestEuropean/SegoeUI-Light.woff2) format('woff2'),url(https://appsforoffice.microsoft.com/fabric/fonts/SegoeUI-WestEuropean/SegoeUI-Light.woff) format('woff'),url(https://appsforoffice.microsoft.com/fabric/fonts/SegoeUI-WestEuropean/SegoeUI-Light.ttf) format('truetype');font-weight:100;font-style:normal}@font-face{font-family:Segoe UI WestEuropean;src:local('Segoe UI'),url(https://appsforoffice.microsoft.com/fabric/fonts/SegoeUI-WestEuropean/SegoeUI-Regular.woff2) format('woff2'),url(https://appsforoffice.microsoft.com/fabric/fonts/SegoeUI-WestEuropean/SegoeUI-Regular.woff) format('woff'),url(https://appsforoffice.microsoft.com/fabric/fonts/SegoeUI-WestEuropean/SegoeUI-Regular.ttf) format('truetype');font-weight:400;font-style:normal}@font-face{font-family:Segoe UI WestEuropean;src:local('Segoe UI Semibold'),url(https://appsforoffice.microsoft.com/fabric/fonts/SegoeUI-WestEuropean/SegoeUI-Semibold.woff2) format('woff2'),url(https://appsforoffice.microsoft.com/fabric/fonts/SegoeUI-WestEuropean/SegoeUI-Semibold.woff) format('woff'),url(https://appsforoffice.microsoft.com/fabric/fonts/SegoeUI-WestEuropean/SegoeUI-Semibold.ttf) format('truetype');font-weight:600;font-style:normal}@font-face{font-family:Segoe UI WestEuropean;src:local('Segoe UI Semilight'),url(https://appsforoffice.microsoft.com/fabric/fonts/SegoeUI-WestEuropean/SegoeUI-Semilight.woff2) format('woff2'),url(https://appsforoffice.microsoft.com/fabric/fonts/SegoeUI-WestEuropean/SegoeUI-Semilight.woff) format('woff'),url(https://appsforoffice.microsoft.com/fabric/fonts/SegoeUI-WestEuropean/SegoeUI-Semilight.ttf) format('truetype');font-weight:200;font-style:normal}.ms-font-su{font-size:42px}.ms-font-su,.ms-font-xxl{font-family:Segoe UI WestEuropean,Segoe UI,-apple-system,BlinkMacSystemFont,Roboto,Helvetica Neue,sans-serif;-webkit-font-smoothing:antialiased;font-weight:100}.ms-font-xxl{font-size:28px}.ms-font-xl{font-size:21px;font-weight:100}.ms-font-l,.ms-font-xl{font-family:Segoe UI WestEuropean,Segoe UI,-apple-system,BlinkMacSystemFont,Roboto,Helvetica Neue,sans-serif;-webkit-font-smoothing:antialiased}.ms-font-l{font-size:17px;font-weight:300}.ms-font-m-plus{font-size:15px}.ms-font-m,.ms-font-m-plus{font-family:Segoe UI WestEuropean,Segoe UI,-apple-system,BlinkMacSystemFont,Roboto,Helvetica Neue,sans-serif;-webkit-font-smoothing:antialiased;font-weight:400}.ms-font-m{font-size:14px}.ms-font-s-plus{font-size:13px}.ms-font-s,.ms-font-s-plus{font-family:Segoe UI WestEuropean,Segoe UI,-apple-system,BlinkMacSystemFont,Roboto,Helvetica Neue,sans-serif;-webkit-font-smoothing:antialiased;font-weight:400}.ms-font-s{font-size:12px}.ms-font-xs{font-size:11px;font-weight:400}.ms-font-mi,.ms-font-xs{font-family:Segoe UI WestEuropean,Segoe UI,-apple-system,BlinkMacSystemFont,Roboto,Helvetica Neue,sans-serif;-webkit-font-smoothing:antialiased}.ms-font-mi{font-size:10px;font-weight:600}.ms-fontWeight-light,.ms-fontWeight-light--hover:hover{font-weight:100}.ms-fontWeight-semilight,.ms-fontWeight-semilight--hover:hover{font-weight:300}.ms-fontWeight-regular,.ms-fontWeight-regular--hover:hover{font-weight:400}.ms-fontWeight-semibold,.ms-fontWeight-semibold--hover:hover{font-weight:600}.ms-fontSize-su{font-size:42px}.ms-fontSize-xxl{font-size:28px}.ms-fontSize-xl{font-size:21px}.ms-fontSize-l{font-size:17px}.ms-fontSize-mPlus{font-size:15px}.ms-fontSize-m{font-size:14px}.ms-fontSize-sPlus{font-size:13px}.ms-fontSize-s{font-size:12px}.ms-fontSize-xs{font-size:11px}.ms-fontSize-mi{font-size:10px}.ms-fontColor-themeDarker,.ms-fontColor-themeDarker--hover:hover{color:#004578}.ms-fontColor-themeDark,.ms-fontColor-themeDark--hover:hover{color:#005a9e}.ms-fontColor-themeDarkAlt,.ms-fontColor-themeDarkAlt--hover:hover{color:#106ebe}.ms-fontColor-themePrimary,.ms-fontColor-themePrimary--hover:hover{color:#0078d7}.ms-fontColor-themeSecondary,.ms-fontColor-themeSecondary--hover:hover{color:#2488d8}.ms-fontColor-themeTertiary,.ms-fontColor-themeTertiary--hover:hover{color:#69afe5}.ms-fontColor-themeLight,.ms-fontColor-themeLight--hover:hover{color:#b3d6f2}.ms-fontColor-themeLighter,.ms-fontColor-themeLighter--hover:hover{color:#deecf9}.ms-fontColor-themeLighterAlt,.ms-fontColor-themeLighterAlt--hover:hover{color:#eff6fc}.ms-fontColor-black,.ms-fontColor-black--hover:hover{color:#000}.ms-fontColor-neutralDark,.ms-fontColor-neutralDark--hover:hover{color:#212121}.ms-fontColor-neutralPrimary,.ms-fontColor-neutralPrimary--hover:hover{color:#333}.ms-fontColor-neutralPrimaryAlt,.ms-fontColor-neutralPrimaryAlt--hover:hover{color:#3c3c3c}.ms-fontColor-neutralSecondary,.ms-fontColor-neutralSecondary--hover:hover{color:#666}.ms-fontColor-neutralSecondaryAlt,.ms-fontColor-neutralSecondaryAlt--hover:hover{color:#767676}.ms-fontColor-neutralTertiary,.ms-fontColor-neutralTertiary--hover:hover{color:#a6a6a6}.ms-fontColor-neutralTertiaryAlt,.ms-fontColor-neutralTertiaryAlt--hover:hover{color:#c8c8c8}.ms-fontColor-neutralLight,.ms-fontColor-neutralLight--hover:hover{color:#eaeaea}.ms-fontColor-neutralLighter,.ms-fontColor-neutralLighter--hover:hover{color:#f4f4f4}.ms-fontColor-neutralLighterAlt,.ms-fontColor-neutralLighterAlt--hover:hover{color:#f8f8f8}.ms-fontColor-white,.ms-fontColor-white--hover:hover{color:#fff}.ms-fontColor-yellow,.ms-fontColor-yellow--hover:hover{color:#ffb900}.ms-fontColor-yellowLight,.ms-fontColor-yellowLight--hover:hover{color:#fff100}.ms-fontColor-orange,.ms-fontColor-orange--hover:hover{color:#d83b01}.ms-fontColor-orangeLight,.ms-fontColor-orangeLight--hover:hover{color:#ea4300}.ms-fontColor-orangeLighter,.ms-fontColor-orangeLighter--hover:hover{color:#ff8c00}.ms-fontColor-redDark,.ms-fontColor-redDark--hover:hover{color:#a80000}.ms-fontColor-red,.ms-fontColor-red--hover:hover{color:#e81123}.ms-fontColor-magentaDark,.ms-fontColor-magentaDark--hover:hover{color:#5c005c}.ms-fontColor-magenta,.ms-fontColor-magenta--hover:hover{color:#b4009e}.ms-fontColor-magentaLight,.ms-fontColor-magentaLight--hover:hover{color:#e3008c}.ms-fontColor-purpleDark,.ms-fontColor-purpleDark--hover:hover{color:#32145a}.ms-fontColor-purple,.ms-fontColor-purple--hover:hover{color:#5c2d91}.ms-fontColor-purpleLight,.ms-fontColor-purpleLight--hover:hover{color:#b4a0ff}.ms-fontColor-blueDark,.ms-fontColor-blueDark--hover:hover{color:#002050}.ms-fontColor-blueMid,.ms-fontColor-blueMid--hover:hover{color:#00188f}.ms-fontColor-blue,.ms-fontColor-blue--hover:hover{color:#0078d7}.ms-fontColor-blueLight,.ms-fontColor-blueLight--hover:hover{color:#00bcf2}.ms-fontColor-tealDark,.ms-fontColor-tealDark--hover:hover{color:#004b50}.ms-fontColor-teal,.ms-fontColor-teal--hover:hover{color:#008272}.ms-fontColor-tealLight,.ms-fontColor-tealLight--hover:hover{color:#00b294}.ms-fontColor-greenDark,.ms-fontColor-greenDark--hover:hover{color:#004b1c}.ms-fontColor-green,.ms-fontColor-green--hover:hover{color:#107c10}.ms-fontColor-greenLight,.ms-fontColor-greenLight--hover:hover{color:#bad80a}.ms-fontColor-info,.ms-fontColor-info--hover:hover{color:#767676}.ms-fontColor-success,.ms-fontColor-success--hover:hover{color:#107c10}.ms-fontColor-alert,.ms-fontColor-alert--hover:hover{color:#d83b01}.ms-fontColor-warning,.ms-fontColor-warning--hover:hover{color:#767676}.ms-fontColor-severeWarning,.ms-fontColor-severeWarning--hover:hover{color:#d83b01}.ms-fontColor-error,.ms-fontColor-error--hover:hover{color:#a80000}[lang=jpn] .ms-font-l,[lang=jpn] .ms-font-m,[lang=jpn] .ms-font-m-plus,[lang=jpn] .ms-font-mi,[lang=jpn] .ms-font-s,[lang=jpn] .ms-font-s-plus,[lang=jpn] .ms-font-su,[lang=jpn] .ms-font-xl,[lang=jpn] .ms-font-xs,[lang=jpn] .ms-font-xxl,[lang=jpn] .ms-fontWeight-light,[lang=jpn] .ms-fontWeight-light-hover:hover,[lang=jpn] .ms-fontWeight-regular,[lang=jpn] .ms-fontWeight-regular-hover:hover,[lang=jpn] .ms-fontWeight-semibold,[lang=jpn] .ms-fontWeight-semibold-hover:hover,[lang=jpn] .ms-fontWeight-semilight,[lang=jpn] .ms-fontWeight-semilight-hover:hover{font-family:Yu Gothic,Meiryo UI,Meiryo,MS Pgothic,Osaka,Segoe UI,-apple-system,BlinkMacSystemFont,Roboto,Helvetica Neue,sans-serif}[lang=kor] .ms-font-l,[lang=kor] .ms-font-m,[lang=kor] .ms-font-m-plus,[lang=kor] .ms-font-mi,[lang=kor] .ms-font-s,[lang=kor] .ms-font-s-plus,[lang=kor] .ms-font-su,[lang=kor] .ms-font-xl,[lang=kor] .ms-font-xs,[lang=kor] .ms-font-xxl,[lang=kor] .ms-fontWeight-light,[lang=kor] .ms-fontWeight-light-hover:hover,[lang=kor] .ms-fontWeight-regular,[lang=kor] .ms-fontWeight-regular-hover:hover,[lang=kor] .ms-fontWeight-semibold,[lang=kor] .ms-fontWeight-semibold-hover:hover,[lang=kor] .ms-fontWeight-semilight,[lang=kor] .ms-fontWeight-semilight-hover:hover{font-family:Malgun Gothic,Gulim,Segoe UI,-apple-system,BlinkMacSystemFont,Roboto,Helvetica Neue,sans-serif}[lang=cmn] .ms-font-l,[lang=cmn] .ms-font-m,[lang=cmn] .ms-font-m-plus,[lang=cmn] .ms-font-mi,[lang=cmn] .ms-font-s,[lang=cmn] .ms-font-s-plus,[lang=cmn] .ms-font-su,[lang=cmn] .ms-font-xl,[lang=cmn] .ms-font-xs,[lang=cmn] .ms-font-xxl,[lang=cmn] .ms-fontWeight-light,[lang=cmn] .ms-fontWeight-light-hover:hover,[lang=cmn] .ms-fontWeight-regular,[lang=cmn] .ms-fontWeight-regular-hover:hover,[lang=cmn] .ms-fontWeight-semibold,[lang=cmn] .ms-fontWeight-semibold-hover:hover,[lang=cmn] .ms-fontWeight-semilight,[lang=cmn] .ms-fontWeight-semilight-hover:hover{font-family:Microsoft Yahei,Verdana,Simsun,Segoe UI,-apple-system,BlinkMacSystemFont,Roboto,Helvetica Neue,sans-serif}[lang=yue] .ms-font-l,[lang=yue] .ms-font-m,[lang=yue] .ms-font-m-plus,[lang=yue] .ms-font-mi,[lang=yue] .ms-font-s,[lang=yue] .ms-font-s-plus,[lang=yue] .ms-font-su,[lang=yue] .ms-font-xl,[lang=yue] .ms-font-xs,[lang=yue] .ms-font-xxl,[lang=yue] .ms-fontWeight-light,[lang=yue] .ms-fontWeight-light-hover:hover,[lang=yue] .ms-fontWeight-regular,[lang=yue] .ms-fontWeight-regular-hover:hover,[lang=yue] .ms-fontWeight-semibold,[lang=yue] .ms-fontWeight-semibold-hover:hover,[lang=yue] .ms-fontWeight-semilight,[lang=yue] .ms-fontWeight-semilight-hover:hover{font-family:Microsoft Jhenghei,Pmingliu,Segoe UI,-apple-system,BlinkMacSystemFont,Roboto,Helvetica Neue,sans-serif}[lang=hin] .ms-font-l,[lang=hin] .ms-font-m,[lang=hin] .ms-font-m-plus,[lang=hin] .ms-font-mi,[lang=hin] .ms-font-s,[lang=hin] .ms-font-s-plus,[lang=hin] .ms-font-su,[lang=hin] .ms-font-xl,[lang=hin] .ms-font-xs,[lang=hin] .ms-font-xxl,[lang=hin] .ms-fontWeight-light,[lang=hin] .ms-fontWeight-light-hover:hover,[lang=hin] .ms-fontWeight-regular,[lang=hin] .ms-fontWeight-regular-hover:hover,[lang=hin] .ms-fontWeight-semibold,[lang=hin] .ms-fontWeight-semibold-hover:hover,[lang=hin] .ms-fontWeight-semilight,[lang=hin] .ms-fontWeight-semilight-hover:hover{font-family:Nirmala UI,Segoe UI,-apple-system,BlinkMacSystemFont,Roboto,Helvetica Neue,sans-serif}[lang=tha] .ms-font-l,[lang=tha] .ms-font-m,[lang=tha] .ms-font-m-plus,[lang=tha] .ms-font-mi,[lang=tha] .ms-font-s,[lang=tha] .ms-font-s-plus,[lang=tha] .ms-font-su,[lang=tha] .ms-font-xl,[lang=tha] .ms-font-xs,[lang=tha] .ms-font-xxl,[lang=tha] .ms-fontWeight-light,[lang=tha] .ms-fontWeight-light-hover:hover,[lang=tha] .ms-fontWeight-regular,[lang=tha] .ms-fontWeight-regular-hover:hover,[lang=tha] .ms-fontWeight-semibold,[lang=tha] .ms-fontWeight-semibold-hover:hover,[lang=tha] .ms-fontWeight-semilight,[lang=tha] .ms-fontWeight-semilight-hover:hover{font-family:Leelawadee UI,Kmer UI,Segoe UI WestEuropean,Segoe UI,-apple-system,BlinkMacSystemFont,Roboto,Helvetica Neue,sans-serif}[lang=ara] .ms-font-l,[lang=ara] .ms-font-m,[lang=ara] .ms-font-m-plus,[lang=ara] .ms-font-mi,[lang=ara] .ms-font-s,[lang=ara] .ms-font-s-plus,[lang=ara] .ms-font-su,[lang=ara] .ms-font-xl,[lang=ara] .ms-font-xs,[lang=ara] .ms-font-xxl,[lang=ara] .ms-fontWeight-light,[lang=ara] .ms-fontWeight-light-hover:hover,[lang=ara] .ms-fontWeight-regular,[lang=ara] .ms-fontWeight-regular-hover:hover,[lang=ara] .ms-fontWeight-semibold,[lang=ara] .ms-fontWeight-semibold-hover:hover,[lang=ara] .ms-fontWeight-semilight,[lang=ara] .ms-fontWeight-semilight-hover:hover{font-family:Segoe UI Arabic,Segoe UI WestEuropean,Segoe UI,-apple-system,BlinkMacSystemFont,Roboto,Helvetica Neue,sans-serif}[lang=ces] .ms-font-l,[lang=ces] .ms-font-m,[lang=ces] .ms-font-m-plus,[lang=ces] .ms-font-mi,[lang=ces] .ms-font-s,[lang=ces] .ms-font-s-plus,[lang=ces] .ms-font-su,[lang=ces] .ms-font-xl,[lang=ces] .ms-font-xs,[lang=ces] .ms-font-xxl,[lang=ces] .ms-fontWeight-light,[lang=ces] .ms-fontWeight-light-hover:hover,[lang=ces] .ms-fontWeight-regular,[lang=ces] .ms-fontWeight-regular-hover:hover,[lang=ces] .ms-fontWeight-semibold,[lang=ces] .ms-fontWeight-semibold-hover:hover,[lang=ces] .ms-fontWeight-semilight,[lang=ces] .ms-fontWeight-semilight-hover:hover,[lang=est] .ms-font-l,[lang=est] .ms-font-m,[lang=est] .ms-font-m-plus,[lang=est] .ms-font-mi,[lang=est] .ms-font-s,[lang=est] .ms-font-s-plus,[lang=est] .ms-font-su,[lang=est] .ms-font-xl,[lang=est] .ms-font-xs,[lang=est] .ms-font-xxl,[lang=est] .ms-fontWeight-light,[lang=est] .ms-fontWeight-light-hover:hover,[lang=est] .ms-fontWeight-regular,[lang=est] .ms-fontWeight-regular-hover:hover,[lang=est] .ms-fontWeight-semibold,[lang=est] .ms-fontWeight-semibold-hover:hover,[lang=est] .ms-fontWeight-semilight,[lang=est] .ms-fontWeight-semilight-hover:hover,[lang=hrv] .ms-font-l,[lang=hrv] .ms-font-m,[lang=hrv] .ms-font-m-plus,[lang=hrv] .ms-font-mi,[lang=hrv] .ms-font-s,[lang=hrv] .ms-font-s-plus,[lang=hrv] .ms-font-su,[lang=hrv] .ms-font-xl,[lang=hrv] .ms-font-xs,[lang=hrv] .ms-font-xxl,[lang=hrv] .ms-fontWeight-light,[lang=hrv] .ms-fontWeight-light-hover:hover,[lang=hrv] .ms-fontWeight-regular,[lang=hrv] .ms-fontWeight-regular-hover:hover,[lang=hrv] .ms-fontWeight-semibold,[lang=hrv] .ms-fontWeight-semibold-hover:hover,[lang=hrv] .ms-fontWeight-semilight,[lang=hrv] .ms-fontWeight-semilight-hover:hover,[lang=hun] .ms-font-l,[lang=hun] .ms-font-m,[lang=hun] .ms-font-m-plus,[lang=hun] .ms-font-mi,[lang=hun] .ms-font-s,[lang=hun] .ms-font-s-plus,[lang=hun] .ms-font-su,[lang=hun] .ms-font-xl,[lang=hun] .ms-font-xs,[lang=hun] .ms-font-xxl,[lang=hun] .ms-fontWeight-light,[lang=hun] .ms-fontWeight-light-hover:hover,[lang=hun] .ms-fontWeight-regular,[lang=hun] .ms-fontWeight-regular-hover:hover,[lang=hun] .ms-fontWeight-semibold,[lang=hun] .ms-fontWeight-semibold-hover:hover,[lang=hun] .ms-fontWeight-semilight,[lang=hun] .ms-fontWeight-semilight-hover:hover,[lang=kaz] .ms-font-l,[lang=kaz] .ms-font-m,[lang=kaz] .ms-font-m-plus,[lang=kaz] .ms-font-mi,[lang=kaz] .ms-font-s,[lang=kaz] .ms-font-s-plus,[lang=kaz] .ms-font-su,[lang=kaz] .ms-font-xl,[lang=kaz] .ms-font-xs,[lang=kaz] .ms-font-xxl,[lang=kaz] .ms-fontWeight-light,[lang=kaz] .ms-fontWeight-light-hover:hover,[lang=kaz] .ms-fontWeight-regular,[lang=kaz] .ms-fontWeight-regular-hover:hover,[lang=kaz] .ms-fontWeight-semibold,[lang=kaz] .ms-fontWeight-semibold-hover:hover,[lang=kaz] .ms-fontWeight-semilight,[lang=kaz] .ms-fontWeight-semilight-hover:hover,[lang=lav] .ms-font-l,[lang=lav] .ms-font-m,[lang=lav] .ms-font-m-plus,[lang=lav] .ms-font-mi,[lang=lav] .ms-font-s,[lang=lav] .ms-font-s-plus,[lang=lav] .ms-font-su,[lang=lav] .ms-font-xl,[lang=lav] .ms-font-xs,[lang=lav] .ms-font-xxl,[lang=lav] .ms-fontWeight-light,[lang=lav] .ms-fontWeight-light-hover:hover,[lang=lav] .ms-fontWeight-regular,[lang=lav] .ms-fontWeight-regular-hover:hover,[lang=lav] .ms-fontWeight-semibold,[lang=lav] .ms-fontWeight-semibold-hover:hover,[lang=lav] .ms-fontWeight-semilight,[lang=lav] .ms-fontWeight-semilight-hover:hover,[lang=lit] .ms-font-l,[lang=lit] .ms-font-m,[lang=lit] .ms-font-m-plus,[lang=lit] .ms-font-mi,[lang=lit] .ms-font-s,[lang=lit] .ms-font-s-plus,[lang=lit] .ms-font-su,[lang=lit] .ms-font-xl,[lang=lit] .ms-font-xs,[lang=lit] .ms-font-xxl,[lang=lit] .ms-fontWeight-light,[lang=lit] .ms-fontWeight-light-hover:hover,[lang=lit] .ms-fontWeight-regular,[lang=lit] .ms-fontWeight-regular-hover:hover,[lang=lit] .ms-fontWeight-semibold,[lang=lit] .ms-fontWeight-semibold-hover:hover,[lang=lit] .ms-fontWeight-semilight,[lang=lit] .ms-fontWeight-semilight-hover:hover,[lang=pol] .ms-font-l,[lang=pol] .ms-font-m,[lang=pol] .ms-font-m-plus,[lang=pol] .ms-font-mi,[lang=pol] .ms-font-s,[lang=pol] .ms-font-s-plus,[lang=pol] .ms-font-su,[lang=pol] .ms-font-xl,[lang=pol] .ms-font-xs,[lang=pol] .ms-font-xxl,[lang=pol] .ms-fontWeight-light,[lang=pol] .ms-fontWeight-light-hover:hover,[lang=pol] .ms-fontWeight-regular,[lang=pol] .ms-fontWeight-regular-hover:hover,[lang=pol] .ms-fontWeight-semibold,[lang=pol] .ms-fontWeight-semibold-hover:hover,[lang=pol] .ms-fontWeight-semilight,[lang=pol] .ms-fontWeight-semilight-hover:hover,[lang=slk] .ms-font-l,[lang=slk] .ms-font-m,[lang=slk] .ms-font-m-plus,[lang=slk] .ms-font-mi,[lang=slk] .ms-font-s,[lang=slk] .ms-font-s-plus,[lang=slk] .ms-font-su,[lang=slk] .ms-font-xl,[lang=slk] .ms-font-xs,[lang=slk] .ms-font-xxl,[lang=slk] .ms-fontWeight-light,[lang=slk] .ms-fontWeight-light-hover:hover,[lang=slk] .ms-fontWeight-regular,[lang=slk] .ms-fontWeight-regular-hover:hover,[lang=slk] .ms-fontWeight-semibold,[lang=slk] .ms-fontWeight-semibold-hover:hover,[lang=slk] .ms-fontWeight-semilight,[lang=slk] .ms-fontWeight-semilight-hover:hover,[lang=tur] .ms-font-l,[lang=tur] .ms-font-m,[lang=tur] .ms-font-m-plus,[lang=tur] .ms-font-mi,[lang=tur] .ms-font-s,[lang=tur] .ms-font-s-plus,[lang=tur] .ms-font-su,[lang=tur] .ms-font-xl,[lang=tur] .ms-font-xs,[lang=tur] .ms-font-xxl,[lang=tur] .ms-fontWeight-light,[lang=tur] .ms-fontWeight-light-hover:hover,[lang=tur] .ms-fontWeight-regular,[lang=tur] .ms-fontWeight-regular-hover:hover,[lang=tur] .ms-fontWeight-semibold,[lang=tur] .ms-fontWeight-semibold-hover:hover,[lang=tur] .ms-fontWeight-semilight,[lang=tur] .ms-fontWeight-semilight-hover:hover{font-family:Segoe UI EastEuropean,Segoe UI WestEuropean,Segoe UI,-apple-system,BlinkMacSystemFont,Roboto,Helvetica Neue,sans-serif}[lang=rus] .ms-font-l,[lang=rus] .ms-font-m,[lang=rus] .ms-font-m-plus,[lang=rus] .ms-font-mi,[lang=rus] .ms-font-s,[lang=rus] .ms-font-s-plus,[lang=rus] .ms-font-su,[lang=rus] .ms-font-xl,[lang=rus] .ms-font-xs,[lang=rus] .ms-font-xxl,[lang=rus] .ms-fontWeight-light,[lang=rus] .ms-fontWeight-light-hover:hover,[lang=rus] .ms-fontWeight-regular,[lang=rus] .ms-fontWeight-regular-hover:hover,[lang=rus] .ms-fontWeight-semibold,[lang=rus] .ms-fontWeight-semibold-hover:hover,[lang=rus] .ms-fontWeight-semilight,[lang=rus] .ms-fontWeight-semilight-hover:hover{font-family:Segoe UI Cyrillic,Segoe UI WestEuropean,Segoe UI,-apple-system,BlinkMacSystemFont,Roboto,Helvetica Neue,sans-serif}[lang=ell] .ms-font-l,[lang=ell] .ms-font-m,[lang=ell] .ms-font-m-plus,[lang=ell] .ms-font-mi,[lang=ell] .ms-font-s,[lang=ell] .ms-font-s-plus,[lang=ell] .ms-font-su,[lang=ell] .ms-font-xl,[lang=ell] .ms-font-xs,[lang=ell] .ms-font-xxl,[lang=ell] .ms-fontWeight-light,[lang=ell] .ms-fontWeight-light-hover:hover,[lang=ell] .ms-fontWeight-regular,[lang=ell] .ms-fontWeight-regular-hover:hover,[lang=ell] .ms-fontWeight-semibold,[lang=ell] .ms-fontWeight-semibold-hover:hover,[lang=ell] .ms-fontWeight-semilight,[lang=ell] .ms-fontWeight-semilight-hover:hover{font-family:Segoe UI Greek,Segoe UI WestEuropean,Segoe UI,-apple-system,BlinkMacSystemFont,Roboto,Helvetica Neue,sans-serif}[lang=heb] .ms-font-l,[lang=heb] .ms-font-m,[lang=heb] .ms-font-m-plus,[lang=heb] .ms-font-mi,[lang=heb] .ms-font-s,[lang=heb] .ms-font-s-plus,[lang=heb] .ms-font-su,[lang=heb] .ms-font-xl,[lang=heb] .ms-font-xs,[lang=heb] .ms-font-xxl,[lang=heb] .ms-fontWeight-light,[lang=heb] .ms-fontWeight-light-hover:hover,[lang=heb] .ms-fontWeight-regular,[lang=heb] .ms-fontWeight-regular-hover:hover,[lang=heb] .ms-fontWeight-semibold,[lang=heb] .ms-fontWeight-semibold-hover:hover,[lang=heb] .ms-fontWeight-semilight,[lang=heb] .ms-fontWeight-semilight-hover:hover{font-family:Segoe UI Hebrew,Segoe UI WestEuropean,Segoe UI,-apple-system,BlinkMacSystemFont,Roboto,Helvetica Neue,sans-serif}[lang=vie] .ms-font-l,[lang=vie] .ms-font-m,[lang=vie] .ms-font-m-plus,[lang=vie] .ms-font-mi,[lang=vie] .ms-font-s,[lang=vie] .ms-font-s-plus,[lang=vie] .ms-font-su,[lang=vie] .ms-font-xl,[lang=vie] .ms-font-xs,[lang=vie] .ms-font-xxl,[lang=vie] .ms-fontWeight-light,[lang=vie] .ms-fontWeight-light-hover:hover,[lang=vie] .ms-fontWeight-regular,[lang=vie] .ms-fontWeight-regular-hover:hover,[lang=vie] .ms-fontWeight-semibold,[lang=vie] .ms-fontWeight-semibold-hover:hover,[lang=vie] .ms-fontWeight-semilight,[lang=vie] .ms-fontWeight-semilight-hover:hover{font-family:Segoe UI Vietnamese,Segoe UI WestEuropean,Segoe UI,-apple-system,BlinkMacSystemFont,Roboto,Helvetica Neue,sans-serif}@font-face{font-family:FabricMDL2Icons;src:url(https://appsforoffice.microsoft.com/fabric/fonts/icons/FabricMDL2Icons.woff) format('woff'),url(https://appsforoffice.microsoft.com/fabric/fonts/icons/FabricMDL2Icons.ttf) format('truetype');font-weight:400;font-style:normal}.ms-Icon{-moz-osx-font-smoothing:grayscale;-webkit-font-smoothing:antialiased;display:inline-block;font-family:FabricMDL2Icons;font-style:normal;font-weight:400;speak:none}.ms-Icon--DecreaseIndentLegacy:before{content:'\E290'}.ms-Icon--IncreaseIndentLegacy:before{content:'\E291'}.ms-Icon--GlobalNavButton:before{content:'\E700'}.ms-Icon--InternetSharing:before{content:'\E704'}.ms-Icon--Brightness:before{content:'\E706'}.ms-Icon--MapPin:before{content:'\E707'}.ms-Icon--Airplane:before{content:'\E709'}.ms-Icon--Tablet:before{content:'\E70A'}.ms-Icon--QuickNote:before{content:'\E70B'}.ms-Icon--ChevronDown:before{content:'\E70D'}.ms-Icon--ChevronUp:before{content:'\E70E'}.ms-Icon--Edit:before{content:'\E70F'}.ms-Icon--Add:before{content:'\E710'}.ms-Icon--Cancel:before{content:'\E711'}.ms-Icon--More:before{content:'\E712'}.ms-Icon--Settings:before{content:'\E713'}.ms-Icon--Video:before{content:'\E714'}.ms-Icon--Mail:before{content:'\E715'}.ms-Icon--People:before{content:'\E716'}.ms-Icon--Phone:before{content:'\E717'}.ms-Icon--Pin:before{content:'\E718'}.ms-Icon--Shop:before{content:'\E719'}.ms-Icon--Link:before{content:'\E71B'}.ms-Icon--Filter:before{content:'\E71C'}.ms-Icon--Zoom:before{content:'\E71E'}.ms-Icon--ZoomOut:before{content:'\E71F'}.ms-Icon--Microphone:before{content:'\E720'}.ms-Icon--Search:before{content:'\E721'}.ms-Icon--Camera:before{content:'\E722'}.ms-Icon--Attach:before{content:'\E723'}.ms-Icon--Send:before{content:'\E724'}.ms-Icon--FavoriteList:before{content:'\E728'}.ms-Icon--PageSolid:before{content:'\E729'}.ms-Icon--Forward:before{content:'\E72A'}.ms-Icon--Back:before{content:'\E72B'}.ms-Icon--Refresh:before{content:'\E72C'}.ms-Icon--Share:before{content:'\E72D'}.ms-Icon--Lock:before{content:'\E72E'}.ms-Icon--EMI:before{content:'\E731'}.ms-Icon--MiniLink:before{content:'\E732'}.ms-Icon--Blocked:before{content:'\E733'}.ms-Icon--FavoriteStar:before{content:'\E734'}.ms-Icon--FavoriteStarFill:before{content:'\E735'}.ms-Icon--ReadingMode:before{content:'\E736'}.ms-Icon--Remove:before{content:'\E738'}.ms-Icon--Checkbox:before{content:'\E739'}.ms-Icon--CheckboxComposite:before{content:'\E73A'}.ms-Icon--CheckboxIndeterminate:before{content:'\E73C'}.ms-Icon--CheckMark:before{content:'\E73E'}.ms-Icon--BackToWindow:before{content:'\E73F'}.ms-Icon--FullScreen:before{content:'\E740'}.ms-Icon--Print:before{content:'\E749'}.ms-Icon--Up:before{content:'\E74A'}.ms-Icon--Down:before{content:'\E74B'}.ms-Icon--Delete:before{content:'\E74D'}.ms-Icon--Save:before{content:'\E74E'}.ms-Icon--Sad:before{content:'\E757'}.ms-Icon--SIPMove:before{content:'\E759'}.ms-Icon--EraseTool:before{content:'\E75C'}.ms-Icon--GripperTool:before{content:'\E75E'}.ms-Icon--Dialpad:before{content:'\E75F'}.ms-Icon--PageLeft:before{content:'\E760'}.ms-Icon--PageRight:before{content:'\E761'}.ms-Icon--MultiSelect:before{content:'\E762'}.ms-Icon--Play:before{content:'\E768'}.ms-Icon--Pause:before{content:'\E769'}.ms-Icon--ChevronLeft:before{content:'\E76B'}.ms-Icon--ChevronRight:before{content:'\E76C'}.ms-Icon--Emoji2:before{content:'\E76E'}.ms-Icon--System:before{content:'\E770'}.ms-Icon--Globe:before{content:'\E774'}.ms-Icon--ContactInfo:before{content:'\E779'}.ms-Icon--Unpin:before{content:'\E77A'}.ms-Icon--Contact:before{content:'\E77B'}.ms-Icon--Memo:before{content:'\E77C'}.ms-Icon--WindowsLogo:before{content:'\E782'}.ms-Icon--Error:before{content:'\E783'}.ms-Icon--Unlock:before{content:'\E785'}.ms-Icon--Calendar:before{content:'\E787'}.ms-Icon--Megaphone:before{content:'\E789'}.ms-Icon--AutoEnhanceOn:before{content:'\E78D'}.ms-Icon--AutoEnhanceOff:before{content:'\E78E'}.ms-Icon--Color:before{content:'\E790'}.ms-Icon--SaveAs:before{content:'\E792'}.ms-Icon--Light:before{content:'\E793'}.ms-Icon--Filters:before{content:'\E795'}.ms-Icon--Contrast:before{content:'\E7A1'}.ms-Icon--Redo:before{content:'\E7A6'}.ms-Icon--Undo:before{content:'\E7A7'}.ms-Icon--Album:before{content:'\E7AB'}.ms-Icon--Rotate:before{content:'\E7AD'}.ms-Icon--PanoIndicator:before{content:'\E7B0'}.ms-Icon--ThumbnailView:before{content:'\E7B6'}.ms-Icon--Package:before{content:'\E7B8'}.ms-Icon--Warning:before{content:'\E7BA'}.ms-Icon--Financial:before{content:'\E7BB'}.ms-Icon--ShoppingCart:before{content:'\E7BF'}.ms-Icon--Train:before{content:'\E7C0'}.ms-Icon--Flag:before{content:'\E7C1'}.ms-Icon--Move:before{content:'\E7C2'}.ms-Icon--Page:before{content:'\E7C3'}.ms-Icon--TouchPointer:before{content:'\E7C9'}.ms-Icon--Merge:before{content:'\E7D5'}.ms-Icon--TurnRight:before{content:'\E7DB'}.ms-Icon--Ferry:before{content:'\E7E3'}.ms-Icon--Tab:before{content:'\E7E9'}.ms-Icon--Admin:before{content:'\E7EF'}.ms-Icon--TVMonitor:before{content:'\E7F4'}.ms-Icon--Speakers:before{content:'\E7F5'}.ms-Icon--Car:before{content:'\E804'}.ms-Icon--EatDrink:before{content:'\E807'}.ms-Icon--LocationCircle:before{content:'\E80E'}.ms-Icon--Home:before{content:'\E80F'}.ms-Icon--SwitcherStartEnd:before{content:'\E810'}.ms-Icon--IncidentTriangle:before{content:'\E814'}.ms-Icon--Touch:before{content:'\E815'}.ms-Icon--MapDirections:before{content:'\E816'}.ms-Icon--History:before{content:'\E81C'}.ms-Icon--Location:before{content:'\E81D'}.ms-Icon--Work:before{content:'\E821'}.ms-Icon--Recent:before{content:'\E823'}.ms-Icon--Hotel:before{content:'\E824'}.ms-Icon--LocationDot:before{content:'\E827'}.ms-Icon--News:before{content:'\E900'}.ms-Icon--Chat:before{content:'\E901'}.ms-Icon--Group:before{content:'\E902'}.ms-Icon--View:before{content:'\E890'}.ms-Icon--Clear:before{content:'\E894'}.ms-Icon--Sync:before{content:'\E895'}.ms-Icon--Download:before{content:'\E896'}.ms-Icon--Help:before{content:'\E897'}.ms-Icon--Upload:before{content:'\E898'}.ms-Icon--Emoji:before{content:'\E899'}.ms-Icon--MailForward:before{content:'\E89C'}.ms-Icon--ClosePane:before{content:'\E89F'}.ms-Icon--OpenPane:before{content:'\E8A0'}.ms-Icon--PreviewLink:before{content:'\E8A1'}.ms-Icon--ZoomIn:before{content:'\E8A3'}.ms-Icon--Bookmarks:before{content:'\E8A4'}.ms-Icon--Document:before{content:'\E8A5'}.ms-Icon--ProtectedDocument:before{content:'\E8A6'}.ms-Icon--OpenInNewWindow:before{content:'\E8A7'}.ms-Icon--MailFill:before{content:'\E8A8'}.ms-Icon--ViewAll:before{content:'\E8A9'}.ms-Icon--Switch:before{content:'\E8AB'}.ms-Icon--Rename:before{content:'\E8AC'}.ms-Icon--Folder:before{content:'\E8B7'}.ms-Icon--Picture:before{content:'\E8B9'}.ms-Icon--ShowResults:before{content:'\E8BC'}.ms-Icon--Message:before{content:'\E8BD'}.ms-Icon--CalendarDay:before{content:'\E8BF'}.ms-Icon--CalendarWeek:before{content:'\E8C0'}.ms-Icon--MailReplyAll:before{content:'\E8C2'}.ms-Icon--Read:before{content:'\E8C3'}.ms-Icon--PaymentCard:before{content:'\E8C7'}.ms-Icon--Copy:before{content:'\E8C8'}.ms-Icon--Important:before{content:'\E8C9'}.ms-Icon--MailReply:before{content:'\E8CA'}.ms-Icon--Sort:before{content:'\E8CB'}.ms-Icon--GotoToday:before{content:'\E8D1'}.ms-Icon--Font:before{content:'\E8D2'}.ms-Icon--FontColor:before{content:'\E8D3'}.ms-Icon--FolderFill:before{content:'\E8D5'}.ms-Icon--Permissions:before{content:'\E8D7'}.ms-Icon--DisableUpdates:before{content:'\E8D8'}.ms-Icon--Unfavorite:before{content:'\E8D9'}.ms-Icon--Italic:before{content:'\E8DB'}.ms-Icon--Underline:before{content:'\E8DC'}.ms-Icon--Bold:before{content:'\E8DD'}.ms-Icon--MoveToFolder:before{content:'\E8DE'}.ms-Icon--Dislike:before{content:'\E8E0'}.ms-Icon--Like:before{content:'\E8E1'}.ms-Icon--AlignRight:before{content:'\E8E2'}.ms-Icon--AlignCenter:before{content:'\E8E3'}.ms-Icon--AlignLeft:before{content:'\E8E4'}.ms-Icon--OpenFile:before{content:'\E8E5'}.ms-Icon--FontDecrease:before{content:'\E8E7'}.ms-Icon--FontIncrease:before{content:'\E8E8'}.ms-Icon--FontSize:before{content:'\E8E9'}.ms-Icon--CellPhone:before{content:'\E8EA'}.ms-Icon--Tag:before{content:'\E8EC'}.ms-Icon--Library:before{content:'\E8F1'}.ms-Icon--PostUpdate:before{content:'\E8F3'}.ms-Icon--NewFolder:before{content:'\E8F4'}.ms-Icon--CalendarReply:before{content:'\E8F5'}.ms-Icon--UnsyncFolder:before{content:'\E8F6'}.ms-Icon--SyncFolder:before{content:'\E8F7'}.ms-Icon--BlockContact:before{content:'\E8F8'}.ms-Icon--AddFriend:before{content:'\E8FA'}.ms-Icon--BulletedList:before{content:'\E8FD'}.ms-Icon--Preview:before{content:'\E8FF'}.ms-Icon--DockLeft:before{content:'\E90C'}.ms-Icon--DockRight:before{content:'\E90D'}.ms-Icon--Repair:before{content:'\E90F'}.ms-Icon--Accounts:before{content:'\E910'}.ms-Icon--RadioBullet:before{content:'\E915'}.ms-Icon--Stopwatch:before{content:'\E916'}.ms-Icon--Clock:before{content:'\E917'}.ms-Icon--AlarmClock:before{content:'\E919'}.ms-Icon--Hospital:before{content:'\E91D'}.ms-Icon--Timer:before{content:'\E91E'}.ms-Icon--FullCircleMask:before{content:'\E91F'}.ms-Icon--LocationFill:before{content:'\E920'}.ms-Icon--ChromeMinimize:before{content:'\E921'}.ms-Icon--Annotation:before{content:'\E924'}.ms-Icon--ChromeClose:before{content:'\E8BB'}.ms-Icon--Accept:before{content:'\E8FB'}.ms-Icon--Fingerprint:before{content:'\E928'}.ms-Icon--Handwriting:before{content:'\E929'}.ms-Icon--StackIndicator:before{content:'\E7FF'}.ms-Icon--Completed:before{content:'\E930'}.ms-Icon--Label:before{content:'\E932'}.ms-Icon--FlickDown:before{content:'\E935'}.ms-Icon--FlickUp:before{content:'\E936'}.ms-Icon--FlickLeft:before{content:'\E937'}.ms-Icon--FlickRight:before{content:'\E938'}.ms-Icon--MusicInCollection:before{content:'\E940'}.ms-Icon--OneDrive:before{content:'\E941'}.ms-Icon--CompassNW:before{content:'\E942'}.ms-Icon--Code:before{content:'\E943'}.ms-Icon--LightningBolt:before{content:'\E945'}.ms-Icon--Info:before{content:'\E946'}.ms-Icon--CalculatorAddition:before{content:'\E948'}.ms-Icon--CalculatorSubtract:before{content:'\E949'}.ms-Icon--PrintfaxPrinterFile:before{content:'\E956'}.ms-Icon--Health:before{content:'\E95E'}.ms-Icon--ChevronUpSmall:before{content:'\E96D'}.ms-Icon--ChevronDownSmall:before{content:'\E96E'}.ms-Icon--ChevronLeftSmall:before{content:'\E96F'}.ms-Icon--ChevronRightSmall:before{content:'\E970'}.ms-Icon--ChevronUpMed:before{content:'\E971'}.ms-Icon--ChevronDownMed:before{content:'\E972'}.ms-Icon--ChevronLeftMed:before{content:'\E973'}.ms-Icon--ChevronRightMed:before{content:'\E974'}.ms-Icon--Dictionary:before{content:'\E82D'}.ms-Icon--ChromeBack:before{content:'\E830'}.ms-Icon--PC1:before{content:'\E977'}.ms-Icon--PresenceChickletVideo:before{content:'\E979'}.ms-Icon--Reply:before{content:'\E97A'}.ms-Icon--DoubleChevronLeftMed:before{content:'\E991'}.ms-Icon--Volume0:before{content:'\E992'}.ms-Icon--Volume1:before{content:'\E993'}.ms-Icon--Volume2:before{content:'\E994'}.ms-Icon--Volume3:before{content:'\E995'}.ms-Icon--CaretHollow:before{content:'\E817'}.ms-Icon--CaretSolid:before{content:'\E818'}.ms-Icon--Pinned:before{content:'\E840'}.ms-Icon--PinnedFill:before{content:'\E842'}.ms-Icon--Chart:before{content:'\E999'}.ms-Icon--BidiLtr:before{content:'\E9AA'}.ms-Icon--BidiRtl:before{content:'\E9AB'}.ms-Icon--RevToggleKey:before{content:'\E845'}.ms-Icon--RightDoubleQuote:before{content:'\E9B1'}.ms-Icon--Sunny:before{content:'\E9BD'}.ms-Icon--CloudWeather:before{content:'\E9BE'}.ms-Icon--Cloudy:before{content:'\E9BF'}.ms-Icon--PartlyCloudyDay:before{content:'\E9C0'}.ms-Icon--PartlyCloudyNight:before{content:'\E9C1'}.ms-Icon--ClearNight:before{content:'\E9C2'}.ms-Icon--RainShowersDay:before{content:'\E9C3'}.ms-Icon--Rain:before{content:'\E9C4'}.ms-Icon--Thunderstorms:before{content:'\E9C6'}.ms-Icon--RainSnow:before{content:'\E9C7'}.ms-Icon--BlowingSnow:before{content:'\E9C9'}.ms-Icon--Frigid:before{content:'\E9CA'}.ms-Icon--Fog:before{content:'\E9CB'}.ms-Icon--Squalls:before{content:'\E9CC'}.ms-Icon--Duststorm:before{content:'\E9CD'}.ms-Icon--Precipitation:before{content:'\E9CF'}.ms-Icon--Ringer:before{content:'\EA8F'}.ms-Icon--PDF:before{content:'\EA90'}.ms-Icon--SortLines:before{content:'\E9D0'}.ms-Icon--Ribbon:before{content:'\E9D1'}.ms-Icon--CheckList:before{content:'\E9D5'}.ms-Icon--Generate:before{content:'\E9DA'}.ms-Icon--Equalizer:before{content:'\E9E9'}.ms-Icon--BarChartHorizontal:before{content:'\E9EB'}.ms-Icon--Freezing:before{content:'\E9EF'}.ms-Icon--SnowShowerDay:before{content:'\E9FD'}.ms-Icon--HailDay:before{content:'\EA00'}.ms-Icon--WorkFlow:before{content:'\EA01'}.ms-Icon--StoreLogoMed:before{content:'\EA04'}.ms-Icon--RainShowersNight:before{content:'\EA0F'}.ms-Icon--SnowShowerNight:before{content:'\EA11'}.ms-Icon--HailNight:before{content:'\EA13'}.ms-Icon--Info2:before{content:'\EA1F'}.ms-Icon--StoreLogo:before{content:'\EA96'}.ms-Icon--MultiSelectMirrored:before{content:'\EA98'}.ms-Icon--Broom:before{content:'\EA99'}.ms-Icon--MusicInCollectionFill:before{content:'\EA36'}.ms-Icon--List:before{content:'\EA37'}.ms-Icon--Asterisk:before{content:'\EA38'}.ms-Icon--ErrorBadge:before{content:'\EA39'}.ms-Icon--CircleRing:before{content:'\EA3A'}.ms-Icon--CircleFill:before{content:'\EA3B'}.ms-Icon--BookmarksMirrored:before{content:'\EA41'}.ms-Icon--BulletedListMirrored:before{content:'\EA42'}.ms-Icon--CaretHollowMirrored:before{content:'\EA45'}.ms-Icon--CaretSolidMirrored:before{content:'\EA46'}.ms-Icon--ChromeBackMirrored:before{content:'\EA47'}.ms-Icon--ClosePaneMirrored:before{content:'\EA49'}.ms-Icon--DockLeftMirrored:before{content:'\EA4C'}.ms-Icon--DoubleChevronLeftMedMirrored:before{content:'\EA4D'}.ms-Icon--HelpMirrored:before{content:'\EA51'}.ms-Icon--ListMirrored:before{content:'\EA55'}.ms-Icon--MailForwardMirrored:before{content:'\EA56'}.ms-Icon--MailReplyMirrored:before{content:'\EA57'}.ms-Icon--MailReplyAllMirrored:before{content:'\EA58'}.ms-Icon--OpenPaneMirrored:before{content:'\EA5B'}.ms-Icon--SendMirrored:before{content:'\EA63'}.ms-Icon--ShowResultsMirrored:before{content:'\EA65'}.ms-Icon--ThumbnailViewMirrored:before{content:'\EA67'}.ms-Icon--Lightbulb:before{content:'\EA80'}.ms-Icon--StatusTriangle:before{content:'\EA82'}.ms-Icon--VolumeDisabled:before{content:'\EA85'}.ms-Icon--Puzzle:before{content:'\EA86'}.ms-Icon--EmojiNeutral:before{content:'\EA87'}.ms-Icon--EmojiDisappointed:before{content:'\EA88'}.ms-Icon--HomeSolid:before{content:'\EA8A'}.ms-Icon--Cocktails:before{content:'\EA9D'}.ms-Icon--Articles:before{content:'\EAC1'}.ms-Icon--Cycling:before{content:'\EAC7'}.ms-Icon--DietPlanNotebook:before{content:'\EAC8'}.ms-Icon--Pill:before{content:'\EACB'}.ms-Icon--Running:before{content:'\EADA'}.ms-Icon--Weights:before{content:'\EADB'}.ms-Icon--BarChart4:before{content:'\EAE7'}.ms-Icon--CirclePlus:before{content:'\EAEE'}.ms-Icon--Coffee:before{content:'\EAEF'}.ms-Icon--Cotton:before{content:'\EAF3'}.ms-Icon--Market:before{content:'\EAFC'}.ms-Icon--Money:before{content:'\EAFD'}.ms-Icon--PieDouble:before{content:'\EB04'}.ms-Icon--RemoveFilter:before{content:'\EB08'}.ms-Icon--StockDown:before{content:'\EB0F'}.ms-Icon--StockUp:before{content:'\EB11'}.ms-Icon--Cricket:before{content:'\EB1E'}.ms-Icon--Golf:before{content:'\EB1F'}.ms-Icon--Baseball:before{content:'\EB20'}.ms-Icon--Soccer:before{content:'\EB21'}.ms-Icon--MoreSports:before{content:'\EB22'}.ms-Icon--AutoRacing:before{content:'\EB24'}.ms-Icon--CollegeHoops:before{content:'\EB25'}.ms-Icon--CollegeFootball:before{content:'\EB26'}.ms-Icon--ProFootball:before{content:'\EB27'}.ms-Icon--ProHockey:before{content:'\EB28'}.ms-Icon--Rugby:before{content:'\EB2D'}.ms-Icon--Tennis:before{content:'\EB33'}.ms-Icon--Arrivals:before{content:'\EB34'}.ms-Icon--Design:before{content:'\EB3C'}.ms-Icon--Website:before{content:'\EB41'}.ms-Icon--Drop:before{content:'\EB42'}.ms-Icon--Snow:before{content:'\EB46'}.ms-Icon--BusSolid:before{content:'\EB47'}.ms-Icon--FerrySolid:before{content:'\EB48'}.ms-Icon--TrainSolid:before{content:'\EB4D'}.ms-Icon--Heart:before{content:'\EB51'}.ms-Icon--HeartFill:before{content:'\EB52'}.ms-Icon--Ticket:before{content:'\EB54'}.ms-Icon--AzureLogo:before{content:'\EB6A'}.ms-Icon--BingLogo:before{content:'\EB6B'}.ms-Icon--MSNLogo:before{content:'\EB6C'}.ms-Icon--OutlookLogo:before{content:'\EB6D'}.ms-Icon--OfficeLogo:before{content:'\EB6E'}.ms-Icon--SkypeLogo:before{content:'\EB6F'}.ms-Icon--Door:before{content:'\EB75'}.ms-Icon--EditMirrored:before{content:'\EB7E'}.ms-Icon--GiftCard:before{content:'\EB8E'}.ms-Icon--DoubleBookmark:before{content:'\EB8F'}.ms-Icon--StatusErrorFull:before{content:'\EB90'}.ms-Icon--Certificate:before{content:'\EB95'}.ms-Icon--Photo2:before{content:'\EB9F'}.ms-Icon--CloudDownload:before{content:'\EBD3'}.ms-Icon--WindDirection:before{content:'\EBE6'}.ms-Icon--Family:before{content:'\EBDA'}.ms-Icon--CSS:before{content:'\EBEF'}.ms-Icon--JS:before{content:'\EBF0'}.ms-Icon--ReminderGroup:before{content:'\EBF8'}.ms-Icon--Section:before{content:'\EC0C'}.ms-Icon--OneNoteLogo:before{content:'\EC0D'}.ms-Icon--ToggleFilled:before{content:'\EC11'}.ms-Icon--ToggleBorder:before{content:'\EC12'}.ms-Icon--SliderThumb:before{content:'\EC13'}.ms-Icon--ToggleThumb:before{content:'\EC14'}.ms-Icon--Documentation:before{content:'\EC17'}.ms-Icon--Badge:before{content:'\EC1B'}.ms-Icon--Giftbox:before{content:'\EC1F'}.ms-Icon--ExcelLogo:before{content:'\EC28'}.ms-Icon--WordLogo:before{content:'\EC29'}.ms-Icon--PowerPointLogo:before{content:'\EC2A'}.ms-Icon--Cafe:before{content:'\EC32'}.ms-Icon--SpeedHigh:before{content:'\EC4A'}.ms-Icon--MusicNote:before{content:'\EC4F'}.ms-Icon--EdgeLogo:before{content:'\EC60'}.ms-Icon--CompletedSolid:before{content:'\EC61'}.ms-Icon--AlbumRemove:before{content:'\EC62'}.ms-Icon--MessageFill:before{content:'\EC70'}.ms-Icon--TabletSelected:before{content:'\EC74'}.ms-Icon--MobileSelected:before{content:'\EC75'}.ms-Icon--LaptopSelected:before{content:'\EC76'}.ms-Icon--TVMonitorSelected:before{content:'\EC77'}.ms-Icon--DeveloperTools:before{content:'\EC7A'}.ms-Icon--InsertTextBox:before{content:'\EC7D'}.ms-Icon--LowerBrightness:before{content:'\EC8A'}.ms-Icon--CloudUpload:before{content:'\EC8E'}.ms-Icon--DateTime:before{content:'\EC92'}.ms-Icon--Event:before{content:'\ECA3'}.ms-Icon--Cake:before{content:'\ECA4'}.ms-Icon--Tiles:before{content:'\ECA5'}.ms-Icon--Org:before{content:'\ECA6'}.ms-Icon--PartyLeader:before{content:'\ECA7'}.ms-Icon--DRM:before{content:'\ECA8'}.ms-Icon--CloudAdd:before{content:'\ECA9'}.ms-Icon--AppIconDefault:before{content:'\ECAA'}.ms-Icon--Photo2Add:before{content:'\ECAB'}.ms-Icon--Photo2Remove:before{content:'\ECAC'}.ms-Icon--POI:before{content:'\ECAF'}.ms-Icon--FacebookLogo:before{content:'\ECB3'}.ms-Icon--AddTo:before{content:'\ECC8'}.ms-Icon--RadioBtnOn:before{content:'\ECCB'}.ms-Icon--Embed:before{content:'\ECCE'}.ms-Icon--VideoSolid:before{content:'\EA0C'}.ms-Icon--Teamwork:before{content:'\EA12'}.ms-Icon--PeopleAdd:before{content:'\EA15'}.ms-Icon--Glasses:before{content:'\EA16'}.ms-Icon--DateTime2:before{content:'\EA17'}.ms-Icon--Shield:before{content:'\EA18'}.ms-Icon--Header1:before{content:'\EA19'}.ms-Icon--PageAdd:before{content:'\EA1A'}.ms-Icon--NumberedList:before{content:'\EA1C'}.ms-Icon--PowerBILogo:before{content:'\EA1E'}.ms-Icon--Product:before{content:'\ECDC'}.ms-Icon--Blocked2:before{content:'\ECE4'}.ms-Icon--FangBody:before{content:'\ECEB'}.ms-Icon--Glimmer:before{content:'\ECF4'}.ms-Icon--ChatInviteFriend:before{content:'\ECFE'}.ms-Icon--SharepointLogo:before{content:'\ED18'}.ms-Icon--YammerLogo:before{content:'\ED19'}.ms-Icon--ReturnToSession:before{content:'\ED24'}.ms-Icon--OpenFolderHorizontal:before{content:'\ED25'}.ms-Icon--CalendarMirrored:before{content:'\ED28'}.ms-Icon--SwayLogo:before{content:'\ED29'}.ms-Icon--OutOfOffice:before{content:'\ED34'}.ms-Icon--Trophy:before{content:'\ED3F'}.ms-Icon--ReopenPages:before{content:'\ED50'}.ms-Icon--AADLogo:before{content:'\ED68'}.ms-Icon--AccessLogo:before{content:'\ED69'}.ms-Icon--AdminALogo:before{content:'\ED6A'}.ms-Icon--AdminCLogo:before{content:'\ED6B'}.ms-Icon--AdminDLogo:before{content:'\ED6C'}.ms-Icon--AdminELogo:before{content:'\ED6D'}.ms-Icon--AdminLLogo:before{content:'\ED6E'}.ms-Icon--AdminMLogo:before{content:'\ED6F'}.ms-Icon--AdminOLogo:before{content:'\ED70'}.ms-Icon--AdminPLogo:before{content:'\ED71'}.ms-Icon--AdminSLogo:before{content:'\ED72'}.ms-Icon--AdminYLogo:before{content:'\ED73'}.ms-Icon--AlchemyLogo:before{content:'\ED74'}.ms-Icon--BoxLogo:before{content:'\ED75'}.ms-Icon--DelveLogo:before{content:'\ED76'}.ms-Icon--DropboxLogo:before{content:'\ED77'}.ms-Icon--ExchangeLogo:before{content:'\ED78'}.ms-Icon--LyncLogo:before{content:'\ED79'}.ms-Icon--OfficeVideoLogo:before{content:'\ED7A'}.ms-Icon--ParatureLogo:before{content:'\ED7B'}.ms-Icon--SocialListeningLogo:before{content:'\ED7C'}.ms-Icon--VisioLogo:before{content:'\ED7D'}.ms-Icon--Balloons:before{content:'\ED7E'}.ms-Icon--Cat:before{content:'\ED7F'}.ms-Icon--MailAlert:before{content:'\ED80'}.ms-Icon--MailCheck:before{content:'\ED81'}.ms-Icon--MailLowImportance:before{content:'\ED82'}.ms-Icon--MailPause:before{content:'\ED83'}.ms-Icon--MailRepeat:before{content:'\ED84'}.ms-Icon--SecurityGroup:before{content:'\ED85'}.ms-Icon--Table:before{content:'\ED86'}.ms-Icon--VoicemailForward:before{content:'\ED87'}.ms-Icon--VoicemailReply:before{content:'\ED88'}.ms-Icon--Waffle:before{content:'\ED89'}.ms-Icon--RemoveEvent:before{content:'\ED8A'}.ms-Icon--EventInfo:before{content:'\ED8B'}.ms-Icon--ForwardEvent:before{content:'\ED8C'}.ms-Icon--WipePhone:before{content:'\ED8D'}.ms-Icon--AddOnlineMeeting:before{content:'\ED8E'}.ms-Icon--JoinOnlineMeeting:before{content:'\ED8F'}.ms-Icon--RemoveLink:before{content:'\ED90'}.ms-Icon--PeopleBlock:before{content:'\ED91'}.ms-Icon--PeopleRepeat:before{content:'\ED92'}.ms-Icon--PeopleAlert:before{content:'\ED93'}.ms-Icon--PeoplePause:before{content:'\ED94'}.ms-Icon--TransferCall:before{content:'\ED95'}.ms-Icon--AddPhone:before{content:'\ED96'}.ms-Icon--UnknownCall:before{content:'\ED97'}.ms-Icon--NoteReply:before{content:'\ED98'}.ms-Icon--NoteForward:before{content:'\ED99'}.ms-Icon--NotePinned:before{content:'\ED9A'}.ms-Icon--RemoveOccurrence:before{content:'\ED9B'}.ms-Icon--Timeline:before{content:'\ED9C'}.ms-Icon--EditNote:before{content:'\ED9D'}.ms-Icon--CircleHalfFull:before{content:'\ED9E'}.ms-Icon--Room:before{content:'\ED9F'}.ms-Icon--Unsubscribe:before{content:'\EDA0'}.ms-Icon--Subscribe:before{content:'\EDA1'}.ms-Icon--RecurringTask:before{content:'\EDB2'}.ms-Icon--TaskManager:before{content:'\EDB7'}.ms-Icon--TaskManagerMirrored:before{content:'\EDB8'}.ms-Icon--Combine:before{content:'\EDBB'}.ms-Icon--Split:before{content:'\EDBC'}.ms-Icon--DoubleChevronUp:before{content:'\EDBD'}.ms-Icon--DoubleChevronLeft:before{content:'\EDBE'}.ms-Icon--DoubleChevronRight:before{content:'\EDBF'}.ms-Icon--Ascending:before{content:'\EDC0'}.ms-Icon--Descending:before{content:'\EDC1'}.ms-Icon--TextBox:before{content:'\EDC2'}.ms-Icon--TextField:before{content:'\EDC3'}.ms-Icon--NumberField:before{content:'\EDC4'}.ms-Icon--Dropdown:before{content:'\EDC5'}.ms-Icon--BookingsLogo:before{content:'\EDC7'}.ms-Icon--ClassNotebookLogo:before{content:'\EDC8'}.ms-Icon--CollabsDBLogo:before{content:'\EDC9'}.ms-Icon--DelveAnalyticsLogo:before{content:'\EDCA'}.ms-Icon--DocsLogo:before{content:'\EDCB'}.ms-Icon--DynamicsCRMLogo:before{content:'\EDCC'}.ms-Icon--DynamicSMBLogo:before{content:'\EDCD'}.ms-Icon--OfficeAssistantLogo:before{content:'\EDCE'}.ms-Icon--OfficeStoreLogo:before{content:'\EDCF'}.ms-Icon--OneNoteEduLogo:before{content:'\EDD0'}.ms-Icon--Planner:before{content:'\EDD1'}.ms-Icon--PowerApps:before{content:'\EDD2'}.ms-Icon--Suitcase:before{content:'\EDD3'}.ms-Icon--ProjectLogo:before{content:'\EDD4'}.ms-Icon--CaretLeft8:before{content:'\EDD5'}.ms-Icon--CaretRight8:before{content:'\EDD6'}.ms-Icon--CaretUp8:before{content:'\EDD7'}.ms-Icon--CaretDown8:before{content:'\EDD8'}.ms-Icon--CaretLeftSolid8:before{content:'\EDD9'}.ms-Icon--CarotRightSolid8:before{content:'\EDDA'}.ms-Icon--CaretUpSolid8:before{content:'\EDDB'}.ms-Icon--CaretDownSolid8:before{content:'\EDDC'}.ms-Icon--ClearFormatting:before{content:'\EDDD'}.ms-Icon--Superscript:before{content:'\EDDE'}.ms-Icon--Subscript:before{content:'\EDDF'}.ms-Icon--Strikethrough:before{content:'\EDE0'}.ms-Icon--SingleBookmark:before{content:'\EDFF'}.ms-Icon--DoubleChevronDown:before{content:'\EE04'}.ms-Icon--ReplyAll:before{content:'\EE0A'}.ms-Icon--GoogleDriveLogo:before{content:'\EE0B'}.ms-Icon--Questionnaire:before{content:'\EE19'}.ms-Icon--ReplyMirrored:before{content:'\EE35'}.ms-Icon--ReplyAllMirrored:before{content:'\EE36'}.ms-Icon--AddGroup:before{content:'\EE3D'}.ms-Icon--QuestionnaireMirrored:before{content:'\EE4B'}.ms-Icon--TemporaryUser:before{content:'\EE58'}.ms-Icon--GroupedDescending:before{content:'\EE66'}.ms-Icon--GroupedAscending:before{content:'\EE67'}.ms-Icon--SortUp:before{content:'\EE68'}.ms-Icon--SortDown:before{content:'\EE69'}.ms-Icon--AwayStatus:before{content:'\EE6A'}.ms-Icon--SyncToPC:before{content:'\EE6E'}.ms-Icon--AustralianRules:before{content:'\EE70'}.ms-Icon--DateTimeMirrored:before{content:'\EE93'}.ms-Icon--DoubleChevronUp12:before{content:'\EE96'}.ms-Icon--DoubleChevronDown12:before{content:'\EE97'}.ms-Icon--DoubleChevronLeft12:before{content:'\EE98'}.ms-Icon--DoubleChevronRight12:before{content:'\EE99'}.ms-Icon--CalendarAgenda:before{content:'\EE9A'}.ms-Icon--AddEvent:before{content:'\EEB5'}.ms-Icon--AssetLibrary:before{content:'\EEB6'}.ms-Icon--DataConnectionLibrary:before{content:'\EEB7'}.ms-Icon--DocLibrary:before{content:'\EEB8'}.ms-Icon--FormLibrary:before{content:'\EEB9'}.ms-Icon--FormLibraryMirrored:before{content:'\EEBA'}.ms-Icon--ReportLibrary:before{content:'\EEBB'}.ms-Icon--ReportLibraryMirrored:before{content:'\EEBC'}.ms-Icon--ContactCard:before{content:'\EEBD'}.ms-Icon--CustomList:before{content:'\EEBE'}.ms-Icon--CustomListMirrored:before{content:'\EEBF'}.ms-Icon--IssueTracking:before{content:'\EEC0'}.ms-Icon--IssueTrackingMirrored:before{content:'\EEC1'}.ms-Icon--PictureLibrary:before{content:'\EEC2'}.ms-Icon--AppForOfficeLogo:before{content:'\EEC7'}.ms-Icon--OfflineOneDriveParachute:before{content:'\EEC8'}.ms-Icon--OfflineOneDriveParachuteDisabled:before{content:'\EEC9'}.ms-Icon--LargeGrid:before{content:'\EECB'}.ms-Icon--TriangleSolidUp12:before{content:'\EECC'}.ms-Icon--TriangleSolidDown12:before{content:'\EECD'}.ms-Icon--TriangleSolidLeft12:before{content:'\EECE'}.ms-Icon--TriangleSolidRight12:before{content:'\EECF'}.ms-Icon--TriangleUp12:before{content:'\EED0'}.ms-Icon--TriangleDown12:before{content:'\EED1'}.ms-Icon--TriangleLeft12:before{content:'\EED2'}.ms-Icon--TriangleRight12:before{content:'\EED3'}.ms-Icon--ArrowUpRight8:before{content:'\EED4'}.ms-Icon--ArrowDownRight8:before{content:'\EED5'}.ms-Icon--DocumentSet:before{content:'\EED6'}.ms-Icon--DelveAnalytics:before{content:'\EEEE'}.ms-Icon--ArrowUpRightMirrored8:before{content:'\EEEF'}.ms-Icon--ArrowDownRightMirrored8:before{content:'\EEF0'}.ms-Icon--OneDriveAdd:before{content:'\EF32'}.ms-Icon--Header2:before{content:'\EF36'}.ms-Icon--Header3:before{content:'\EF37'}.ms-Icon--Header4:before{content:'\EF38'}.ms-Icon--MarketDown:before{content:'\EF42'}.ms-Icon--CalendarWorkWeek:before{content:'\EF51'}.ms-Icon--SidePanel:before{content:'\EF52'}.ms-Icon--GlobeFavorite:before{content:'\EF53'}.ms-Icon--CaretTopLeftSolid8:before{content:'\EF54'}.ms-Icon--CaretTopRightSolid8:before{content:'\EF55'}.ms-Icon--ViewAll2:before{content:'\EF56'}.ms-Icon--DocumentReply:before{content:'\EF57'}.ms-Icon--PlayerSettings:before{content:'\EF58'}.ms-Icon--ReceiptForward:before{content:'\EF59'}.ms-Icon--ReceiptReply:before{content:'\EF5A'}.ms-Icon--ReceiptCheck:before{content:'\EF5B'}.ms-Icon--Fax:before{content:'\EF5C'}.ms-Icon--RecurringEvent:before{content:'\EF5D'}.ms-Icon--ReplyAlt:before{content:'\EF5E'}.ms-Icon--ReplyAllAlt:before{content:'\EF5F'}.ms-Icon--EditStyle:before{content:'\EF60'}.ms-Icon--EditMail:before{content:'\EF61'}.ms-Icon--Lifesaver:before{content:'\EF62'}.ms-Icon--LifesaverLock:before{content:'\EF63'}.ms-Icon--InboxCheck:before{content:'\EF64'}.ms-Icon--FolderSearch:before{content:'\EF65'}.ms-Icon--CollapseMenu:before{content:'\EF66'}.ms-Icon--ExpandMenu:before{content:'\EF67'}.ms-Icon--Boards:before{content:'\EF68'}.ms-Icon--SunAdd:before{content:'\EF69'}.ms-Icon--SunQuestionMark:before{content:'\EF6A'}.ms-Icon--LandscapeOrientation:before{content:'\EF6B'}.ms-Icon--DocumentSearch:before{content:'\EF6C'}.ms-Icon--PublicCalendar:before{content:'\EF6D'}.ms-Icon--PublicContactCard:before{content:'\EF6E'}.ms-Icon--PublicEmail:before{content:'\EF6F'}.ms-Icon--PublicFolder:before{content:'\EF70'}.ms-Icon--WordDocument:before{content:'\EF71'}.ms-Icon--PowerPointDocument:before{content:'\EF72'}.ms-Icon--ExcelDocument:before{content:'\EF73'}.ms-Icon--GroupedList:before{content:'\EF74'}.ms-Icon--ClassroomLogo:before{content:'\EF75'}.ms-Icon--Sections:before{content:'\EF76'}.ms-Icon--EditPhoto:before{content:'\EF77'}.ms-Icon--Starburst:before{content:'\EF78'}.ms-Icon--ShareiOS:before{content:'\EF79'}.ms-Icon--AirTickets:before{content:'\EF7A'}.ms-Icon--PencilReply:before{content:'\EF7B'}.ms-Icon--Tiles2:before{content:'\EF7C'}.ms-Icon--SkypeCircleCheck:before{content:'\EF7D'}.ms-Icon--SkypeCircleClock:before{content:'\EF7E'}.ms-Icon--SkypeCircleMinus:before{content:'\EF7F'}.ms-Icon--SkypeCheck:before{content:'\EF80'}.ms-Icon--SkypeClock:before{content:'\EF81'}.ms-Icon--SkypeMinus:before{content:'\EF82'}.ms-Icon--SkypeMessage:before{content:'\EF83'}.ms-Icon--ClosedCaption:before{content:'\EF84'}.ms-Icon--ATPLogo:before{content:'\EF85'}.ms-Icon--OfficeFormLogo:before{content:'\EF86'}.ms-Icon--RecycleBin:before{content:'\EF87'}.ms-Icon--EmptyRecycleBin:before{content:'\EF88'}.ms-Icon--Hide2:before{content:'\EF89'}.ms-Icon--iOSAppStoreLogo:before{content:'\EF8A'}.ms-Icon--AndroidLogo:before{content:'\EF8B'}.ms-Icon--Breadcrumb:before{content:'\EF8C'}.ms-Icon--ClearFilter:before{content:'\EF8F'}.ms-Icon--Flow:before{content:'\EF90'}.ms-Icon--PowerAppsLogo:before{content:'\F091'}.ms-Icon--PowerApps2Logo:before{content:'\F092'}.ms-Icon--circle{position:relative;display:inline-block;font-size:1rem;width:1em;height:1em;margin:0 0 0 .5em;padding:0;text-align:right;-webkit-font-smoothing:antialiased}.ms-Icon--circle:after,.ms-Icon--circle:before{line-height:1;font-size:inherit}.ms-Icon--circle:before{display:block;width:100%;height:100%;margin:0;padding:0;vertical-align:top;position:absolute}.ms-Icon--circle:after{content:'\e000';position:absolute;top:0;right:0;transform:scale(2);transform-origin:50% 50%;z-index:0}.ms-Icon--xs{font-size:10px}.ms-Icon--s{font-size:12px}.ms-Icon--m{font-size:16px}.ms-Icon--l{font-size:20px}.ms-Icon--arrowDownLeft:before,.ms-Icon--arrowDownRight:before,.ms-Icon--arrowLeft,.ms-Icon--arrowRight,.ms-Icon--arrowUpLeft:before,.ms-Icon--arrowUpRight:before,.ms-Icon--bundle:before,.ms-Icon--calendar,.ms-Icon--caretDownLeft,.ms-Icon--caretDownRight,.ms-Icon--caretLeft,.ms-Icon--caretLeftOutline,.ms-Icon--caretRight,.ms-Icon--caretRightOutline,.ms-Icon--caretUpLeft,.ms-Icon--caretUpRight,.ms-Icon--cart,.ms-Icon--chart,.ms-Icon--chat,.ms-Icon--check,.ms-Icon--checkbox,.ms-Icon--checkboxCheck,.ms-Icon--checkPeople,.ms-Icon--chevronLeft,.ms-Icon--chevronRight,.ms-Icon--chevronsLeft,.ms-Icon--chevronsRight,.ms-Icon--chevronThickLeft,.ms-Icon--chevronThickRight,.ms-Icon--chevronThinLeft,.ms-Icon--chevronThinRight,.ms-Icon--contactForm,.ms-Icon--contactPublic:before,.ms-Icon--copy:before,.ms-Icon--directions,.ms-Icon--document,.ms-Icon--documentForward,.ms-Icon--documentLandscape,.ms-Icon--documentReply,.ms-Icon--dropdown,.ms-Icon--eventRecurring,.ms-Icon--eventShare,.ms-Icon--fileDocument:before,.ms-Icon--folder,.ms-Icon--folderMove,.ms-Icon--folderSearch,.ms-Icon--graph,.ms-Icon--inboxCheck,.ms-Icon--late,.ms-Icon--listBullets,.ms-Icon--listCheck,.ms-Icon--listCheckbox,.ms-Icon--listGroup,.ms-Icon--listGroup2:before,.ms-Icon--mailSend,.ms-Icon--mailSync,.ms-Icon--metadata,.ms-Icon--multiChoice,.ms-Icon--note,.ms-Icon--notebook,.ms-Icon--noteForward,.ms-Icon--noteReply,.ms-Icon--notRecurring,.ms-Icon--oofReply,.ms-Icon--page,.ms-Icon--peopleCheck,.ms-Icon--peopleSync,.ms-Icon--pinLeft,.ms-Icon--play,.ms-Icon--pointItem,.ms-Icon--post,.ms-Icon--question,.ms-Icon--questionReverse,.ms-Icon--reactivate,.ms-Icon--receiptCheck,.ms-Icon--receiptForward,.ms-Icon--receiptReply,.ms-Icon--refresh,.ms-Icon--reload,.ms-Icon--reply,.ms-Icon--replyAll,.ms-Icon--replyAllAlt,.ms-Icon--replyAlt,.ms-Icon--sections:before,.ms-Icon--socialListening,.ms-Icon--sortLines,.ms-Icon--sunQuestion,.ms-Icon--taskRecurring,.ms-Icon--tasks,.ms-Icon--timeline .ms-Icon--mailCheck,.ms-Icon--toggle,.ms-Icon--triangleEmptyLeft:before,.ms-Icon--triangleEmptyRight:before,.ms-Icon--triangleLeft:before,.ms-Icon--triangleRight:before,.ms-Icon--voicemailForward,.ms-Icon--voicemailReply{transform:scaleX(-1)}.ms-u-slideRightIn10{animation-name:fadeIn,slideRightIn10;-webkit-animation-duration:.367s;-moz-animation-duration:.367s;-ms-animation-duration:.367s;-o-animation-duration:.367s;animation-timing-function:cubic-bezier(.1,.9,.2,1);animation-fill-mode:both}@keyframes slideRightIn10{0%{transform:translate3d(-10px,0,0)}to{transform:translateZ(0)}}.ms-u-slideRightIn20{animation-name:fadeIn,slideRightIn20;-webkit-animation-duration:.367s;-moz-animation-duration:.367s;-ms-animation-duration:.367s;-o-animation-duration:.367s;animation-timing-function:cubic-bezier(.1,.9,.2,1);animation-fill-mode:both}@keyframes slideRightIn20{0%{transform:translate3d(-20px,0,0)}to{transform:translateZ(0)}}.ms-u-slideRightIn40{animation-name:fadeIn,slideRightIn40;-webkit-animation-duration:.367s;-moz-animation-duration:.367s;-ms-animation-duration:.367s;-o-animation-duration:.367s;animation-timing-function:cubic-bezier(.1,.9,.2,1);animation-fill-mode:both}@keyframes slideRightIn40{0%{transform:translate3d(-40px,0,0)}to{transform:translateZ(0)}}.ms-u-slideLeftIn10{animation-name:fadeIn,slideLeftIn10;-webkit-animation-duration:.367s;-moz-animation-duration:.367s;-ms-animation-duration:.367s;-o-animation-duration:.367s;animation-timing-function:cubic-bezier(.1,.9,.2,1);animation-fill-mode:both}@keyframes slideLeftIn10{0%{transform:translate3d(10px,0,0)}to{transform:translateZ(0)}}.ms-u-slideLeftIn20{animation-name:fadeIn,slideLeftIn20;-webkit-animation-duration:.367s;-moz-animation-duration:.367s;-ms-animation-duration:.367s;-o-animation-duration:.367s;animation-timing-function:cubic-bezier(.1,.9,.2,1);animation-fill-mode:both}@keyframes slideLeftIn20{0%{transform:translate3d(20px,0,0)}to{transform:translateZ(0)}}.ms-u-slideLeftIn40{animation-name:fadeIn,slideLeftIn40;-webkit-animation-duration:.367s;-moz-animation-duration:.367s;-ms-animation-duration:.367s;-o-animation-duration:.367s;animation-timing-function:cubic-bezier(.1,.9,.2,1);animation-fill-mode:both}@keyframes slideLeftIn40{0%{transform:translate3d(40px,0,0)}to{transform:translateZ(0)}}.ms-u-slideRightIn400{animation-name:fadeIn,slideRightIn400;-webkit-animation-duration:.367s;-moz-animation-duration:.367s;-ms-animation-duration:.367s;-o-animation-duration:.367s;animation-timing-function:cubic-bezier(.1,.9,.2,1);animation-fill-mode:both}@keyframes slideRightIn400{0%{transform:translate3d(-400px,0,0)}to{transform:translateZ(0)}}.ms-u-slideLeftIn400{animation-name:fadeIn,slideLeft400;-webkit-animation-duration:.367s;-moz-animation-duration:.367s;-ms-animation-duration:.367s;-o-animation-duration:.367s;animation-timing-function:cubic-bezier(.1,.9,.2,1);animation-fill-mode:both}@keyframes slideLeft400{0%{transform:translate3d(400px,0,0)}to{transform:translateZ(0)}}.ms-u-slideUpIn20{animation-name:fadeIn,slideUpIn20;-webkit-animation-duration:.367s;-moz-animation-duration:.367s;-ms-animation-duration:.367s;-o-animation-duration:.367s;animation-timing-function:cubic-bezier(.1,.9,.2,1);animation-fill-mode:both}@keyframes slideUpIn20{0%{transform:translate3d(0,20px,0)}to{transform:translateZ(0)}}.ms-u-slideUpIn10{animation-name:fadeIn,slideUpIn10;-webkit-animation-duration:.167s;-moz-animation-duration:.167s;-ms-animation-duration:.167s;-o-animation-duration:.167s;animation-timing-function:cubic-bezier(.1,.25,.75,.9);animation-fill-mode:both}@keyframes slideUpIn10{0%{transform:translate3d(0,10px,0)}to{transform:translateZ(0)}}.ms-u-slideDownIn20{animation-name:fadeIn,slideDownIn20;-webkit-animation-duration:.367s;-moz-animation-duration:.367s;-ms-animation-duration:.367s;-o-animation-duration:.367s;animation-timing-function:cubic-bezier(.1,.9,.2,1);animation-fill-mode:both}@keyframes slideDownIn20{0%{transform:translate3d(0,-20px,0)}to{transform:translateZ(0)}}.ms-u-slideDownIn10{animation-name:fadeIn,slideDownIn10;-webkit-animation-duration:.167s;-moz-animation-duration:.167s;-ms-animation-duration:.167s;-o-animation-duration:.167s;animation-timing-function:cubic-bezier(.1,.25,.75,.9);animation-fill-mode:both}@keyframes slideDownIn10{0%{transform:translate3d(0,-10px,0)}to{transform:translateZ(0)}}.ms-u-slideRightOut40{animation-name:fadeOut,slideRightOut40;-webkit-animation-duration:.167s;-moz-animation-duration:.167s;-ms-animation-duration:.167s;-o-animation-duration:.167s;animation-timing-function:cubic-bezier(.1,.25,.75,.9);animation-fill-mode:both}@keyframes slideRightOut40{0%{transform:translateZ(0)}to{transform:translate3d(40px,0,0)}}.ms-u-slideLeftOut40{animation-name:fadeOut,slideLeftOut40;-webkit-animation-duration:.167s;-moz-animation-duration:.167s;-ms-animation-duration:.167s;-o-animation-duration:.167s;animation-timing-function:cubic-bezier(.1,.25,.75,.9);animation-fill-mode:both}@keyframes slideLeftOut40{0%{transform:translateZ(0)}to{transform:translate3d(-40px,0,0)}}.ms-u-slideRightOut400{animation-name:fadeOut,slideRightOut400;-webkit-animation-duration:.167s;-moz-animation-duration:.167s;-ms-animation-duration:.167s;-o-animation-duration:.167s;animation-timing-function:cubic-bezier(.1,.25,.75,.9);animation-fill-mode:both}@keyframes slideRightOut400{0%{transform:translateZ(0)}to{transform:translate3d(400px,0,0)}}.ms-u-slideLeftOut400{animation-name:fadeOut,slideLeftOut400;-webkit-animation-duration:.167s;-moz-animation-duration:.167s;-ms-animation-duration:.167s;-o-animation-duration:.167s;animation-timing-function:cubic-bezier(.1,.25,.75,.9);animation-fill-mode:both}@keyframes slideLeftOut400{0%{transform:translateZ(0)}to{transform:translate3d(-400px,0,0)}}.ms-u-slideUpOut20{animation-name:fadeOut,slideUpOut20;-webkit-animation-duration:.167s;-moz-animation-duration:.167s;-ms-animation-duration:.167s;-o-animation-duration:.167s;animation-timing-function:cubic-bezier(.1,.25,.75,.9);animation-fill-mode:both}@keyframes slideUpOut20{0%{transform:translateZ(0)}to{transform:translate3d(0,-20px,0)}}.ms-u-slideUpOut10{animation-name:fadeOut,slideUpOut10;-webkit-animation-duration:.167s;-moz-animation-duration:.167s;-ms-animation-duration:.167s;-o-animation-duration:.167s;animation-timing-function:cubic-bezier(.1,.25,.75,.9);animation-fill-mode:both}@keyframes slideUpOut10{0%{transform:translateZ(0)}to{transform:translate3d(0,-10px,0)}}.ms-u-slideDownOut20{animation-name:fadeOut,slideDownOut20;-webkit-animation-duration:.167s;-moz-animation-duration:.167s;-ms-animation-duration:.167s;-o-animation-duration:.167s;animation-timing-function:cubic-bezier(.1,.25,.75,.9);animation-fill-mode:both}@keyframes slideDownOut20{0%{transform:translateZ(0)}to{transform:translate3d(0,20px,0)}}.ms-u-slideDownOut10{animation-name:fadeOut,slideDownOut10;-webkit-animation-duration:.167s;-moz-animation-duration:.167s;-ms-animation-duration:.167s;-o-animation-duration:.167s;animation-timing-function:cubic-bezier(.1,.25,.75,.9);animation-fill-mode:both}@keyframes slideDownOut10{0%{transform:translateZ(0)}to{transform:translate3d(0,10px,0)}}.ms-u-scaleUpIn100{animation-name:fadeIn,scaleUp100;-webkit-animation-duration:.367s;-moz-animation-duration:.367s;-ms-animation-duration:.367s;-o-animation-duration:.367s;animation-timing-function:cubic-bezier(.1,.9,.2,1);animation-fill-mode:both}@keyframes scaleUp100{0%{transform:scale3d(.98,.98,1)}to{transform:scaleX(1)}}.ms-u-scaleDownIn100{animation-name:fadeIn,scaleDown100;-webkit-animation-duration:.367s;-moz-animation-duration:.367s;-ms-animation-duration:.367s;-o-animation-duration:.367s;animation-timing-function:cubic-bezier(.1,.9,.2,1);animation-fill-mode:both}@keyframes scaleDown100{0%{transform:scale3d(1.03,1.03,1)}to{transform:scaleX(1)}}.ms-u-scaleUpOut103{animation-name:fadeOut,scaleUp103;-webkit-animation-duration:.167s;-moz-animation-duration:.167s;-ms-animation-duration:.167s;-o-animation-duration:.167s;animation-timing-function:cubic-bezier(.1,.25,.75,.9);animation-fill-mode:both}@keyframes scaleUp103{0%{transform:scaleX(1)}to{transform:scale3d(1.03,1.03,1)}}.ms-u-scaleDownOut98{animation-name:fadeOut,scaleDown98;-webkit-animation-duration:.167s;-moz-animation-duration:.167s;-ms-animation-duration:.167s;-o-animation-duration:.167s;animation-timing-function:cubic-bezier(.1,.25,.75,.9);animation-fill-mode:both}@keyframes scaleDown98{0%{transform:scaleX(1)}to{transform:scale3d(.98,.98,1)}}.ms-u-fadeIn100,.ms-u-fadeIn400{-webkit-animation-duration:.367s;-webkit-animation-name:fadeIn;-webkit-animation-fill-mode:both;animation-duration:.367s;animation-name:fadeIn;animation-fill-mode:both}.ms-u-fadeIn100{animation-duration:.167s}.ms-u-fadeIn200{-webkit-animation-duration:.367s;-webkit-animation-name:fadeIn;-webkit-animation-fill-mode:both;animation-duration:.367s;animation-name:fadeIn;animation-fill-mode:both;animation-duration:.267s}.ms-u-fadeIn500{-webkit-animation-duration:.367s;-webkit-animation-name:fadeIn;-webkit-animation-fill-mode:both;animation-duration:.367s;animation-name:fadeIn;animation-fill-mode:both;animation-duration:.467s}@keyframes fadeIn{0%{opacity:0;animation-timing-function:cubic-bezier(.1,.25,.75,.9)}to{opacity:1}}.ms-u-fadeOut100,.ms-u-fadeOut400{-webkit-animation-duration:.367s;-webkit-animation-name:fadeOut;-webkit-animation-fill-mode:both;animation-duration:.367s;animation-name:fadeOut;animation-fill-mode:both}.ms-u-fadeOut100{animation-duration:.1s}.ms-u-fadeOut200{-webkit-animation-duration:.367s;-webkit-animation-name:fadeOut;-webkit-animation-fill-mode:both;animation-duration:.367s;animation-name:fadeOut;animation-fill-mode:both;animation-duration:.167s}.ms-u-fadeOut500{-webkit-animation-duration:.367s;-webkit-animation-name:fadeOut;-webkit-animation-fill-mode:both;animation-duration:.367s;animation-name:fadeOut;animation-fill-mode:both;animation-duration:.467s}@keyframes fadeOut{0%{opacity:1;animation-timing-function:cubic-bezier(.1,.25,.75,.9)}to{opacity:0}}.ms-u-rotate90deg{animation-name:rotate90;-webkit-animation-duration:.1s;-moz-animation-duration:.1s;-ms-animation-duration:.1s;-o-animation-duration:.1s;animation-timing-function:cubic-bezier(.1,.25,.75,.9);animation-fill-mode:both}@keyframes rotate90{0%{transform:rotate(0deg)}to{transform:rotate(90deg)}}.ms-u-rotateN90deg{animation-name:rotateN90;-webkit-animation-duration:.1s;-moz-animation-duration:.1s;-ms-animation-duration:.1s;-o-animation-duration:.1s;animation-timing-function:cubic-bezier(.1,.25,.75,.9);animation-fill-mode:both}@keyframes rotateN90{0%{transform:rotate(90deg)}to{transform:rotate(0deg)}}.ms-u-expandCollapse400{transition:height .367s cubic-bezier(.1,.25,.75,.9)}.ms-u-expandCollapse200{transition:height .167s cubic-bezier(.1,.25,.75,.9)}.ms-u-expandCollapse100{transition:height .1s cubic-bezier(.1,.25,.75,.9)}.ms-u-delay100{animation-delay:.167s}.ms-u-delay200{animation-delay:.267s}.ms-u-slideRightIn10{animation-name:fadeIn,slideLeft10;animation-timing-function:cubic-bezier(.1,.9,.2,1);animation-fill-mode:both}.ms-u-slideRightIn10,.ms-u-slideRightIn20{-webkit-animation-duration:.367s;-moz-animation-duration:.367s;-ms-animation-duration:.367s;-o-animation-duration:.367s}.ms-u-slideRightIn20{animation-name:fadeIn,slideLeft20;animation-timing-function:cubic-bezier(.1,.9,.2,1);animation-fill-mode:both}.ms-u-slideRightIn40{animation-name:fadeIn,slideLeft40;animation-timing-function:cubic-bezier(.1,.9,.2,1);animation-fill-mode:both}.ms-u-slideLeftIn10,.ms-u-slideRightIn40{-webkit-animation-duration:.367s;-moz-animation-duration:.367s;-ms-animation-duration:.367s;-o-animation-duration:.367s}.ms-u-slideLeftIn10{animation-name:fadeIn,slideRight10;animation-timing-function:cubic-bezier(.1,.9,.2,1);animation-fill-mode:both}.ms-u-slideLeftIn20{animation-name:fadeIn,slideRight20;animation-timing-function:cubic-bezier(.1,.9,.2,1);animation-fill-mode:both}.ms-u-slideLeftIn20,.ms-u-slideLeftIn40{-webkit-animation-duration:.367s;-moz-animation-duration:.367s;-ms-animation-duration:.367s;-o-animation-duration:.367s}.ms-u-slideLeftIn40{animation-name:fadeIn,slideRight40;animation-timing-function:cubic-bezier(.1,.9,.2,1);animation-fill-mode:both}.ms-u-slideRightIn400{animation-name:fadeIn,slideLeft400;animation-timing-function:cubic-bezier(.1,.9,.2,1);animation-fill-mode:both}.ms-u-slideLeftIn400,.ms-u-slideRightIn400{-webkit-animation-duration:.367s;-moz-animation-duration:.367s;-ms-animation-duration:.367s;-o-animation-duration:.367s}.ms-u-slideLeftIn400{animation-name:fadeIn,slideRight400;animation-timing-function:cubic-bezier(.1,.9,.2,1);animation-fill-mode:both}.ms-u-slideRightOut40{animation-name:fadeOut,slideLeftOut40;animation-timing-function:cubic-bezier(.1,.25,.75,.9);animation-fill-mode:both}.ms-u-slideLeftOut40,.ms-u-slideRightOut40{-webkit-animation-duration:.167s;-moz-animation-duration:.167s;-ms-animation-duration:.167s;-o-animation-duration:.167s}.ms-u-slideLeftOut40{animation-name:fadeOut,slideRightOut40;animation-timing-function:cubic-bezier(.1,.25,.75,.9);animation-fill-mode:both}.ms-u-slideRightOut400{animation-name:fadeOut,slideLeftOut400;animation-timing-function:cubic-bezier(.1,.25,.75,.9);animation-fill-mode:both}.ms-u-slideLeftOut400,.ms-u-slideRightOut400{-webkit-animation-duration:.167s;-moz-animation-duration:.167s;-ms-animation-duration:.167s;-o-animation-duration:.167s}.ms-u-slideLeftOut400{animation-name:fadeOut,slideRightOut400;animation-timing-function:cubic-bezier(.1,.25,.75,.9);animation-fill-mode:both}.ms-u-rotate90deg{animation-name:rotateN90;animation-timing-function:cubic-bezier(.1,.25,.75,.9);animation-fill-mode:both}.ms-u-rotate90deg,.ms-u-rotateN90deg{-webkit-animation-duration:.1s;-moz-animation-duration:.1s;-ms-animation-duration:.1s;-o-animation-duration:.1s}.ms-u-rotateN90deg{animation-name:rotate90;animation-timing-function:cubic-bezier(.1,.25,.75,.9);animation-fill-mode:both}@media (max-width:479px){.ms-u-hiddenLgDown,.ms-u-hiddenMdDown,.ms-u-hiddenSm,.ms-u-hiddenXlDown,.ms-u-hiddenXxlDown{display:none!important}}@media (min-width:480px) and (max-width:639px){.ms-u-hiddenLgDown,.ms-u-hiddenMd,.ms-u-hiddenMdDown,.ms-u-hiddenMdUp,.ms-u-hiddenXlDown,.ms-u-hiddenXxlDown{display:none!important}}@media (min-width:640px) and (max-width:1023px){.ms-u-hiddenLg,.ms-u-hiddenLgDown,.ms-u-hiddenLgUp,.ms-u-hiddenMdUp,.ms-u-hiddenXlDown,.ms-u-hiddenXxlDown{display:none!important}}@media (min-width:1024px) and (max-width:1365px){.ms-u-hiddenLgUp,.ms-u-hiddenMdUp,.ms-u-hiddenXl,.ms-u-hiddenXlDown,.ms-u-hiddenXlUp,.ms-u-hiddenXxlDown{display:none!important}}@media (min-width:1366px) and (max-width:1919px){.ms-u-hiddenLgUp,.ms-u-hiddenMdUp,.ms-u-hiddenXlUp,.ms-u-hiddenXxl,.ms-u-hiddenXxlDown,.ms-u-hiddenXxlUp{display:none!important}}@media (min-width:1920px){.ms-u-hiddenLgUp,.ms-u-hiddenMdUp,.ms-u-hiddenXlUp,.ms-u-hiddenXxlUp,.ms-u-hiddenXxxl{display:none!important}}.ms-u-sm12{width:100%}.ms-u-sm11{width:91.66666666666666%}.ms-u-sm10{width:83.33333333333334%}.ms-u-sm9{width:75%}.ms-u-sm8{width:66.66666666666666%}.ms-u-sm7{width:58.333333333333336%}.ms-u-sm6{width:50%}.ms-u-sm5{width:41.66666666666667%}.ms-u-sm4{width:33.33333333333333%}.ms-u-sm3{width:25%}.ms-u-sm2{width:16.666666666666664%}.ms-u-sm1{width:8.333333333333332%}.ms-u-smPull12{left:100%}.ms-u-smPull11{left:91.66666666666666%}.ms-u-smPull10{left:83.33333333333334%}.ms-u-smPull9{left:75%}.ms-u-smPull8{left:66.66666666666666%}.ms-u-smPull7{left:58.333333333333336%}.ms-u-smPull6{left:50%}.ms-u-smPull5{left:41.66666666666667%}.ms-u-smPull4{left:33.33333333333333%}.ms-u-smPull3{left:25%}.ms-u-smPull2{left:16.666666666666664%}.ms-u-smPull1{left:8.333333333333332%}.ms-u-smPull0{left:auto}.ms-u-smPush12{right:100%}.ms-u-smPush11{right:91.66666666666666%}.ms-u-smPush10{right:83.33333333333334%}.ms-u-smPush9{right:75%}.ms-u-smPush8{right:66.66666666666666%}.ms-u-smPush7{right:58.333333333333336%}.ms-u-smPush6{right:50%}.ms-u-smPush5{right:41.66666666666667%}.ms-u-smPush4{right:33.33333333333333%}.ms-u-smPush3{right:25%}.ms-u-smPush2{right:16.666666666666664%}.ms-u-smPush1{right:8.333333333333332%}.ms-u-smPush0{right:auto}.ms-u-smOffset11{margin-right:91.66666666666666%}.ms-u-smOffset10{margin-right:83.33333333333334%}.ms-u-smOffset9{margin-right:75%}.ms-u-smOffset8{margin-right:66.66666666666666%}.ms-u-smOffset7{margin-right:58.333333333333336%}.ms-u-smOffset6{margin-right:50%}.ms-u-smOffset5{margin-right:41.66666666666667%}.ms-u-smOffset4{margin-right:33.33333333333333%}.ms-u-smOffset3{margin-right:25%}.ms-u-smOffset2{margin-right:16.666666666666664%}.ms-u-smOffset1{margin-right:8.333333333333332%}.ms-u-smOffset0{margin-right:0}@media (min-width:480px){.ms-u-md12{width:100%}.ms-u-md11{width:91.66666666666666%}.ms-u-md10{width:83.33333333333334%}.ms-u-md9{width:75%}.ms-u-md8{width:66.66666666666666%}.ms-u-md7{width:58.333333333333336%}.ms-u-md6{width:50%}.ms-u-md5{width:41.66666666666667%}.ms-u-md4{width:33.33333333333333%}.ms-u-md3{width:25%}.ms-u-md2{width:16.666666666666664%}.ms-u-md1{width:8.333333333333332%}.ms-u-mdPull12{left:100%}.ms-u-mdPull11{left:91.66666666666666%}.ms-u-mdPull10{left:83.33333333333334%}.ms-u-mdPull9{left:75%}.ms-u-mdPull8{left:66.66666666666666%}.ms-u-mdPull7{left:58.333333333333336%}.ms-u-mdPull6{left:50%}.ms-u-mdPull5{left:41.66666666666667%}.ms-u-mdPull4{left:33.33333333333333%}.ms-u-mdPull3{left:25%}.ms-u-mdPull2{left:16.666666666666664%}.ms-u-mdPull1{left:8.333333333333332%}.ms-u-mdPull0{left:auto}.ms-u-mdPush12{right:100%}.ms-u-mdPush11{right:91.66666666666666%}.ms-u-mdPush10{right:83.33333333333334%}.ms-u-mdPush9{right:75%}.ms-u-mdPush8{right:66.66666666666666%}.ms-u-mdPush7{right:58.333333333333336%}.ms-u-mdPush6{right:50%}.ms-u-mdPush5{right:41.66666666666667%}.ms-u-mdPush4{right:33.33333333333333%}.ms-u-mdPush3{right:25%}.ms-u-mdPush2{right:16.666666666666664%}.ms-u-mdPush1{right:8.333333333333332%}.ms-u-mdPush0{right:auto}.ms-u-mdOffset11{margin-right:91.66666666666666%}.ms-u-mdOffset10{margin-right:83.33333333333334%}.ms-u-mdOffset9{margin-right:75%}.ms-u-mdOffset8{margin-right:66.66666666666666%}.ms-u-mdOffset7{margin-right:58.333333333333336%}.ms-u-mdOffset6{margin-right:50%}.ms-u-mdOffset5{margin-right:41.66666666666667%}.ms-u-mdOffset4{margin-right:33.33333333333333%}.ms-u-mdOffset3{margin-right:25%}.ms-u-mdOffset2{margin-right:16.666666666666664%}.ms-u-mdOffset1{margin-right:8.333333333333332%}.ms-u-mdOffset0{margin-right:0}}@media (min-width:640px){.ms-u-lg12{width:100%}.ms-u-lg11{width:91.66666666666666%}.ms-u-lg10{width:83.33333333333334%}.ms-u-lg9{width:75%}.ms-u-lg8{width:66.66666666666666%}.ms-u-lg7{width:58.333333333333336%}.ms-u-lg6{width:50%}.ms-u-lg5{width:41.66666666666667%}.ms-u-lg4{width:33.33333333333333%}.ms-u-lg3{width:25%}.ms-u-lg2{width:16.666666666666664%}.ms-u-lg1{width:8.333333333333332%}.ms-u-lgPull12{left:100%}.ms-u-lgPull11{left:91.66666666666666%}.ms-u-lgPull10{left:83.33333333333334%}.ms-u-lgPull9{left:75%}.ms-u-lgPull8{left:66.66666666666666%}.ms-u-lgPull7{left:58.333333333333336%}.ms-u-lgPull6{left:50%}.ms-u-lgPull5{left:41.66666666666667%}.ms-u-lgPull4{left:33.33333333333333%}.ms-u-lgPull3{left:25%}.ms-u-lgPull2{left:16.666666666666664%}.ms-u-lgPull1{left:8.333333333333332%}.ms-u-lgPull0{left:auto}.ms-u-lgPush12{right:100%}.ms-u-lgPush11{right:91.66666666666666%}.ms-u-lgPush10{right:83.33333333333334%}.ms-u-lgPush9{right:75%}.ms-u-lgPush8{right:66.66666666666666%}.ms-u-lgPush7{right:58.333333333333336%}.ms-u-lgPush6{right:50%}.ms-u-lgPush5{right:41.66666666666667%}.ms-u-lgPush4{right:33.33333333333333%}.ms-u-lgPush3{right:25%}.ms-u-lgPush2{right:16.666666666666664%}.ms-u-lgPush1{right:8.333333333333332%}.ms-u-lgPush0{right:auto}.ms-u-lgOffset11{margin-right:91.66666666666666%}.ms-u-lgOffset10{margin-right:83.33333333333334%}.ms-u-lgOffset9{margin-right:75%}.ms-u-lgOffset8{margin-right:66.66666666666666%}.ms-u-lgOffset7{margin-right:58.333333333333336%}.ms-u-lgOffset6{margin-right:50%}.ms-u-lgOffset5{margin-right:41.66666666666667%}.ms-u-lgOffset4{margin-right:33.33333333333333%}.ms-u-lgOffset3{margin-right:25%}.ms-u-lgOffset2{margin-right:16.666666666666664%}.ms-u-lgOffset1{margin-right:8.333333333333332%}.ms-u-lgOffset0{margin-right:0}}@media (min-width:1024px){.ms-u-xl12{width:100%}.ms-u-xl11{width:91.66666666666666%}.ms-u-xl10{width:83.33333333333334%}.ms-u-xl9{width:75%}.ms-u-xl8{width:66.66666666666666%}.ms-u-xl7{width:58.333333333333336%}.ms-u-xl6{width:50%}.ms-u-xl5{width:41.66666666666667%}.ms-u-xl4{width:33.33333333333333%}.ms-u-xl3{width:25%}.ms-u-xl2{width:16.666666666666664%}.ms-u-xl1{width:8.333333333333332%}.ms-u-xlPull12{left:100%}.ms-u-xlPull11{left:91.66666666666666%}.ms-u-xlPull10{left:83.33333333333334%}.ms-u-xlPull9{left:75%}.ms-u-xlPull8{left:66.66666666666666%}.ms-u-xlPull7{left:58.333333333333336%}.ms-u-xlPull6{left:50%}.ms-u-xlPull5{left:41.66666666666667%}.ms-u-xlPull4{left:33.33333333333333%}.ms-u-xlPull3{left:25%}.ms-u-xlPull2{left:16.666666666666664%}.ms-u-xlPull1{left:8.333333333333332%}.ms-u-xlPull0{left:auto}.ms-u-xlPush12{right:100%}.ms-u-xlPush11{right:91.66666666666666%}.ms-u-xlPush10{right:83.33333333333334%}.ms-u-xlPush9{right:75%}.ms-u-xlPush8{right:66.66666666666666%}.ms-u-xlPush7{right:58.333333333333336%}.ms-u-xlPush6{right:50%}.ms-u-xlPush5{right:41.66666666666667%}.ms-u-xlPush4{right:33.33333333333333%}.ms-u-xlPush3{right:25%}.ms-u-xlPush2{right:16.666666666666664%}.ms-u-xlPush1{right:8.333333333333332%}.ms-u-xlPush0{right:auto}.ms-u-xlOffset11{margin-right:91.66666666666666%}.ms-u-xlOffset10{margin-right:83.33333333333334%}.ms-u-xlOffset9{margin-right:75%}.ms-u-xlOffset8{margin-right:66.66666666666666%}.ms-u-xlOffset7{margin-right:58.333333333333336%}.ms-u-xlOffset6{margin-right:50%}.ms-u-xlOffset5{margin-right:41.66666666666667%}.ms-u-xlOffset4{margin-right:33.33333333333333%}.ms-u-xlOffset3{margin-right:25%}.ms-u-xlOffset2{margin-right:16.666666666666664%}.ms-u-xlOffset1{margin-right:8.333333333333332%}.ms-u-xlOffset0{margin-right:0}}@media (min-width:1366px){.ms-u-xxl12{width:100%}.ms-u-xxl11{width:91.66666666666666%}.ms-u-xxl10{width:83.33333333333334%}.ms-u-xxl9{width:75%}.ms-u-xxl8{width:66.66666666666666%}.ms-u-xxl7{width:58.333333333333336%}.ms-u-xxl6{width:50%}.ms-u-xxl5{width:41.66666666666667%}.ms-u-xxl4{width:33.33333333333333%}.ms-u-xxl3{width:25%}.ms-u-xxl2{width:16.666666666666664%}.ms-u-xxl1{width:8.333333333333332%}.ms-u-xxlPull12{left:100%}.ms-u-xxlPull11{left:91.66666666666666%}.ms-u-xxlPull10{left:83.33333333333334%}.ms-u-xxlPull9{left:75%}.ms-u-xxlPull8{left:66.66666666666666%}.ms-u-xxlPull7{left:58.333333333333336%}.ms-u-xxlPull6{left:50%}.ms-u-xxlPull5{left:41.66666666666667%}.ms-u-xxlPull4{left:33.33333333333333%}.ms-u-xxlPull3{left:25%}.ms-u-xxlPull2{left:16.666666666666664%}.ms-u-xxlPull1{left:8.333333333333332%}.ms-u-xxlPull0{left:auto}.ms-u-xxlPush12{right:100%}.ms-u-xxlPush11{right:91.66666666666666%}.ms-u-xxlPush10{right:83.33333333333334%}.ms-u-xxlPush9{right:75%}.ms-u-xxlPush8{right:66.66666666666666%}.ms-u-xxlPush7{right:58.333333333333336%}.ms-u-xxlPush6{right:50%}.ms-u-xxlPush5{right:41.66666666666667%}.ms-u-xxlPush4{right:33.33333333333333%}.ms-u-xxlPush3{right:25%}.ms-u-xxlPush2{right:16.666666666666664%}.ms-u-xxlPush1{right:8.333333333333332%}.ms-u-xxlPush0{right:auto}.ms-u-xxlOffset11{margin-right:91.66666666666666%}.ms-u-xxlOffset10{margin-right:83.33333333333334%}.ms-u-xxlOffset9{margin-right:75%}.ms-u-xxlOffset8{margin-right:66.66666666666666%}.ms-u-xxlOffset7{margin-right:58.333333333333336%}.ms-u-xxlOffset6{margin-right:50%}.ms-u-xxlOffset5{margin-right:41.66666666666667%}.ms-u-xxlOffset4{margin-right:33.33333333333333%}.ms-u-xxlOffset3{margin-right:25%}.ms-u-xxlOffset2{margin-right:16.666666666666664%}.ms-u-xxlOffset1{margin-right:8.333333333333332%}.ms-u-xxlOffset0{margin-right:0}}@media (min-width:1920px){.ms-u-xxxl12{width:100%}.ms-u-xxxl11{width:91.66666666666666%}.ms-u-xxxl10{width:83.33333333333334%}.ms-u-xxxl9{width:75%}.ms-u-xxxl8{width:66.66666666666666%}.ms-u-xxxl7{width:58.333333333333336%}.ms-u-xxxl6{width:50%}.ms-u-xxxl5{width:41.66666666666667%}.ms-u-xxxl4{width:33.33333333333333%}.ms-u-xxxl3{width:25%}.ms-u-xxxl2{width:16.666666666666664%}.ms-u-xxxl1{width:8.333333333333332%}.ms-u-xxxlPull12{left:100%}.ms-u-xxxlPull11{left:91.66666666666666%}.ms-u-xxxlPull10{left:83.33333333333334%}.ms-u-xxxlPull9{left:75%}.ms-u-xxxlPull8{left:66.66666666666666%}.ms-u-xxxlPull7{left:58.333333333333336%}.ms-u-xxxlPull6{left:50%}.ms-u-xxxlPull5{left:41.66666666666667%}.ms-u-xxxlPull4{left:33.33333333333333%}.ms-u-xxxlPull3{left:25%}.ms-u-xxxlPull2{left:16.666666666666664%}.ms-u-xxxlPull1{left:8.333333333333332%}.ms-u-xxxlPull0{left:auto}.ms-u-xxxlPush12{right:100%}.ms-u-xxxlPush11{right:91.66666666666666%}.ms-u-xxxlPush10{right:83.33333333333334%}.ms-u-xxxlPush9{right:75%}.ms-u-xxxlPush8{right:66.66666666666666%}.ms-u-xxxlPush7{right:58.333333333333336%}.ms-u-xxxlPush6{right:50%}.ms-u-xxxlPush5{right:41.66666666666667%}.ms-u-xxxlPush4{right:33.33333333333333%}.ms-u-xxxlPush3{right:25%}.ms-u-xxxlPush2{right:16.666666666666664%}.ms-u-xxxlPush1{right:8.333333333333332%}.ms-u-xxxlPush0{right:auto}.ms-u-xxxlOffset11{margin-right:91.66666666666666%}.ms-u-xxxlOffset10{margin-right:83.33333333333334%}.ms-u-xxxlOffset9{margin-right:75%}.ms-u-xxxlOffset8{margin-right:66.66666666666666%}.ms-u-xxxlOffset7{margin-right:58.333333333333336%}.ms-u-xxxlOffset6{margin-right:50%}.ms-u-xxxlOffset5{margin-right:41.66666666666667%}.ms-u-xxxlOffset4{margin-right:33.33333333333333%}.ms-u-xxxlOffset3{margin-right:25%}.ms-u-xxxlOffset2{margin-right:16.666666666666664%}.ms-u-xxxlOffset1{margin-right:8.333333333333332%}.ms-u-xxxlOffset0{margin-right:0}}.ms-Grid{box-sizing:border-box;*zoom:1;padding:0 8px}.ms-Grid:after,.ms-Grid:before{display:table;content:'';line-height:0}.ms-Grid:after{clear:both}.ms-Grid-row{margin:0 -8px;box-sizing:border-box;*zoom:1}.ms-Grid-row:after,.ms-Grid-row:before{display:table;content:'';line-height:0}.ms-Grid-row:after{clear:both}.ms-Grid-col{position:relative;min-height:1px;padding-right:8px;padding-left:8px;box-sizing:border-box;float:right}.ms-Grid-col .ms-Grid{padding:0}.ms-Fabric{color:#333} \ No newline at end of file diff --git a/dist/documentation/Animations/index.html b/dist/documentation/Animations/index.html new file mode 100644 index 000000000..7e2b21174 --- /dev/null +++ b/dist/documentation/Animations/index.html @@ -0,0 +1,663 @@ + + + + + Office Fabric UI Core Documentation + + + + + +
+ +
+
+ +
+ +
+

Animations

+

Use the animation library to create web experiences that integrate with Office 365. You can use the animation CSS classes for navigation, panels, dialogs, and more. Animations include directionality (up, down, left, right relating to origin and completion of tasks), enter/exit (fade in, fade out, zoom in, zoom out), and duration (speed of enter/exit relating to urgency or content type).

+

When choosing a motion for side panels, consider the origin of the triggering element. Use the motion to create a link between the action and the resulting UI. For example, if the triggering element is on the right side of the interface, consider having the panel move in from the right.

+

When choosing a motion for dialogs, consider the origin and tone of the content. For a warning or error dialog, a quick fade in might be appropriate. If the dialog appears when a user chooses an item to get more information, a scale-up might be appropriate.

+
+ +
+
CSS Class
+
Description
+
Cubic Bezier
+
Timing
+
Example (Click to Animate)
+
+ + + +
+
Class
ms-u-slideRightIn10
+
Slide right 10px and fade in
+
cubic-bezier(0.1, 0.9, 0.2, 1)
+
0.367s
+
+
+ +
+
+
+
+ +
+
Class
ms-u-slideRightIn20
+
Slide right 20px and fade in
+
cubic-bezier(0.1, 0.9, 0.2, 1)
+
0.367s
+
+
+ +
+
+
+
+ +
+
Class
ms-u-slideRightIn40
+
Slide right 40px and fade in
+
cubic-bezier(0.1, 0.9, 0.2, 1)
+
0.367s
+
+
+ +
+
+
+
+ +
+
Class
ms-u-slideLeftIn10
+
Slide left 10px and fade in
+
cubic-bezier(0.1, 0.9, 0.2, 1)
+
0.367s
+
+
+ +
+
+
+
+ +
+
Class
ms-u-slideLeftIn20
+
Slide left 20px and fade in
+
cubic-bezier(0.1, 0.9, 0.2, 1)
+
0.367s
+
+
+ +
+
+
+
+ +
+
Class
ms-u-slideLeftIn40
+
Slide left 40px and fade in
+
cubic-bezier(0.1, 0.9, 0.2, 1)
+
0.367s
+
+
+ +
+
+
+
+ +
+
Class
ms-u-slideUpIn20
+
Slide up 20px and fade in
+
cubic-bezier(0.1, 0.9, 0.2, 1)
+
0.367s
+
+
+ +
+
+
+
+ +
+
Class
ms-u-slideUpIn10
+
Slide up 10px and fade in
+
cubic-bezier(0.1, 0.25, 0.75, 0.9)
+
0.167s
+
+
+ +
+
+
+
+ +
+
Class
ms-u-slideDownIn20
+
Slide down 20px and fade in
+
cubic-bezier(0.1, 0.9, 0.2, 1)
+
0.367s
+
+
+ +
+
+
+
+ +
+
Class
ms-u-slideDownIn10
+
Slide down 10px and fade in
+
cubic-bezier(0.1, 0.25, 0.75, 0.9)
+
0.167s
+
+
+ +
+
+
+
+ +
+
Class
ms-u-slideRightOut40
+
Slide right 40px and fade out
+
cubic-bezier(0.1, 0.25, 0.75, 0.9)
+
0.167s
+
+
+ +
+
+
+
+ +
+
Class
ms-u-slideLeftOut40
+
Slide left 40px and fade out
+
cubic-bezier(0.1, 0.25, 0.75, 0.9)
+
0.167s
+
+
+ +
+
+
+
+ +
+
Class
ms-u-slideUpOut20
+
Slide up 20px and fade out
+
cubic-bezier(0.1, 0.25, 0.75, 0.9)
+
0.167s
+
+
+ +
+
+
+
+ +
+
Class
ms-u-slideUpOut10
+
Slide up 10px and fade out
+
cubic-bezier(0.1, 0.25, 0.75, 0.9)
+
0.167s
+
+
+ +
+
+
+
+ +
+
Class
ms-u-slideDownOut20
+
Slide down 20px and fade out
+
cubic-bezier(0.1, 0.25, 0.75, 0.9)
+
0.167s
+
+
+ +
+
+
+
+ +
+
Class
ms-u-slideDownOut10
+
Slide down 10px and fade out
+
cubic-bezier(0.1, 0.25, 0.75, 0.9)
+
0.167s
+
+
+ +
+
+
+
+ +
+
Class
ms-u-scaleUpIn100
+
Scale up to 100% and fade in
+
cubic-bezier(0.1, 0.9, 0.2, 1)
+
0.167s
+
+
+ +
+
+
+
+ +
+
Class
ms-u-scaleDownIn100
+
Scale down to 100% and fade in
+
cubic-bezier(0.1, 0.9, 0.2, 1)
+
0.367s
+
+
+ +
+
+
+
+ +
+
Class
ms-u-scaleUpOut103
+
Scale up to 103% and fade out
+
cubic-bezier(0.1, 0.25, 0.75, 0.9)
+
0.167s
+
+
+ +
+
+
+
+ +
+
Class
ms-u-scaleDownOut98
+
Scale down to 98% and fade out
+
cubic-bezier(0.1, 0.25, 0.75, 0.9)
+
0.167s
+
+
+ +
+
+
+
+ +
+
Class
ms-u-fadeIn100
+
Fade in
+
cubic-bezier(0.1, 0.25, 0.75, 0.9)
+
0.167s
+
+
+ +
+
+
+
+ +
+
Class
ms-u-fadeIn200
+
Fade in
+
cubic-bezier(0.1, 0.25, 0.75, 0.9)
+
0.267s
+
+
+ +
+
+
+
+ +
+
Class
ms-u-fadeIn400
+
Fade in
+
cubic-bezier(0.1, 0.25, 0.75, 0.9)
+
0.367s
+
+
+ +
+
+
+
+ +
+
Class
ms-u-fadeIn500
+
Fade in
+
cubic-bezier(0.1, 0.25, 0.75, 0.9)
+
0.467s
+
+
+ +
+
+
+
+ +
+
Class
ms-u-fadeOut100
+
Fade out
+
cubic-bezier(0.1, 0.25, 0.75, 0.9)
+
0.167s
+
+
+ +
+
+
+
+ +
+
Class
ms-u-fadeOut200
+
Fade out
+
cubic-bezier(0.1, 0.25, 0.75, 0.9)
+
0.267s
+
+
+ +
+
+
+
+ +
+
Class
ms-u-fadeOut400
+
Fade out
+
cubic-bezier(0.1, 0.25, 0.75, 0.9)
+
0.367s
+
+
+ +
+
+
+
+
+
+ + +
+
+ + + \ No newline at end of file diff --git a/dist/documentation/Color/index.html b/dist/documentation/Color/index.html new file mode 100644 index 000000000..aaee85a7a --- /dev/null +++ b/dist/documentation/Color/index.html @@ -0,0 +1,1582 @@ + + + + + Office Fabric UI Core Documentation + + + + + +
+ +
+
+ +
+ +
+

Color

+

Fabric includes 9 theme colors and 11 neutral colors. Each has helper classes for text, border, background, and hover states. These color classes act as hooks into the suite-wide theming system. When the theming system is enabled and your app or add-in is consuming the suite navigation, these classes pick up the user's chosen theme.

+ +

Theme colors

+

Use theme colors in wayfinding, navigation, and key interactions like primary actions and current or selected indicators.

+ +
+ +
+
+ Theme Darker
+ #004578 +
+
+ Aa +
+
+
+
+ +
+
+

Background
 ms-bgColor-themeDarker

+
+
+

Font
 ms-fontColor-themeDarker

+ + +
+
+
+

Acceptable Backgrounds

+
+
+
+
+
+
+

Background Color Class:

+
+

Ratio:

+
+
+
ms-bgColor-neutralLight
+
7:6:1
+
ms-bgColor-neutralLighter
+
8:3:1
+
ms-bgColor-neutralLightAlt
+
8:6:1
+
ms-bgColor-themeLight
+
6:7:1
+
ms-bgColor-themeLighter
+
7:6:1
+
ms-bgColor-themeLighterAlt
+
8:4:1
+
ms-bgColor-white
+
9:1:1
+
+
+
+
+
+
+ +
+
+

Border
 ms-borderColor-themeDarker

+
+
+ +
+
+ Theme Dark
+ #005A9E +
+
+ Aa +
+
+
+
+ +
+
+

Background
 ms-bgColor-themeDark

+
+
+

Font
 ms-fontColor-themeDark

+ + +
+
+
+

Acceptable Backgrounds

+
+
+
+
+
+
+

Background Color Class:

+
+

Ratio:

+
+
+
ms-bgColor-neutralLight
+
5:2:1
+
ms-bgColor-neutralLighter
+
5:7:1
+
ms-bgColor-neutralLightAlt
+
5:9:1
+
ms-bgColor-themeLight
+
4:6:1
+
ms-bgColor-themeLighter
+
5:2:1
+
ms-bgColor-themeLighterAlt
+
5:7:1
+
ms-bgColor-white
+
6:3:1
+
+
+
+
+
+
+ +
+
+

Border
 ms-borderColor-themeDark

+
+
+ +
+
+ Theme Dark Alt
+ #106EBE +
+
+ Aa +
+
+
+
+ +
+
+

Background
 ms-bgColor-themeDarkAlt

+
+
+

Font
 ms-fontColor-themeDarkAlt

+ + +
+
+
+

Acceptable Backgrounds

+
+
+
+
+
+
+

Background Color Class:

+
+

Ratio:

+
+
+
ms-bgColor-neutralLighter
+
4:8:1
+
ms-bgColor-neutralLightAlt
+
5:0:1
+
ms-bgColor-themeLighter
+
5:2:1
+
ms-bgColor-themeLighterAlt
+
4:8:1
+
ms-bgColor-white
+
5:6:1
+
+
+
+
+
+
+ +
+
+

Border
 ms-borderColor-themeDarkAlt

+
+
+ +
+
+ Theme Primary
+ #0078D7 +
+
+ Aa +
+
+
+
+ +
+
+

Background
 ms-bgColor-themePrimary

+
+
+

Font
 ms-fontColor-themePrimary

+ + +
+
+
+

Acceptable Backgrounds

+
+
+
+
+
+
+

Background Color Class:

+
+

Ratio:

+
+
+
ms-bgColor-white
+
5:0:1
+
+
+
+
+
+
+ +
+
+

Border
 ms-borderColor-themePrimary

+
+
+ +
+
+ Theme Secondary
+ #2b88D8 +
+
+ Aa +
+
+
+
+ +
+
+

Background
 ms-bgColor-themeSecondary

+
+
+

Font
 ms-fontColor-themeSecondary

+ + +
+
+

Border
 ms-borderColor-themeSecondary

+
+
+ +
+
+ Theme Tertiary
+ #71AFE5 +
+
+ Aa +
+
+
+
+ +
+
+

Background
 ms-bgColor-themeTertiary

+
+
+

Font
 ms-fontColor-themeTertiary

+ + +
+
+

Border
 ms-borderColor-themeTertiary

+
+
+ +
+
+ Theme Light
+ #C7E0F4 +
+
+ Aa +
+
+
+
+ +
+
+

Background
 ms-bgColor-themeLight

+
+
+

Font
 ms-fontColor-themeLight

+ + +
+
+

Border
 ms-borderColor-themeLight

+
+
+ +
+
+ Theme Lighter
+ #DEECF9 +
+
+ Aa +
+
+
+
+ +
+
+

Background
 ms-bgColor-themeLighter

+
+
+

Font
 ms-fontColor-themeLighter

+ + +
+
+

Border
 ms-borderColor-themeLighter

+
+
+ +
+
+ Theme Lighter Alt
+ #EFF6FC +
+
+ Aa +
+
+
+
+ +
+
+

Background
 ms-bgColor-themeLighterAlt

+
+
+

Font
 ms-fontColor-themeLighterAlt

+ + +
+
+

Border
 ms-borderColor-themeLighterAlt

+
+
+
+ +

Neutral Colors

+

Neutral colors include black, gray, and white. Use darker shades of gray for primary content, such as text and titles. Use black sparingly for high-impact strings (labels, names) and hover states. Use lighter shades of gray for supporting graphic elements and page areas.

+ +
+ +
+
+ Black
+ #000000 +
+
+ Aa +
+
+
+
+ +
+
+

Background
 ms-bgColor-black

+
+
+

Font
 ms-fontColor-black

+ + +
+
+
+

Acceptable Backgrounds

+
+
+
+
+
+
+

Background Color Class:

+
+

Ratio:

+
+
+
ms-bgColor-neutralLight
+
17:5:1
+
ms-bgColor-neutralLighter
+
19:9:1
+
ms-bgColor-neutralLightAlt
+
19:8:1
+
ms-bgColor-themeLight
+
15:4:1
+
ms-bgColor-themeLighter
+
17:5:1
+
ms-bgColor-themeLighterAlt
+
19:3:1
+
ms-bgColor-white
+
21:1
+
+
+
+
+
+
+ +
+
+

Border
 ms-borderColor-black

+
+
+ +
+
+ Neutral Dark
+ #212121 +
+
+ Aa +
+
+
+
+ +
+
+

Background
 ms-bgColor-neutralDark

+
+
+

Font
 ms-fontColor-neutralDark

+ + +
+
+

Border
 ms-borderColor-neutralDark

+
+
+ +
+
+ Neutral Primary
+ #333333 +
+
+ Aa +
+
+
+
+ +
+
+

Background
 ms-bgColor-neutralPrimary

+
+
+

Font
 ms-fontColor-neutralPrimary

+ + +
+
+
+

Acceptable Backgrounds

+
+
+
+
+
+
+

Background Color Class:

+
+

Ratio:

+
+
+
ms-bgColor-neutralLight
+
10:5:1
+
ms-bgColor-neutralLighter
+
11:5:1
+
ms-bgColor-neutralLightAlt
+
11:9:1
+
ms-bgColor-themeLight
+
9:3:1
+
ms-bgColor-themeLighterAlt
+
11:6:1
+
ms-bgColor-white
+
12:6:1
+
+
+
+
+
+
+ +
+
+

Border
 ms-borderColor-neutralPrimary

+
+
+ +
+
+ Neutral Primary Alt
+ #3C3C3C +
+
+ Aa +
+
+
+
+ +
+
+

Background
 ms-bgColor-neutralPrimaryAlt

+
+
+

Font
 ms-fontColor-neutralPrimaryAlt

+ + +
+
+

Border
 ms-borderColor-neutralPrimaryAlt

+
+
+ +
+
+ Neutral Secondary
+ #666666 +
+
+ Aa +
+
+
+
+ +
+
+

Background
 ms-bgColor-neutralSecondary

+
+
+

Font
 ms-fontColor-neutralSecondary

+ + +
+
+
+

Acceptable Backgrounds

+
+
+
+
+
+
+

Background Color Class:

+
+

Ratio:

+
+
+
ms-bgColor-neutralLight
+
4:8:1
+
ms-bgColor-neutralLighter
+
5:2:1
+
ms-bgColor-neutralLightAlt
+
5:4:1
+
ms-bgColor-themeLighter
+
4:8:1
+
ms-bgColor-themeLighterAlt
+
5:27:1
+
ms-bgColor-white
+
5:7:1
+
+
+
+
+
+
+ +
+
+

Border
 ms-borderColor-neutralSecondary

+
+
+ +
+
+ Neutral Secondary Alt
+ #767676 +
+
+ Aa +
+
+
+
+ +
+
+

Background
 ms-bgColor-neutralSecondaryAlt

+
+
+

Font
 ms-fontColor-neutralSecondaryAlt

+ + +
+
+
+

Acceptable Backgrounds

+
+
+
+
+
+
+

Background Color Class:

+
+

Ratio:

+
+
+
ms-bgColor-white
+
4:5:1
+
+
+
+
+
+
+ +
+
+

Border
 ms-borderColor-neutralSecondaryAlt

+
+
+ +
+
+ Neutral Tertiary
+ #A6A6A6 +
+
+ Aa +
+
+
+
+ +
+
+

Background
 ms-bgColor-neutralTertiary

+
+
+

Font
 ms-fontColor-neutralTertiary

+ + +
+
+

Border
 ms-borderColor-neutralTertiary

+
+
+ +
+
+ Neutral Tertiary Alt
+ #C8C8C8 +
+
+ Aa +
+
+
+
+ +
+
+

Background
 ms-bgColor-neutralTertiaryAlt

+
+
+

Font
 ms-fontColor-neutralTertiaryAlt

+ + +
+
+

Border
 ms-borderColor-neutralTertiaryAlt

+
+
+ +
+
+ Neutral Light
+ #EAEAEA +
+
+ Aa +
+
+
+
+ +
+
+

Background
 ms-bgColor-neutralLight

+
+
+

Font
 ms-fontColor-neutralLight

+ + +
+
+

Border
 ms-borderColor-neutralLight

+
+
+ +
+
+ Neutral Lighter
+ #004578 +
+
+ Aa +
+
+
+
+ +
+
+

Background
 ms-bgColor-neutralLighter

+
+
+

Font
 ms-fontColor-neutralLighter

+ + +
+
+

Border
 ms-borderColor-neutralLighter

+
+
+ +
+
+ Neutral Lighter Alt
+ #F8F8F8 +
+
+ Aa +
+
+
+
+ +
+
+

Background
 ms-bgColor-neutralLighterAlt

+
+
+

Font
 ms-fontColor-neutralLighterAlt

+ + +
+
+

Border
 ms-borderColor-neutralLighterAlt

+
+
+ +
+
+ White
+ #FFFFFF +
+
+ Aa +
+
+
+
+ +
+
+

Background
 ms-bgColor-white

+
+
+

Font
 ms-fontColor-white

+ + +
+
+

Border
 ms-borderColor-white

+
+
+
+ +

Accent Colors

+

Fabric also includes accent colors from the Microsoft color palette.

+ +
+ +
+
+ Yellow
+ #FFB900 +
+
+ Aa +
+
+
+
+ +
+
+

Background
 ms-bgColor-yellow

+
+
+

Font
 ms-fontColor-yellow

+ + +
+
+

Border
 ms-borderColor-yellow

+
+
+ +
+
+ Light Yellow
+ #FFF100 +
+
+ Aa +
+
+
+
+ +
+
+

Background
 ms-bgColor-yellowLight

+
+
+

Font
 ms-fontColor-yellowLight

+ + +
+
+

Border
 ms-borderColor-yellowLight

+
+
+ +
+
+ Orange
+ #D83B01 +
+
+ Aa +
+
+
+
+ +
+
+

Background
 ms-bgColor-orange

+
+
+

Font
 ms-fontColor-orange

+ + +
+
+

Border
 ms-borderColor-orange

+
+
+ +
+
+ Orange Light
+ #EA4300 +
+
+ Aa +
+
+
+
+ +
+
+

Background
 ms-bgColor-orangeLight

+
+
+

Font
 ms-fontColor-orangeLight

+ + +
+
+

Border
 ms-borderColor-orangeLight

+
+
+ +
+
+ Orange Lighter
+ #FF8C00 +
+
+ Aa +
+
+
+
+ +
+
+

Background
 ms-bgColor-orangeLighter

+
+
+

Font
 ms-fontColor-orangeLighter

+ + +
+
+

Border
 ms-borderColor-orangeLighter

+
+
+ +
+
+ Dark Red
+ #A80000 +
+
+ Aa +
+
+
+
+ +
+
+

Background
 ms-bgColor-redDark

+
+
+

Font
 ms-fontColor-redDark

+ + +
+
+

Border
 ms-borderColor-redDark

+
+
+ +
+
+ Red
+ #E81123 +
+
+ Aa +
+
+
+
+ +
+
+

Background
 ms-bgColor-red

+
+
+

Font
 ms-fontColor-red

+ + +
+
+

Border
 ms-borderColor-red

+
+
+ +
+
+ Magenta Light
+ #E3008C +
+
+ Aa +
+
+
+
+ +
+
+

Background
 ms-bgColor-magentaLight

+
+
+

Font
 ms-fontColor-magentaLight

+ + +
+
+

Border
 ms-borderColor-magentaLight

+
+
+ +
+
+ Magenta
+ #B4009E +
+
+ Aa +
+
+
+
+ +
+
+

Background
 ms-bgColor-magenta

+
+
+

Font
 ms-fontColor-magenta

+ + +
+
+

Border
 ms-borderColor-magenta

+
+
+ +
+
+ Dark Magenta
+ #5C005C +
+
+ Aa +
+
+
+
+ +
+
+

Background
 ms-bgColor-magentaDark

+
+
+

Font
 ms-fontColor-magentaDark

+ + +
+
+

Border
 ms-borderColor-magentaDark

+
+
+ +
+
+ Light Purple
+ #B4A0FF +
+
+ Aa +
+
+
+
+ +
+
+

Background
 ms-bgColor-purpleLight

+
+
+

Font
 ms-fontColor-purpleLight

+ + +
+
+

Border
 ms-borderColor-purpleLight

+
+
+ +
+
+ Purple
+ #5C2D91 +
+
+ Aa +
+
+
+
+ +
+
+

Background
 ms-bgColor-purple

+
+
+

Font
 ms-fontColor-purple

+ + +
+
+

Border
 ms-borderColor-purple

+
+
+ +
+
+ Dark Purple
+ #32145A +
+
+ Aa +
+
+
+
+ +
+
+

Background
 ms-bgColor-purpleDark

+
+
+

Font
 ms-fontColor-purpleDark

+ + +
+
+

Border
 ms-borderColor-purpleDark

+
+
+ +
+
+ Light Blue
+ #00BCF2 +
+
+ Aa +
+
+
+
+ +
+
+

Background
 ms-bgColor-blueLight

+
+
+

Font
 ms-fontColor-blueLight

+ + +
+
+

Border
 ms-borderColor-blueLight

+
+
+ +
+
+ Mid Blue
+ #00188F +
+
+ Aa +
+
+
+
+ +
+
+

Background
 ms-bgColor-blueMid

+
+
+

Font
 ms-fontColor-blueMid

+ + +
+
+

Border
 ms-borderColor-blueMid

+
+
+ +
+
+ Blue
+ #0078d7 +
+
+ Aa +
+
+
+
+ +
+
+

Background
 ms-bgColor-blue

+
+
+

Font
 ms-fontColor-blue

+ + +
+
+

Border
 ms-borderColor-blue

+
+
+ +
+
+ Dark Blue
+ #002050 +
+
+ Aa +
+
+
+
+ +
+
+

Background
 ms-bgColor-blueDark

+
+
+

Font
 ms-fontColor-blueDark

+ + +
+
+

Border
 ms-borderColor-blueDark

+
+
+ +
+
+ Light Teal
+ #00B294 +
+
+ Aa +
+
+
+
+ +
+
+

Background
 ms-bgColor-tealLight

+
+
+

Font
 ms-fontColor-tealLight

+ + +
+
+

Border
 ms-borderColor-tealLight

+
+
+ +
+
+ Teal
+ #008272 +
+
+ Aa +
+
+
+
+ +
+
+

Background
 ms-bgColor-teal

+
+
+

Font
 ms-fontColor-teal

+ + +
+
+

Border
 ms-borderColor-teal

+
+
+ +
+
+ Dark Teal
+ #004B50 +
+
+ Aa +
+
+
+
+ +
+
+

Background
 ms-bgColor-tealDark

+
+
+

Font
 ms-fontColor-tealDark

+ + +
+
+

Border
 ms-borderColor-tealDark

+
+
+ +
+
+ Light Green
+ #BAD80A +
+
+ Aa +
+
+
+
+ +
+
+

Background
 ms-bgColor-greenLight

+
+
+

Font
 ms-fontColor-greenLight

+ + +
+
+

Border
 ms-borderColor-greenLight

+
+
+ +
+
+ Green
+ #107C10 +
+
+ Aa +
+
+
+
+ +
+
+

Background
 ms-bgColor-green

+
+
+

Font
 ms-fontColor-green

+ + +
+
+

Border
 ms-borderColor-green

+
+
+ +
+
+ Dark Green
+ #004B1C +
+
+ Aa +
+
+
+
+ +
+
+

Background
 ms-bgColor-greenDark

+
+
+

Font
 ms-fontColor-greenDark

+ + +
+
+

Border
 ms-borderColor-greenDark

+
+
+
+ +

Message Colors

+

Use these colors when you need to communicate the system's status, such as in a notification or error message.

+ +
+ +
+
+

Info (Background)
+ #f4f4f4

+
+
+

Info (Font and Border)
+ #107c10

+
+
+ +
+
+ +
+
+

Background
 ms-bgColor-info

+
+
+

Font
 ms-fontColor-info

+
+
+

Border
 ms-borderColor-info

+
+
+ +
+
+

Success (Background)
+ #dff6dd

+
+
+

Success (Font and Border)
+ #107c10

+
+
+ +
+
+ +
+
+

Background
 ms-bgColor-success

+
+
+

Font
 ms-fontColor-success

+
+
+

Border
 ms-borderColor-success

+
+
+ +
+
+

Alert (Background)
+ #fed9cc

+
+
+

Alert (Font and Border)
+ #d83b01

+
+
+ +
+
+ +
+
+

Background
 ms-bgColor-alert

+
+
+

Font
 ms-fontColor-alert

+
+
+

Border
 ms-borderColor-alert

+
+
+ +
+
+

Error (Background)
+ #fde7e9

+
+
+

Error (Font and Border)
+ #a80000

+
+
+ +
+
+ +
+
+

Background
 ms-bgColor-error

+
+
+

Font
 ms-fontColor-error

+
+
+

Border
 ms-borderColor-error

+
+
+
+
+ +
+
+ + + \ No newline at end of file diff --git a/dist/documentation/Icons/index.html b/dist/documentation/Icons/index.html new file mode 100644 index 000000000..3d254800f --- /dev/null +++ b/dist/documentation/Icons/index.html @@ -0,0 +1,346 @@ + + + + + Office Fabric UI Core Documentation + + + + + +
+ +
+
+ +
+ +
+

Icons

+

Fabric uses a custom font for its iconography. This font contains glyphs that you can scale, color, and style in any way. You can even flip them for right-to-left localization. To use the icons, combine the base ms-Icon class with a modifier class for the specific icon.

+ 
<i class="ms-Icon ms-Icon--Mail" aria-hidden="true"></i>
+

Note the aria-hidden attribute, which prevents screen readers from reading the icon. In cases where meaning is conveyed only through the icon, such as an icon-only navigation bar, be sure to apply an aria-label to the button for accessibility.

+
+
    +
  • ms-Icon--GlobalNavButton
    • +
  • ms-Icon--MapPin
    • +
  • ms-Icon--Airplane
    • +
  • ms-Icon--Tablet
    • +
  • ms-Icon--QuickNote
    • +
  • ms-Icon--ChevronDown
    • +
  • ms-Icon--ChevronUp
    • +
  • ms-Icon--Edit
    • +
  • ms-Icon--Add
    • +
  • ms-Icon--Cancel
    • +
  • ms-Icon--More
    • +
  • ms-Icon--Settings
    • +
  • ms-Icon--Video
    • +
  • ms-Icon--Mail
    • +
  • ms-Icon--People
    • +
  • ms-Icon--Phone
    • +
  • ms-Icon--Pin
    • +
  • ms-Icon--Shop
    • +
  • ms-Icon--Link
    • +
  • ms-Icon--Filter
    • +
  • ms-Icon--Zoom
    • +
  • ms-Icon--Microphone
    • +
  • ms-Icon--Search
    • +
  • ms-Icon--Camera
    • +
  • ms-Icon--Attach
    • +
  • ms-Icon--Send
    • +
  • ms-Icon--PageFill
    • +
  • ms-Icon--Forward
    • +
  • ms-Icon--Back
    • +
  • ms-Icon--Refresh
    • +
  • ms-Icon--Share
    • +
  • ms-Icon--Lock
    • +
  • ms-Icon--Blocked
    • +
  • ms-Icon--FavoriteStar
    • +
  • ms-Icon--FavoriteStarFill
    • +
  • ms-Icon--ReadingMode
    • +
  • ms-Icon--Remove
    • +
  • ms-Icon--Checkbox
    • +
  • ms-Icon--CheckboxComposite
    • +
  • ms-Icon--CheckboxIndeterminate
    • +
  • ms-Icon--CheckMark
    • +
  • ms-Icon--BackToWindow
    • +
  • ms-Icon--FullScreen
    • +
  • ms-Icon--Print
    • +
  • ms-Icon--Up
    • +
  • ms-Icon--Down
    • +
  • ms-Icon--Delete
    • +
  • ms-Icon--Save
    • +
  • ms-Icon--Sad
    • +
  • ms-Icon--SIPMove
    • +
  • ms-Icon--EraseTool
    • +
  • ms-Icon--GripperTool
    • +
  • ms-Icon--Dialpad
    • +
  • ms-Icon--PageLeft
    • +
  • ms-Icon--PageRight
    • +
  • ms-Icon--MultiSelect
    • +
  • ms-Icon--Play
    • +
  • ms-Icon--Pause
    • +
  • ms-Icon--ChevronLeft
    • +
  • ms-Icon--ChevronRight
    • +
  • ms-Icon--System
    • +
  • ms-Icon--Globe
    • +
  • ms-Icon--ContactInfo
    • +
  • ms-Icon--Unpin
    • +
  • ms-Icon--Contact
    • +
  • ms-Icon--Memo
    • +
  • ms-Icon--Unlock
    • +
  • ms-Icon--Calendar
    • +
  • ms-Icon--SaveAs
    • +
  • ms-Icon--Filters
    • +
  • ms-Icon--Contrast
    • +
  • ms-Icon--Rotate
    • +
  • ms-Icon--PanoIndicator
    • +
  • ms-Icon--Warning
    • +
  • ms-Icon--Financial
    • +
  • ms-Icon--ShoppingCart
    • +
  • ms-Icon--Flag
    • +
  • ms-Icon--Move
    • +
  • ms-Icon--Page
    • +
  • ms-Icon--TouchPointer
    • +
  • ms-Icon--Merge
    • +
  • ms-Icon--Admin
    • +
  • ms-Icon--TVMonitor
    • +
  • ms-Icon--Car
    • +
  • ms-Icon--EatDrink
    • +
  • ms-Icon--LocationCircle
    • +
  • ms-Icon--Home
    • +
  • ms-Icon--SwitcherStartEnd
    • +
  • ms-Icon--IncidentTriangle
    • +
  • ms-Icon--MapDirections
    • +
  • ms-Icon--Location
    • +
  • ms-Icon--Work
    • +
  • ms-Icon--Recent
    • +
  • ms-Icon--LocationDot
    • +
  • ms-Icon--News
    • +
  • ms-Icon--Chat
    • +
  • ms-Icon--Group
    • +
  • ms-Icon--View
    • +
  • ms-Icon--Clear
    • +
  • ms-Icon--Sync
    • +
  • ms-Icon--Download
    • +
  • ms-Icon--Help
    • +
  • ms-Icon--Upload
    • +
  • ms-Icon--Emoji
    • +
  • ms-Icon--ClosePane
    • +
  • ms-Icon--OpenPane
    • +
  • ms-Icon--PreviewLink
    • +
  • ms-Icon--Bookmarks
    • +
  • ms-Icon--Document
    • +
  • ms-Icon--ProtectedDocument
    • +
  • ms-Icon--OpenInNewWindow
    • +
  • ms-Icon--MailFill
    • +
  • ms-Icon--Rename
    • +
  • ms-Icon--Folder
    • +
  • ms-Icon--Picture
    • +
  • ms-Icon--ShowResults
    • +
  • ms-Icon--Message
    • +
  • ms-Icon--CalendarDay
    • +
  • ms-Icon--CalendarWeek
    • +
  • ms-Icon--MailReplyAll
    • +
  • ms-Icon--Read
    • +
  • ms-Icon--PaymentCard
    • +
  • ms-Icon--Copy
    • +
  • ms-Icon--Important
    • +
  • ms-Icon--MailReply
    • +
  • ms-Icon--Sort
    • +
  • ms-Icon--GotoToday
    • +
  • ms-Icon--Font
    • +
  • ms-Icon--FontColor
    • +
  • ms-Icon--FolderFill
    • +
  • ms-Icon--Permissions
    • +
  • ms-Icon--DisableUpdates
    • +
  • ms-Icon--Italic
    • +
  • ms-Icon--Underline
    • +
  • ms-Icon--Bold
    • +
  • ms-Icon--MoveToFolder
    • +
  • ms-Icon--OpenFile
    • +
  • ms-Icon--FontDecrease
    • +
  • ms-Icon--FontIncrease
    • +
  • ms-Icon--CellPhone
    • +
  • ms-Icon--Tag
    • +
  • ms-Icon--Library
    • +
  • ms-Icon--PostUpdate
    • +
  • ms-Icon--NewFolder
    • +
  • ms-Icon--UnsyncFolder
    • +
  • ms-Icon--SyncFolder
    • +
  • ms-Icon--BlockContact
    • +
  • ms-Icon--AddFriend
    • +
  • ms-Icon--BulletedList
    • +
  • ms-Icon--Preview
    • +
  • ms-Icon--DockLeft
    • +
  • ms-Icon--DockRight
    • +
  • ms-Icon--Repair
    • +
  • ms-Icon--RadioBullet
    • +
  • ms-Icon--Stopwatch
    • +
  • ms-Icon--Clock
    • +
  • ms-Icon--AlarmClock
    • +
  • ms-Icon--Hospital
    • +
  • ms-Icon--Timer
    • +
  • ms-Icon--FullCircleMask
    • +
  • ms-Icon--LocationFill
    • +
  • ms-Icon--ChromeMinimize
    • +
  • ms-Icon--ChromeClose
    • +
  • ms-Icon--Accept
    • +
  • ms-Icon--Handwriting
    • +
  • ms-Icon--StackIndicator
    • +
  • ms-Icon--Completed
    • +
  • ms-Icon--Label
    • +
  • ms-Icon--FlickDown
    • +
  • ms-Icon--FlickUp
    • +
  • ms-Icon--FlickLeft
    • +
  • ms-Icon--FlickRight
    • +
  • ms-Icon--LightningBolt
    • +
  • ms-Icon--Info
    • +
  • ms-Icon--CalculatorAddition
    • +
  • ms-Icon--CalculatorSubtract
    • +
  • ms-Icon--PrintfaxPrinterFile
    • +
  • ms-Icon--ChevronUpSmall
    • +
  • ms-Icon--ChevronDownSmall
    • +
  • ms-Icon--ChevronLeftSmall
    • +
  • ms-Icon--ChevronRightSmall
    • +
  • ms-Icon--ChevronUpMed
    • +
  • ms-Icon--ChevronDownMed
    • +
  • ms-Icon--ChevronLeftMed
    • +
  • ms-Icon--ChevronRightMed
    • +
  • ms-Icon--ChromeBack
    • +
  • ms-Icon--PresenceChickletVideo
    • +
  • ms-Icon--Reply
    • +
  • ms-Icon--DoubleChevronDown
    • +
  • ms-Icon--DoubleChevronLeftMed
    • +
  • ms-Icon--CaretHollow
    • +
  • ms-Icon--CaretSolid
    • +
  • ms-Icon--Pinned
    • +
  • ms-Icon--PinnedFill
    • +
  • ms-Icon--Chart
    • +
  • ms-Icon--RevToggleKey
    • +
  • ms-Icon--RightDoubleQuote
    • +
  • ms-Icon--Sunny
    • +
  • ms-Icon--Ringer
    • +
  • ms-Icon--PDF
    • +
  • ms-Icon--SortLines
    • +
  • ms-Icon--Ribbon
    • +
  • ms-Icon--MultiSelectMirrored
    • +
  • ms-Icon--Broom
    • +
  • ms-Icon--MusicInCollectionFill
    • +
  • ms-Icon--List
    • +
  • ms-Icon--Asterisk
    • +
  • ms-Icon--ErrorBadge
    • +
  • ms-Icon--CircleRing
    • +
  • ms-Icon--CircleFill
    • +
  • ms-Icon--BookmarksMirrored
    • +
  • ms-Icon--BulletedListMirrored
    • +
  • ms-Icon--CaretHollowMirrored
    • +
  • ms-Icon--CaretSolidMirrored
    • +
  • ms-Icon--ChromeBackMirrored
    • +
  • ms-Icon--ClosePaneMirrored
    • +
  • ms-Icon--DockLeftMirrored
    • +
  • ms-Icon--DoubleChevronLeftMedMirrored
    • +
  • ms-Icon--HelpMirrored
    • +
  • ms-Icon--ListMirrored
    • +
  • ms-Icon--MailReplyMirrored
    • +
  • ms-Icon--MailReplyAllMirrored
    • +
  • ms-Icon--OpenPaneMirrored
    • +
  • ms-Icon--ShowResultsMirrored
    • +
  • ms-Icon--Lightbulb
    • +
  • ms-Icon--StatusTriangle
    • +
  • ms-Icon--EmojiNeutral
    • +
  • ms-Icon--EmojiDisappointed
    • +
  • ms-Icon--HomeSolid
    • +
  • ms-Icon--Articles
    • +
  • ms-Icon--DietPlanNotebook
    • +
  • ms-Icon--DrugLookUp
    • +
  • ms-Icon--Running
    • +
  • ms-Icon--CirclePlus
    • +
  • ms-Icon--Coffee
    • +
  • ms-Icon--Money
    • +
  • ms-Icon--StockDown
    • +
  • ms-Icon--StockUp
    • +
  • ms-Icon--Soccer
    • +
  • ms-Icon--AutoRacing
    • +
  • ms-Icon--Drop
    • +
  • ms-Icon--Heart
    • +
  • ms-Icon--HeartFill
    • +
  • ms-Icon--Door
    • +
  • ms-Icon--DoubleBookmark
    • +
  • ms-Icon--Certificate
    • +
  • ms-Icon--CloudDownload
    • +
  • ms-Icon--WindDirection
    • +
  • ms-Icon--CSS
    • +
  • ms-Icon--JS
    • +
  • ms-Icon--Section
    • +
  • ms-Icon--ToggleFilled
    • +
  • ms-Icon--ToggleBorder
    • +
  • ms-Icon--SliderThumb
    • +
  • ms-Icon--ToggleThumb
    • +
  • ms-Icon--Documentation
    • +
  • ms-Icon--Badge
    • +
  • ms-Icon--AlbumRemove
    • +
  • ms-Icon--MessageFill
    • +
  • ms-Icon--TabletSelected
    • +
  • ms-Icon--MobileSelected
    • +
  • ms-Icon--LaptopSelected
    • +
  • ms-Icon--TVMonitorSelected
    • +
  • ms-Icon--DeveloperTools
    • +
  • ms-Icon--InsertTextBox
    • +
  • ms-Icon--Event
    • +
  • ms-Icon--Cake
    • +
  • ms-Icon--Tiles
    • +
  • ms-Icon--Org
    • +
  • ms-Icon--PartyLeader
    • +
  • ms-Icon--DRM
    • +
  • ms-Icon--CloudAdd
    • +
  • ms-Icon--AppIconDefault
    • +
  • ms-Icon--Embed
    • +
  • ms-Icon--Teamwork
    • +
  • ms-Icon--PeopleAdd
    • +
  • ms-Icon--Glasses
    • +
  • ms-Icon--Shield
    • +
  • ms-Icon--Header
    • +
  • ms-Icon--PageAdd
    • +
  • ms-Icon--NumberedList
    • +
  • ms-Icon--Glimmer
    • +
  • ms-Icon--SkypeCheck
    • +
  • ms-Icon--SkypeClock
    • +
  • ms-Icon--SkypeMinus
    • +
+
+ +
+ +
+
+ + + \ No newline at end of file diff --git a/dist/documentation/Localization/index.html b/dist/documentation/Localization/index.html new file mode 100644 index 000000000..13c0ade3f --- /dev/null +++ b/dist/documentation/Localization/index.html @@ -0,0 +1,214 @@ + + + + + Office Fabric UI Core Documentation + + + + + +
+ +
+
+ +
+ +
+

Localization

+

Right-to-left support

+

Fabric comes with an alternate CSS file for pages written in right-to-left (RTL) languages, such as Arabic and Hebrew. This reverses the order of columns in the responsive grid, making it easy to create an RTL layout without writing additional templates. Future versions of Fabric will also reverse some icons and provide additional helper utilities.

+

Usage

+

Apply the “dir” attribute to the HTML tag, and reference the RTL version of Fabric.

+ +
<html dir="rtl">
+  <head>
+    <meta charset="utf-8">
+    <link rel="stylesheet" href="fabric-[version].rtl.min.css">
+  </head>
+  ...
+</html>
+ +

Language-optimized fonts

+

By default, Fabric presents all text using the Western European character set of Segoe UI. For languages with other characters, Fabric will either serve a version of Segoe UI with a different character set or use a system font.

+ +

Usage

+

The HTML “lang” attribute specifies the language of the element's content. This is typically applied to the root HTML element, where it will be inherited by the entire page. In this example the entire page is in Thai.

+ +
<html lang="th-TH">...</html>
+

For pages with content in multiple languages, the “lang” attribute can be applied to individual elements. In this example, a page that is mostly Thai also contains some Vietnamese.

+
<html lang="th-TH">
+  ...
+  <section lang="vi-VN">...</section>
+</html>
+ +

Fabric supports a variety of language codes, which map to the following font stacks:

+ + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + +
LanguageCodeFont stack
Western European (default)N/A'Segoe UI Web Regular', 'Segoe UI', 'Segoe WP', Tahoma, Arial, sans-serif
Japaneseja-JPYuGothic, "Meiryo UI", Meiryo, "MS Pgothic", Osaka, "Segoe UI", Tahoma, Arial, sans-serif
Koreanko-KR"Malgun Gothic", Gulim, "Segoe UI", Tahoma, Arial, sans-serif
Chinese (simplified)ch-ZHS"Microsoft Yahei", Verdana, Simsun, "Segoe UI", Tahoma, Arial, sans-serif
Chinese (traditional)ch-ZHT"Microsoft Jhenghei", Pmingliu, "Segoe UI", Tahoma, Arial, sans-serif
Hindihi-IN"Nirmala UI", "Segoe UI", Tahoma, Arial, sans-serif
Thaith-TH'Leelawadee UI Regular', 'Kmer UI', 'Segoe UI', 'Segoe WP', Tahoma, Arial, sans-serif
Arabicar'Segoe UI Regular Arabic', 'Segoe UI', 'Segoe WP', Tahoma, Arial, sans-serif
Bulgarianbg-BG'Segoe UI Regular Cyrillic', 'Segoe UI', 'Segoe WP', Tahoma, Arial, sans-serif
Czechcs-CZ'Segoe UI Regular EastEuropean', 'Segoe UI', 'Segoe WP', Tahoma, Arial, sans-serif
Estonianet-EE'Segoe UI Regular EastEuropean', 'Segoe UI', 'Segoe WP', Tahoma, Arial, sans-serif
Croatianhr-HR'Segoe UI Regular EastEuropean', 'Segoe UI', 'Segoe WP', Tahoma, Arial, sans-serif
Hungarianhu-HU'Segoe UI Regular EastEuropean', 'Segoe UI', 'Segoe WP', Tahoma, Arial, sans-serif
Lithuanianlt-LT'Segoe UI Regular EastEuropean', 'Segoe UI', 'Segoe WP', Tahoma, Arial, sans-serif
Latvian (Lettish)lv-LV'Segoe UI Regular EastEuropean', 'Segoe UI', 'Segoe WP', Tahoma, Arial, sans-serif
Polishpl-PL'Segoe UI Regular EastEuropean', 'Segoe UI', 'Segoe WP', Tahoma, Arial, sans-serif
Serbianlt-sr-SP'Segoe UI Regular EastEuropean', 'Segoe UI', 'Segoe WP', Tahoma, Arial, sans-serif
Russianru-RU'Segoe UI Regular Cyrillic', 'Segoe UI', 'Segoe WP', Tahoma, Arial, sans-serif
Ukrainianuk-UA'Segoe UI Regular Cyrillic', 'Segoe UI', 'Segoe WP', Tahoma, Arial, sans-serif
Turkishtr-TR'Segoe UI Regular EastEuropean', 'Segoe UI', 'Segoe WP', Tahoma, Arial, sans-serif
Slovaksk-SK'Segoe UI Regular EastEuropean', 'Segoe UI', 'Segoe WP', Tahoma, Arial, sans-serif
Kazakhkk-KZ'Segoe UI Regular EastEuropean', 'Segoe UI', 'Segoe WP', Tahoma, Arial, sans-serif
Greekel-GR'Segoe UI Regular Greek', 'Segoe UI', 'Segoe WP', Tahoma, Arial, sans-serif
Hebrewhe-IL'Segoe UI Regular Hebrew', 'Segoe UI', 'Segoe WP', Tahoma, Arial, sans-serif
Vietnamesevi-VN'Segoe UI Regular Vietnamese', 'Segoe UI', 'Segoe WP', Tahoma, Arial, sans-serif
+ +
+ +
+
+ + + \ No newline at end of file diff --git a/dist/documentation/Responsive-Grid/index.html b/dist/documentation/Responsive-Grid/index.html new file mode 100644 index 000000000..976001cb2 --- /dev/null +++ b/dist/documentation/Responsive-Grid/index.html @@ -0,0 +1,566 @@ + + + + + Office Fabric UI Core Documentation + + + + + +
+ +
+
+ +
+ +
+

Responsive Grid

+

Fabric comes with a mobile-first, 12-column, responsive grid that you can use to create flexible layouts for a variety of screen sizes and device types.

+ +
+
+
+
1
+
+
+
1
+
+
+
1
+
+
+
1
+
+
+
1
+
+
+
1
+
+
+
1
+
+
+
1
+
+
+
1
+
+
+
1
+
+
+
1
+
+
+
1
+
+
+
+
+
2
+
+
+
2
+
+
+
2
+
+
+
2
+
+
+
2
+
+
+
2
+
+
+
+
+
3
+
+
+
3
+
+
+
3
+
+
+
3
+
+
+
+
+
4
+
+
+
4
+
+
+
4
+
+
+
+
+
6
+
+
+
6
+
+
+
+
+
12
+
+
+
+ +

How to use

+ +

A grid (ms-Grid) can contain multiple rows (ms-Grid-row), each of which has one or more columns (ms-Grid-col). Utility classes (ms-u-sm6) specify how large each column should be on small, medium, and large devices. The columns in a row should add up to 12 for each device size.

+
<div class="ms-Grid"> 
+    <div class="ms-Grid-row">
+        <div class="ms-Grid-col ms-u-sm6 ms-u-md4 ms-u-lg2">First</div>
+        <div class="ms-Grid-col ms-u-sm6 ms-u-md8 ms-u-lg10">Second</div>
+    </div>
+</div>
+
+ +

Would result in:

+ +
+
+
+
First
+
+
+
Second
+
+
+
+ +

Inheritance

+ +

Because Fabric is mobile-first, any layout defined for small screens is automatically inherited by medium and large screens. The small size utilities (ms-u-sm6) are required. If you want to change the layout on larger screens, you can apply the other utility classes.

+ +

Try this out! On a large screen, the Example block will be smaller. Try shrinking your browser window – the Example block will take up the entire width of the screen.

+ +

How to use

+
<div class="ms-Grid-col ms-u-sm12 ms-u-lg4">Example</div>
+
+
+
+
+
Example
+
+
+
+ +

Push and pull

+ +

You might want your column source order to differ from the display order, or to change the column display order based on the screen size. The push and pull utilities make this possible. Push moves a column to the right; pull moves it to the left.

+ +

How to use

+
<div class="ms-Grid-col ms-u-sm4 ms-u-smPush8">first in code</div>
+<div class="ms-Grid-col ms-u-sm8 ms-u-smPull4">second in code</div>
+
+ +
+
+
+
first in code
+
+
+
second in code
+
+
+
+ + +

Visibility

+ +

Some designs call for certain content to be shown or hidden depending on the screen size. You can achieve this using Fabric's responsive visibility classes. These allow you to show or hide content at a specific screen size, or across a whole range of sizes.

+ + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + +
Visibility classHides content on screen of size
SMMDLGXLXXLXXXL
ms-u-hiddenSm + + Class ms-u-hiddenSm hides content for screen size SM + + Class ms-u-hiddenSm does not hide content on the screen size MD + + Class ms-u-hiddenSm does not hide content on the screen size LG + + Class ms-u-hiddenSm does not hide content on the screen size XL + + Class ms-u-hiddenSm does not hide content on the screen size XXL + + Class ms-u-hiddenSm does not hide content on the screen size XXXL +
ms-u-hiddenMd + Class ms-u-hiddenMd does not hide content on the screen size SM + + + Class ms-u-hiddenMd hides content for screen size MD + + Class ms-u-hiddenMd does not hide content on the screen size LG + + Class ms-u-hiddenMd does not hide content on the screen size XL + + Class ms-u-hiddenMd does not hide content on the screen size XXL + + Class ms-u-hiddenMd does not hide content on the screen size XXXL +
ms-u-hiddenMdDown + + Class ms-u-hiddenMdDown hides content for screen size SM + + + Class ms-u-hiddenMdDown hides content for screen size MD + + Class ms-u-hiddenMdDown does not hide content on the screen size LG + + Class ms-u-hiddenMdDown does not hide content on the screen size XL + + Class ms-u-hiddenMdDown does not hide content on the screen size XXL + + Class ms-u-hiddenMdDown does not hide content on the screen size XXXL +
ms-u-hiddenMdUp + Class ms-u-hiddenMdUp does not hide content on the screen size SM + + + Class ms-u-hiddenMdUp hides content for screen size MD + + + Class ms-u-hiddenMdUp hides content for screen size LG + + + Class ms-u-hiddenMdUp hides content for screen size XL + + + Class ms-u-hiddenMdUp hides content for screen size XXL + + + Class ms-u-hiddenMdUp hides content for screen size XXXL +
ms-u-hiddenLg + Class ms-u-hiddenLg does not hide content on the screen size SM + + Class ms-u-hiddenLg does not hide content on the screen size MD + + + Class ms-u-hiddenLg hides content for screen size LG + + Class ms-u-hiddenLg does not hide content on the screen size XL + + Class ms-u-hiddenLg does not hide content on the screen size XXL + + Class ms-u-hiddenLg does not hide content on the screen size XXXL +
ms-u-hiddenLgDown + + Class ms-u-hiddenLgDown hides content for screen size SM + + + Class ms-u-hiddenLgDown hides content for screen size MD + + + Class ms-u-hiddenLgDown hides content for screen size LG + + Class ms-u-hiddenLgDown does not hide content on the screen size XL + + Class ms-u-hiddenLgDown does not hide content on the screen size XXL + + Class ms-u-hiddenLgDown does not hide content on the screen size XXXL +
ms-u-hiddenLgUp + Class ms-u-hiddenLgUp does not hide content on the screen size SM + + Class ms-u-hiddenLgUp does not hide content on the screen size MD + + + Class ms-u-hiddenLgUp hides content for screen size LG + + + Class ms-u-hiddenLgUp hides content for screen size XL + + + Class ms-u-hiddenLgUp hides content for screen size XXL + + + Class ms-u-hiddenLgUp hides content for screen size XXXL +
ms-u-hiddenXl + Class ms-u-hiddenXl does not hide content on the screen size SM + + Class ms-u-hiddenXl does not hide content on the screen size MD + + Class ms-u-hiddenXl does not hide content on the screen size LG + + + Class ms-u-hiddenXl hides content for screen size XL + + Class ms-u-hiddenXl does not hide content on the screen size XXL + + Class ms-u-hiddenXl does not hide content on the screen size XXXL +
ms-u-hiddenXlDown + + Class ms-u-hiddenXlDown hides content for screen size SM + + + Class ms-u-hiddenXlDown hides content for screen size MD + + + Class ms-u-hiddenXlDown hides content for screen size LG + + + Class ms-u-hiddenXlDown hides content for screen size XL + + Class ms-u-hiddenXlDown does not hide content on the screen size XXL + + Class ms-u-hiddenXlDown does not hide content on the screen size XXXL +
ms-u-hiddenXlUp + Class ms-u-hiddenXlUp does not hide content on the screen size SM + + Class ms-u-hiddenXlUp does not hide content on the screen size MD + + Class ms-u-hiddenXlUp does not hide content on the screen size LG + + + Class ms-u-hiddenXlUp hides content for screen size XL + + + Class ms-u-hiddenXlUp hides content for screen size XXL + + + Class ms-u-hiddenXlUp hides content for screen size XXXL +
ms-u-hiddenXxl + Class ms-u-hiddenXxl does not hide content on the screen size SM + + Class ms-u-hiddenXxl does not hide content on the screen size MD + + Class ms-u-hiddenXxl does not hide content on the screen size LG + + Class ms-u-hiddenXxl does not hide content on the screen size XL + + + Class ms-u-hiddenXxl hides content for screen size XXL + + Class ms-u-hiddenXxl does not hide content on the screen size XXXL +
ms-u-hiddenXxlDown + + Class ms-u-hiddenXxlDown hides content for screen size SM + + + Class ms-u-hiddenXxlDown hides content for screen size MD + + + Class ms-u-hiddenXxlDown hides content for screen size LG + + + Class ms-u-hiddenXxlDown hides content for screen size XL + + + Class ms-u-hiddenXxlDown hides content for screen size XXL + + Class ms-u-hiddenXxlDown does not hide content on the screen size XXXL +
ms-u-hiddenXxlUp + Class ms-u-hiddenXxlUp does not hide content on the screen size SM + + Class ms-u-hiddenXxlUp does not hide content on the screen size MD + + Class ms-u-hiddenXxlUp does not hide content on the screen size LG + + Class ms-u-hiddenXxlUp does not hide content on the screen size XL + + + Class ms-u-hiddenXxlUp hides content for screen size XXL + + + Class ms-u-hiddenXxlUp hides content for screen size XXXL +
ms-u-hiddenXxxl + Class ms-u-hiddenXxxl does not hide content on the screen size SM + + Class ms-u-hiddenXxxl does not hide content on the screen size MD + + Class ms-u-hiddenXxxl does not hide content on the screen size LG + + Class ms-u-hiddenXxxl does not hide content on the screen size XL + + Class ms-u-hiddenXxxl does not hide content on the screen size XXL + + + Class ms-u-hiddenXxxl hides content for screen size XXXL +
+ +

How to use

<div class="ms-Grid-col ms-u-sm12 ms-u-hiddenXlDown">hidden on small</div>
+      <div class="ms-Grid-col ms-u-sm12 ms-u-hiddenXxlUp">hidden on large up</div>
+ +
+
+
+
The screen is XL or smaller.
+
+
+
The screen is XXL or larger.
+
+
+
+
+ +
+
+ + + \ No newline at end of file diff --git a/dist/documentation/Typography/index.html b/dist/documentation/Typography/index.html new file mode 100644 index 000000000..03c727ae0 --- /dev/null +++ b/dist/documentation/Typography/index.html @@ -0,0 +1,318 @@ + + + + + Office Fabric UI Core Documentation + + + + + +
+ +
+
+ +
+ +
+

Typography

+

Fabric includes 10 base font classes that represent the type ramp for the Office Design Language. Each base class sets a default size, weight, and color.

+ +
    +
  • +
    + ms-font-su +
    +
    +

    42px

    +
    +
    +

    Segoe UI Light

    +
    +
    +

    ms-color-neutralPrimary

    +
    +
  • +
    + ms-font-xxl +
    +
    +

    28px

    +
    +
    +

    Segoe UI Light

    +
    +
    +

    ms-color-neutralPrimary

    +
    +
  • +
    + ms-font-xl +
    +
    +

    21px

    +
    +
    +

    Segoe UI Light

    +
    +
    +

    ms-color-neutralPrimary

    +
    +
  • +
    + ms-font-l +
    +
    +

    17px

    +
    +
    +

    Segoe UI Semilight

    +
    +
    +

    ms-color-neutralPrimary

    +
    +
  • +
    + ms-font-m-plus +
    +
    +

    15px

    +
    +
    +

    Segoe UI Regular

    +
    +
    +

    ms-color-neutralPrimary

    +
    +
  • +
    + ms-font-m +
    +
    +

    14px

    +
    +
    +

    Segoe UI Regular

    +
    +
    +

    ms-color-neutralPrimary

    +
    +
  • +
    + ms-font-s-plus +
    +
    +

    13px

    +
    +
    +

    Segoe UI Regular

    +
    +
    +

    ms-color-neutralPrimary

    +
    +
  • +
    + ms-font-s +
    +
    +

    12px

    +
    +
    +

    Segoe UI Regular

    +
    +
    +

    ms-color-neutralPrimary

    +
    +
  • +
    + ms-font-xs +
    +
    +

    11px

    +
    +
    +

    Segoe UI Regular

    +
    +
    +

    ms-color-neutralPrimary

    +
    +
  • +
    + ms-font-mi +
    +
    +

    10px

    +
    +
    +

    Segoe UI Semibold

    +
    +
    +

    ms-color-neutralPrimary

    +
    +
+ +

Font weight

+

Use these classes to set the font weight, independent of its size and color.

+ +
+
+
+
+

Class

+
+
+

Weight

+
+
+
+
+

Light

+
+
+

ms-fontWeight-light

+
+
+
+

Semilight

+
+
+

ms-fontWeight-semilight

+
+
+
+

Regular

+
+
+

ms-fontWeight-regular

+
+
+
+

Semi Bold

+
+
+

ms-fontWeight-semibold

+
+
+
+ +

Font size

+

Use these classes to set the font size, independent of its weight and color.

+ +
+
+
+
+

Class

+
+
+

Size

+
+
+ +
+
+ ms-fontSize-su +
+
+ 42px +
+
+
+ ms-fontSize-xxl +
+
+ 28px +
+
+
+ ms-fontSize-xl +
+
+ 21px +
+
+
+ ms-fontSize-l +
+
+ 17px +
+
+
+ ms-fontSize-mPlus +
+
+ 15px +
+
+
+ ms-fontSize-m +
+
+ 14px +
+
+
+ ms-fontSize-sPlus +
+
+ 13px +
+
+
+ ms-fontSize-s +
+
+ 12px +
+
+
+ ms-fontSize-xs +
+
+ 11px +
+
+
+ ms-fontSize-mi +
+
+ 10px +
+
+
+
+ +
+
+ + + \ No newline at end of file diff --git a/dist/documentation/docs.min.css b/dist/documentation/docs.min.css new file mode 100644 index 000000000..a96964b27 --- /dev/null +++ b/dist/documentation/docs.min.css @@ -0,0 +1,6 @@ +/* Copyright (c) Microsoft. All rights reserved. Licensed under the MIT license. See LICENSE in the project root for license information. */ +/** + * Office UI Fabric 4.0.0 + * The front-end framework for building experiences for Office 365. + **/ +h1,h2,h3,h4{font-weight:400;line-height:1.2;margin:30px 0 8px}h1{color:#666;font-size:42px;font-weight:100}h1,h2{font-family:Segoe UI,-apple-system,BlinkMacSystemFont,Roboto,Helvetica Neue,sans-serif}h2{font-weight:300;font-size:28px;color:#333}h3{font-family:Segoe UI,-apple-system,BlinkMacSystemFont,Roboto,Helvetica Neue,sans-serif;font-weight:400;font-size:21px;color:#212121!important}h4{font-weight:600}h4,p{font-family:Segoe UI,-apple-system,BlinkMacSystemFont,Roboto,Helvetica Neue,sans-serif;font-size:17px;color:#333}p{margin-bottom:20px;line-height:1.5}p,p strong{font-weight:400}p strong{font-family:Segoe UI,-apple-system,BlinkMacSystemFont,Roboto,Helvetica Neue,sans-serif;font-weight:600}code.hljs{display:block;overflow-x:auto;padding:.5em;background:#deecf9}#body-content a{text-decoration:none;cursor:pointer;position:relative;white-space:nowrap}#body-content a:focus{outline:none!important}@media screen and (-ms-high-contrast:active){#body-content a:focus:before{border:1px solid #fff}}@media screen and (-ms-high-contrast:black-on-white){#body-content a:focus:before{border:1px solid #37006e}}@media screen and (-ms-high-contrast:active){#body-content a,#body-content a:hover{color:#0000c0}}@media screen and (-ms-high-contrast:black-on-white){#body-content a,#body-content a:hover{color:#0000c0}}#body-content .docs-Header{position:fixed;top:0;height:50px;left:0;right:0;line-height:50px;padding:0 20px;background:#005a9e;overflow:hidden;white-space:nowrap;z-index:1;width:100%;-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none}#body-content .docs-Header .Header-buttons{float:right}#body-content .docs-Header .Header-button{position:relative;text-decoration:none;background:0 0;color:#fff;border:none;padding:0;padding:0 10px;min-width:50px;height:50px;line-height:50px;margin:0 5px;text-transform:uppercase;display:inline-block;vertical-align:top;box-sizing:border-box}#body-content .docs-Header .Header-button:hover{background-color:#0078d7}#body-content .docs-Nav{display:none;margin:0 0 8px;width:100%}#body-content .docs-Nav .docs-MobileNav-item{display:inline-block;margin:0 12px 0 0;width:auto}#body-content .docs-Nav .docs-MobileNav-item i{display:none}#body-content .docs-Nav .docs-MobileNav-item a,#body-content .docs-Nav .docs-MobileNav-item a:active{font-family:Segoe UI WestEuropean,Segoe UI,-apple-system,BlinkMacSystemFont,Roboto,Helvetica Neue,sans-serif;-webkit-font-smoothing:antialiased;font-size:14px;font-weight:400;color:#333;display:block;height:100%;padding-bottom:8px;padding-top:16px;position:relative}@media screen and (-ms-high-contrast:active){#body-content .docs-Nav .docs-MobileNav-item a,#body-content .docs-Nav .docs-MobileNav-item a:active{color:#ff0}}@media screen and (-ms-high-contrast:black-on-white){#body-content .docs-Nav .docs-MobileNav-item a,#body-content .docs-Nav .docs-MobileNav-item a:active{color:#0000c0}}#body-content .docs-Nav .docs-MobileNav-item a:focus{outline:none!important}@media screen and (-ms-high-contrast:active){#body-content .docs-Nav .docs-MobileNav-item a:focus:before{border:1px solid #fff}}@media screen and (-ms-high-contrast:black-on-white){#body-content .docs-Nav .docs-MobileNav-item a:focus:before{border:1px solid #37006e}}#body-content .docs-Nav div.current a{border-bottom:2px solid #0078d7}@media (min-width:1024px){#body-content .docs-Nav{display:block}#body-content .docs-Nav div.docs-MobileNav-subMenu{display:none}}#body-content .docs-Styles-section{float:left}#body-content .docs-Table{margin-bottom:20px;max-width:1140px;width:100%}#body-content .docs-Table th{font-family:Segoe UI WestEuropean,Segoe UI,-apple-system,BlinkMacSystemFont,Roboto,Helvetica Neue,sans-serif;-webkit-font-smoothing:antialiased;font-size:14px;font-weight:400;padding:10px;text-align:left;vertical-align:top}#body-content .docs-Table tr{border-bottom:1px solid #f4f4f4;padding:5px 10px}#body-content .docs-Table td{font-size:14px;padding:10px}#body-content .docs-Table td.light-border{border-style:solid;border-width:2px}#body-content .docs-Table .docs-Table-visibleForScreenReaders{font-size:0}#body-content .docs-Table i.ms-Icon--CheckMark:before{font-size:17px}#body-content .docs-Table i.ms-Icon--Cancel:before{font-size:14px}#body-content .docs-Table--striped tbody tr:nth-child(odd){background:#f8f8f8}#body-content .docs-ListTable li{list-style-type:none!important}#body-content ol.docs-ListTable,#body-content ul.docs-ListTable{margin-left:0!important;margin-right:0!important;padding-left:0!important;padding-right:0!important}#body-content ul.docs-ListTable,#body-content ul.docs-ListTable li{list-style-type:none!important}#body-content .docs-Page{margin:50px auto;padding:0 20px;position:relative;overflow:hidden}#body-content .docs-Page--home{min-height:0}#body-content .docs-innerPage{float:left;position:relative;width:100%}#body-content .docs-Page-leftNav{display:none;position:fixed;top:50px;width:300px;height:100%;border-right:1px solid #eee}@media (min-width:1024px){#body-content .docs-Page.has-leftNav{padding-left:330px}#body-content .docs-Page.has-leftNav .docs-Page-leftNav{left:0;display:block}#body-content .docs-Page.has-rightNav{padding-right:300px}#body-content .docs-Page.has-rightNav .docs-Page-rightNav{right:0;display:block}}.docs-animationsTable-header,.docs-animationsTable-header .docs-animationExampleColumn{display:none}@media (min-width:480px){.docs-animationsTable-header,.docs-animationsTable-header .docs-animationExampleColumn{display:block}}.docs-animationsTable-body .docs-animationCubicColumn,.docs-animationsTable-body .docs-animationTimingColumn,.docs-animationsTable-header .docs-animationCubicColumn,.docs-animationsTable-header .docs-animationTimingColumn{display:none}.docs-animationsTable-body .docs-animationClassColumn,.docs-animationsTable-body .docs-animationDescriptionColumn,.docs-animationsTable-header .docs-animationClassColumn,.docs-animationsTable-header .docs-animationDescriptionColumn{margin-bottom:12px}.docs-animationsTable-body .docs-animationExampleColumn,.docs-animationsTable-header .docs-animationExampleColumn{margin-bottom:14px}@media (min-width:640px){.docs-animationsTable-body .docs-animationDescriptionColumn,.docs-animationsTable-header .docs-animationDescriptionColumn{margin-bottom:0}.docs-animationsTable-body .docs-animationClassColumn,.docs-animationsTable-header .docs-animationClassColumn{amrgin-bottom:0}.docs-animationsTable-body .docs-animationExampleColumn,.docs-animationsTable-header .docs-animationExampleColumn{margin-bottom:0}}@media (min-width:1024px){.docs-animationsTable-body .docs-animationCubicColumn,.docs-animationsTable-body .docs-animationTimingColumn,.docs-animationsTable-header .docs-animationCubicColumn,.docs-animationsTable-header .docs-animationTimingColumn{display:block}}.docs-animationsTable-body.ms-Grid-row{margin-top:12px}.docs-animationsTable-body.ms-Grid-row .ms-Grid-col{line-height:32px;min-height:30px}.docs-animationsTable-body.ms-Grid-row .ms-Grid-col .mobileText{font-family:Segoe UI WestEuropean,Segoe UI,-apple-system,BlinkMacSystemFont,Roboto,Helvetica Neue,sans-serif;-webkit-font-smoothing:antialiased;font-weight:600}@media (min-width:480px){.docs-animationsTable-body.ms-Grid-row .ms-Grid-col{line-height:18px;vertical-align:middle}.docs-animationsTable-body.ms-Grid-row .ms-Grid-col .mobileText{display:none}}@media (min-width:1024px){.docs-animationsTable-body.ms-Grid-row .ms-Grid-col{min-height:90px;line-height:90px}}.AnimationExample{position:relative;width:100%;height:90px;overflow:hidden;display:inline-block;float:left}.AnimationExample-content{width:100%;height:100%;border:1px solid #666;padding:10px}.AnimationExample-content hr{margin-top:8px;margin-bottom:8px}.AnimationExample-panel{position:absolute;top:0;width:60px;height:100%;opacity:0;background-color:#0078d7}.AnimationExample-note{display:inline-block;float:left;margin-left:10px}.AnimationExample .ms-u-slideLeftIn40 .AnimationExample-panel{right:0}.AnimationExample .ms-u-slideDownIn20 .AnimationExample-panel,.AnimationExample .ms-u-slideUpIn20 .AnimationExample-panel{top:60px;height:30px;width:100%}.AnimationExample .ms-u-slideDownIn10 .AnimationExample-panel,.AnimationExample .ms-u-slideUpIn10 .AnimationExample-panel{top:60px;height:20px;width:60px;right:10px}.AnimationExample .ms-u-slideDownIn20 .AnimationExample-panel{top:0}.AnimationExample .ms-u-slideDownIn10 .AnimationExample-panel{top:10px}.docs-animationsTable-body .ms-u-fadeOut100,.docs-animationsTable-body .ms-u-fadeOut200,.docs-animationsTable-body .ms-u-fadeOut400,.docs-animationsTable-body .ms-u-fadeOut500,.docs-animationsTable-body .ms-u-scaleDownOut98,.docs-animationsTable-body .ms-u-scaleUpOut103,.docs-animationsTable-body .ms-u-slideDownOut10,.docs-animationsTable-body .ms-u-slideDownOut20,.docs-animationsTable-body .ms-u-slideLeftOut40,.docs-animationsTable-body .ms-u-slideRightOut40,.docs-animationsTable-body .ms-u-slideUpOut10,.docs-animationsTable-body .ms-u-slideUpOut20{animation-play-state:paused}.docs-animationsTable-body .ms-u-fadeOut100 .AnimationExample-panel,.docs-animationsTable-body .ms-u-fadeOut200 .AnimationExample-panel,.docs-animationsTable-body .ms-u-fadeOut400 .AnimationExample-panel,.docs-animationsTable-body .ms-u-fadeOut500 .AnimationExample-panel,.docs-animationsTable-body .ms-u-scaleDownOut98 .AnimationExample-panel,.docs-animationsTable-body .ms-u-scaleUpOut103 .AnimationExample-panel,.docs-animationsTable-body .ms-u-slideDownOut10 .AnimationExample-panel,.docs-animationsTable-body .ms-u-slideDownOut20 .AnimationExample-panel,.docs-animationsTable-body .ms-u-slideLeftOut40 .AnimationExample-panel,.docs-animationsTable-body .ms-u-slideRightOut40 .AnimationExample-panel,.docs-animationsTable-body .ms-u-slideUpOut10 .AnimationExample-panel,.docs-animationsTable-body .ms-u-slideUpOut20 .AnimationExample-panel{animation-play-state:running;opacity:1}.docs-animationsTable-body .ms-u-slideLeftOut40 .AnimationExample-panel,.docs-animationsTable-body .ms-u-slideRightOut40 .AnimationExample-panel{right:0}.docs-animationsTable-body .ms-u-slideLeftOut40 .AnimationExample-panel{left:0}.docs-animationsTable-body .ms-u-slideDownOut10 .AnimationExample-panel,.docs-animationsTable-body .ms-u-slideDownOut20 .AnimationExample-panel,.docs-animationsTable-body .ms-u-slideUpOut10 .AnimationExample-panel,.docs-animationsTable-body .ms-u-slideUpOut20 .AnimationExample-panel{width:100%;height:30px;top:0}.docs-animationsTable-body .ms-u-slideDownOut10 .AnimationExample-panel,.docs-animationsTable-body .ms-u-slideUpOut10 .AnimationExample-panel{width:60px;top:10px;right:10px;height:20px}.docs-animationsTable-body .ms-u-slideDownOut10 .AnimationExample-panel,.docs-animationsTable-body .ms-u-slideDownOut20 .AnimationExample-panel{top:60px}.docs-animationsTable-body .ms-u-scaleDownIn100,.docs-animationsTable-body .ms-u-scaleDownOut98,.docs-animationsTable-body .ms-u-scaleUpIn100,.docs-animationsTable-body .ms-u-scaleUpOut103{overflow:visible}.docs-animationsTable-body .ms-u-fadeIn100 .AnimationExample-panel,.docs-animationsTable-body .ms-u-fadeIn200 .AnimationExample-panel,.docs-animationsTable-body .ms-u-fadeIn400 .AnimationExample-panel,.docs-animationsTable-body .ms-u-fadeIn500 .AnimationExample-panel,.docs-animationsTable-body .ms-u-fadeOut100 .AnimationExample-panel,.docs-animationsTable-body .ms-u-fadeOut200 .AnimationExample-panel,.docs-animationsTable-body .ms-u-fadeOut400 .AnimationExample-panel,.docs-animationsTable-body .ms-u-fadeOut500 .AnimationExample-panel,.docs-animationsTable-body .ms-u-scaleDownIn100 .AnimationExample-panel,.docs-animationsTable-body .ms-u-scaleDownOut98 .AnimationExample-panel,.docs-animationsTable-body .ms-u-scaleUpIn100 .AnimationExample-panel,.docs-animationsTable-body .ms-u-scaleUpOut103 .AnimationExample-panel{height:100%;width:100%;top:0}.AnimationUsage{position:relative;width:150px;height:90px;overflow:hidden;float:left;display:inline-block;margin-bottom:20px}.AnimationUsage-content{width:100%;height:100%;padding:10px;border-style:solid;border-width:1px}.AnimationUsage-panel{position:absolute;top:0;width:60px;height:100%}.AnimationUsage-button{margin:30px 10px;float:left;display:inline-block}.docs-colorContainer{padding-left:9px;float:left;position:relative;width:100%}.docs-colorBox{height:65px;padding:18px;box-sizing:border-box}.docs-colorBox p{line-height:20px;font-size:12px;margin:0}.docs-colorBox .mobileText{font-family:Segoe UI WestEuropean,Segoe UI,-apple-system,BlinkMacSystemFont,Roboto,Helvetica Neue,sans-serif;-webkit-font-smoothing:antialiased;font-weight:600}.docs-colorBoxBG{padding-top:11px}.docs-colorBoxBG span.ms-font-size-m{font-size:10px;line-height:14px}@media (min-width:640px){.docs-colorBoxBG span.ms-font-size-m{font-size:14px;line-height:20px}}.docs-colorBox.ms-u-lg4{line-height:7px}@media (min-width:640px){.docs-colorBox.ms-u-lg4{width:32.333333%;margin-right:1%}}.docs-colorBottomRow{margin-bottom:16px}.docs-colorBottomRow .docs-colorBox{width:100%;font-size:12px;padding-top:12px}@media (min-width:640px){.docs-colorBottomRow .docs-colorBox{width:32.333333%;font-size:14px}}.docs-colorBox-hasBg{background-color:#f8f8f8}.docs-colorBox-hasBorder{border:1px solid #eaeaea}.docs-colorBoxBorder{border-width:1px;border-style:solid}.docs-colorBox:last-child{margin-right:0}.Typography-infoButton,.Typography-toggleCodeButton{background:none;border:none;margin:0;padding:0;cursor:pointer;font-size:12px;padding:0 7px;height:30px;display:inline-block;outline:none;vertical-align:super;position:absolute;right:0;z-index:2;top:50%;transform:translateY(-50%)}.Typography-infoButton .ms-Icon,.Typography-toggleCodeButton .ms-Icon{color:#a6a6a6}.Typography-infoButton img,.Typography-toggleCodeButton img{fill:#a6a6a6}.Typography-infoButton:hover .ms-Icon,.Typography-infoButton:hover img,.Typography-toggleCodeButton:hover .ms-Icon,.Typography-toggleCodeButton:hover img{color:#666;fill:#666}.ms-Callout.docs-ColorSection-swatchCallout{position:absolute;width:290px;height:inherit;right:-14%;top:100%;z-index:3;display:none;pointer-events:none}.ms-Callout.docs-ColorSection-swatchCallout.ms-Callout--arrowTop:after,.ms-Callout.docs-ColorSection-swatchCallout.ms-Callout--arrowTop:before{right:47px;left:auto}.ms-Callout.docs-ColorSection-swatchCallout .ms-Callout-inner{width:100%}.ms-Callout.docs-ColorSection-swatchCallout .ms-Callout-header{background-color:#fff}.docs-colorBottomRow .Typography-infoButton:hover+.ms-Callout.docs-ColorSection-swatchCallout{display:block}.docs-ColorSection-contrastText{float:left;width:75%;text-overflow:ellipsis;overflow:hidden}.docs-ColorSection-contrastRatio,.docs-ColorSection-contrastText{padding:10px;margin-bottom:0;padding-top:14px;padding-bottom:14px}.docs-ColorSection-contrastRatio{float:right;width:25%}.docs-ColorSection-palette{margin-bottom:20px}.docs-ColorSection-swatches{padding:10px;border:1px solid #eaeaea;padding-bottom:0;padding-right:0}.ms-Callout-inner{position:relative}.docs-ColorSection-contrastCaptionLeft{float:left}.docs-ColorSection-contrastCaptionLeft h4{font-family:Segoe UI WestEuropean,Segoe UI,-apple-system,BlinkMacSystemFont,Roboto,Helvetica Neue,sans-serif;-webkit-font-smoothing:antialiased;font-size:14px;font-weight:400}.docs-ColorSection-contrastCaptionRight{position:absolute;right:25px;top:0;color:#000;width:52px}.docs-ColorSection-contrastCaptionRight h4{font-family:Segoe UI WestEuropean,Segoe UI,-apple-system,BlinkMacSystemFont,Roboto,Helvetica Neue,sans-serif;-webkit-font-smoothing:antialiased;font-size:14px;font-weight:400}.docs-ColorSection-contrastCaption{margin-bottom:10px;padding-left:7px;white-space:nowrap}.docs-ColorSection-swatchHeader{width:100%;height:50px;padding:10px;position:relative}.docs-ColorSection-swatchTitle{position:absolute;bottom:10px}.docs-ColorSection-swatchHex{position:absolute;right:10px;text-align:right}.docs-ColorSection-swatchBody{overflow:hidden;height:0}.docs-ColorSection-swatchCode{padding:5px;padding-right:0;margin-bottom:10px;white-space:nowrap;font-size:12px}.docs-ColorSection-swatchCode:last-child{margin-bottom:0}@media (min-width:600px){.docs-ColorSection-swatchBody{padding:10px;height:auto}.docs-ColorSection-swatch{width:calc('50% - 10px');display:inline-block;vertical-align:top;margin-right:10px;margin-bottom:10px;border:1px solid #eaeaea}}@media (min-width:980px){.docs-ColorSection-swatch{width:calc('33.3% - 10px')}}@media (min-width:1200px){.docs-ColorSection-swatch{width:calc('25% - 10px')}}a,body,html,input{margin:0;padding:0}body{font-family:Segoe UI WestEuropean,Segoe UI,-apple-system,BlinkMacSystemFont,Roboto,Helvetica Neue,sans-serif;font-size:15px;font-weight:400;-webkit-font-smoothing:antialiased}*,:after,:before{box-sizing:border-box}img{border:none;padding:0;margin:0}pre{font-size:13px;padding:10px;background-color:#f4f4f4}.docs-u-fontCode,code,pre{font-family:Consolas,Monaco,Ubuntu Mono,Courier,monospace}.docs-u-fontCode,code{font-weight:400;padding:2px;overflow:hidden;border:none}#body-content .docs-IconList ul{margin:0;margin-bottom:20px}#body-content .docs-IconList ul li{float:left;font-size:11px;color:#666;text-align:center;width:33.3%;height:138px;padding:10px;overflow:hidden;background-color:#f8f8f8;width:49%;margin-right:1%;margin-bottom:1%;min-height:124px;list-style:none!important}@media (min-width:640px){#body-content .docs-IconList ul li{width:24%}}@media (min-width:1024px){#body-content .docs-IconList ul li{margin-right:1%;margin-bottom:1%;min-height:124px;height:100px}}#body-content .docs-IconList ul li .ms-Icon{color:#333;font-size:32px;margin:10px auto;width:100%;margin-top:.8em}#body-content .docs-IconList ul li span{display:inline-block;text-align:left;margin-top:10px;width:100%;font-size:12px}#body-content .LeftNav{width:210px;text-align:right;margin-top:42px;display:none}@media (min-width:967px){#body-content .LeftNav{display:block}}#body-content .LeftNav-links{margin:0}#body-content .LeftNav-item{display:block;text-align:left;margin:0}#body-content a.LeftNav-link{display:block;height:40px;font-family:Segoe UI Regular WestEuropean,Segoe UI,Tahoma,Arial,sans-serif;font-size:14px;line-height:40px;padding:0 40px;border:none;cursor:pointer;color:#333;background:#fff;outline:transparent}#body-content a.LeftNav-link:hover{background:#f8f8f8;cursor:pointer}#body-content a.LeftNav-link:focus{color:#212121;outline:none!important;outline-style:none;box-shadow:none;border-color:transparent}#body-content a.LeftNav-link.is-selected{font-family:Segoe UI WestEuropean,Segoe UI,-apple-system,BlinkMacSystemFont,Roboto,Helvetica Neue,sans-serif;-webkit-font-smoothing:antialiased;font-weight:600;color:#000;border-left-width:2px;border-left-style:solid}#body-content a.LeftNav-link.LeftNav-link--active{color:#0078d7;background-color:#f4f4f4;position:relative;color:#333}#body-content a.LeftNav-link.LeftNav-link--active:after{content:'';position:absolute;border-left:2px solid #000;top:0;left:0;right:0;bottom:0}#body-content a.LeftNav-link.LeftNav-link--active:active,#body-content a.LeftNav-link.LeftNav-link--active:visited,#body-content a:hover.LeftNav-link{color:#0078d7}#body-content .ms-font-xxl:first-child{margin-top:0}#body-content .ms-font-l{line-height:24px}#body-content .ms-font-m,#body-content .ms-font-s{line-height:20px}#body-content a{text-decoration:none;cursor:pointer}#body-content pre{border-radius:0;padding:0;border:none;margin-bottom:20px}.docs-demoGrid,.docs-demoGrid .ms-Grid-row{margin:0 -10px}.docs-demoGrid .block{background-color:#a6a6a6;color:#fff;height:50px;line-height:50px;margin-bottom:20px;text-align:center}.docs-HelperClasses .ms-Grid-row{width:100%;float:left}.docs-HelperClasses .docs-HelperHeader{display:none}.docs-HelperClasses .ms-Grid-col p.font-size-m{margin-bottom:12px}@media (min-width:640px){.docs-HelperClasses .docs-HelperHeader{display:block}.docs-HelperClasses p.font-size-m{margin-bottom:0}}.full-width-container{margin-top:0!important;padding-top:0}.ms-u-slideRightIn80{animation-name:fadeIn,a;-webkit-animation-duration:.367s;-moz-animation-duration:.367s;-ms-animation-duration:.367s;-o-animation-duration:.367s;animation-timing-function:cubic-bezier(.1,.9,.2,1);animation-fill-mode:both}@keyframes a{0%{transform:translate3d(-80px,0,0)}to{transform:translateZ(0)}}.ms-u-slideLeftIn80{animation-name:fadeIn,b;-webkit-animation-duration:.367s;-moz-animation-duration:.367s;-ms-animation-duration:.367s;-o-animation-duration:.367s;animation-timing-function:cubic-bezier(.1,.9,.2,1);animation-fill-mode:both}@keyframes b{0%{transform:translate3d(80px,0,0)}to{transform:translateZ(0)}}.ms-u-slideLeftOut80{animation-name:fadeOut,c;-webkit-animation-duration:.367s;-moz-animation-duration:.367s;-ms-animation-duration:.367s;-o-animation-duration:.367s;animation-timing-function:cubic-bezier(.1,.9,.2,1);animation-fill-mode:both}@keyframes c{0%{transform:translateZ(0)}to{transform:translate3d(-80px,0,0)}}.ms-u-slideRightOut80{animation-name:fadeOut,d;-webkit-animation-duration:.367s;-moz-animation-duration:.367s;-ms-animation-duration:.367s;-o-animation-duration:.367s;animation-timing-function:cubic-bezier(.1,.9,.2,1);animation-fill-mode:both}@keyframes d{0%{transform:translateZ(0)}to{transform:translate3d(80px,0,0)}}.fabric-ie #layout-navigation{top:56px}.fabric-ie div.docs-showNavigation .tier-1{margin-top:57px}.widget-FabricStyleOverrides{display:none}@media (max-width:700px){.fabric-ie #layout-navigation{top:0}} \ No newline at end of file diff --git a/dist/documentation/index.html b/dist/documentation/index.html new file mode 100644 index 000000000..124f9c5b5 --- /dev/null +++ b/dist/documentation/index.html @@ -0,0 +1,399 @@ + + + + + Office Fabric UI Core Documentation + + + + + +
+ +
+
+ +
+ +

Get Started

+

Quick start

+

The simplest way to get started is to add a copy of Fabric to your project.

+
    +
  1. Download the source code zip file from the latest release on GitHub.
    2. +
  2. Unzip the file and copy the Fabric folder into your project.
    3. +
  3. Add a reference to fabric.css in the <head> of your page. Make sure the path is correct.
    4. +
  4. If you're using components, add a reference to fabric.components.css after the fabric.css reference.
    5. +
+ +

Using Fabric icons and fonts

+

Now that your project references Fabric, you can apply type styles to any text element.

+ 
<span class="ms-font-su ms-fontColor-themePrimary">Big blue text</span>
+

To use icons, add an <i> element with the appropriate icon classes.

+ 
<i class="ms-Icon ms-Icon--mail" aria-hidden="true"></i>
+

By default, icons inherit the text size and color of their parent. To override this, apply type styles directly to the icon.

+ + +

Using components

+

To use Fabric components:

+
    +
  1. Add markup to your pages using the appropriate classes.
    2. +
  2. If the component requires JavaScript, you can use the sample JavaScript included in the latest release on GitHub.
    3. +
  3. Initialize the component JavaScript, and you’re all set! For an example that shows how to initialize the JavaScript, see the components page.
    4. +
+ +

Other ways to get Fabric

+

In addition to downloading a copy for your project, you can include Fabric via a CDN reference, by adding it through a package manager, or by building your own copy from the source code.

+ +

Reference the CDN

+

If you prefer to have your project's assets stored on an external server, Fabric is available from the apps for Office CDN. To use it, include the following references in the <head> of your page.

+ 
<link rel="stylesheet" href="https://appsforoffice.microsoft.com/fabric/2.2.0/fabric.min.css">
+<link rel="stylesheet" href="https://appsforoffice.microsoft.com/fabric/2.2.0/fabric.components.min.css">
+
+

New versions of Fabric might not be available on the CDN right away. The following table lists the releases that are available now. To reference a specific version, update the version number in the URL to match the one you want.

+ + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + +
Fabric ReleaseAvailable on CDN
2.6.1 + + Version 2.6.1 Available on the CDN +
2.6.0 + + Version 2.6.0 Available on the CDN +
2.5.0 + + Version 2.5.0 Available on the CDN +
2.4.1 + + Version 2.4.1 Available on the CDN +
2.4.0 + + Version 2.4.0 Available on the CDN +
2.3.0 + + Version 2.3.0 Available on the CDN +
2.2.0 + + Version 2.2.0 Available on the CDN +
2.1.0 + + Version 2.1.0 Available on the CDN +
2.0.1 + + Version 2.0.1 Available on the CDN +
1.2.1 + + Version 1.2.1 Available on the CDN +
1.1.3 + + Version 1.1.3 Available on the CDN +
1.1.2 + + Version 1.1.2 Available on the CDN +
1.1.1 + + Version 1.1.1 Available on the CDN +
1.0.0 + + Version 1.0.0 Available on the CDN +
+ +

Package managers

+

Fabric is also available from a variety of package managers, including Bower, npm, and the NuGet Package Manager. You can quickly add Fabric as a package and stay up to date with the latest version.

+ +

Install with Bower

+

To install Fabric using Bower, run the following command:

+ 
$ bower install office-ui-fabric
+ +

Install with npm

+

To install Fabric using npm, run the following command:

+ 
$ npm install office-ui-fabric
+ +

Install with NuGet Package Manager

+

To install Fabric's NuGet package, run the following command in the package manager console:

+ 
PM> Install-Package OfficeUIFabric
+ +

Build from source

+

Fabric is easy to build and customize locally using gulp and a handful of tasks to watch and build specific parts of the toolkit. You can also use gulp to build and tweak demos and samples.

+ +

For more information about how to build Fabric locally, including gulp tasks, check out our instructions on GitHub.

+ +
+
+ + + \ No newline at end of file diff --git a/dist/sass/Fabric.Animations.Output.scss b/dist/sass/Fabric.Animations.Output.scss new file mode 100644 index 000000000..38227eb79 --- /dev/null +++ b/dist/sass/Fabric.Animations.Output.scss @@ -0,0 +1,419 @@ +// Copyright (c) Microsoft. All rights reserved. Licensed under the MIT license. See LICENSE in the project root for license information. + +// +// Office UI Fabric +// -------------------------------------------------- +// Fabric Animations + + +// Note that all animation classes should begin with the "ms-u" utility prefix. +// The original class names are deprecated and will be removed in a future release. + +@import "Fabric.Animations"; + +// slideRightIn10 +.ms-u-slideRightIn10 { + @include ms-u-slideRightIn10; +} +@-webkit-keyframes slideRightIn10 { + from { -webkit-transform:translate3d(-10px, 0px, 0px); } + to { -webkit-transform:translate3d(0px, 0px, 0px); } +} +@keyframes slideRightIn10 { + from { transform:translate3d(-10px, 0px, 0px); } + to { transform:translate3d(0px, 0px, 0px); } +} + +// slideRightIn20 +.ms-u-slideRightIn20 { + @include ms-u-slideRightIn20; +} +@-webkit-keyframes slideRightIn20 { + from { -webkit-transform:translate3d(-20px, 0px, 0px); } + to { -webkit-transform:translate3d(0px, 0px, 0px); } +} +@keyframes slideRightIn20 { + from { transform:translate3d(-20px, 0px, 0px); } + to { transform:translate3d(0px, 0px, 0px); } +} + +// slideRightIn40 +.ms-u-slideRightIn40 { + @include ms-u-slideRightIn40; +} +@-webkit-keyframes slideRightIn40 { + from { -webkit-transform:translate3d(-40px, 0px, 0px); } + to { -webkit-transform:translate3d(0px, 0px, 0px); } +} +@keyframes slideRightIn40 { + from { transform:translate3d(-40px, 0px, 0px); } + to { transform:translate3d(0px, 0px, 0px); } +} + +// slideLeftIn10 +.ms-u-slideLeftIn10 { + @include ms-u-slideLeftIn10; +} +@-webkit-keyframes slideLeftIn10 { + from { -webkit-transform:translate3d(10px, 0px, 0px); } + to { -webkit-transform:translate3d(0px, 0px, 0px); } +} +@keyframes slideLeftIn10 { + from { transform:translate3d(10px, 0px, 0px); } + to { transform:translate3d(0px, 0px, 0px); } +} + +// slideLeftIn20 +.ms-u-slideLeftIn20 { + @include ms-u-slideLeftIn20; +} +@-webkit-keyframes slideLeftIn20 { + from { -webkit-transform:translate3d(20px, 0px, 0px); } + to { -webkit-transform:translate3d(0px, 0px, 0px); } +} +@keyframes slideLeftIn20 { + from { transform:translate3d(20px, 0px, 0px); } + to { transform:translate3d(0px, 0px, 0px); } +} + +// slideLeftIn40 +.ms-u-slideLeftIn40 { + @include ms-u-slideLeftIn40; +} +@-webkit-keyframes slideLeftIn40 { + from { -webkit-transform:translate3d(40px, 0px, 0px); } + to { -webkit-transform:translate3d(0px, 0px, 0px); } +} +@keyframes slideLeftIn40 { + from { transform:translate3d(40px, 0px, 0px); } + to { transform:translate3d(0px, 0px, 0px); } +} + +// slideRightIn400 +.ms-u-slideRightIn400 { + @include ms-u-slideRightIn400; +} +@-webkit-keyframes slideRightIn400 { + from { -webkit-transform:translate3d(-400px, 0px, 0px); } + to { -webkit-transform:translate3d(0px, 0px, 0px); } +} +@keyframes slideRightIn400 { + from { transform:translate3d(-400px, 0px, 0px); } + to { transform:translate3d(0px, 0px, 0px); } +} + +// slideLeftIn400 +.ms-u-slideLeftIn400 { + @include ms-u-slideLeftIn400; +} +@-webkit-keyframes slideLeft400 { + from { -webkit-transform:translate3d(400px, 0px, 0px); } + to { -webkit-transform:translate3d(0px, 0px, 0px); } +} +@keyframes slideLeft400 { + from { transform:translate3d(400px, 0px, 0px); } + to { transform:translate3d(0px, 0px, 0px); } +} + +// slideUpIn20 +.ms-u-slideUpIn20 { + @include ms-u-slideUpIn20; +} +@-webkit-keyframes slideUpIn20 { + from { -webkit-transform:translate3d(0px, 20px, 0px); } + to { -webkit-transform:translate3d(0px, 0px, 0px); } +} +@keyframes slideUpIn20 { + from { transform:translate3d(0px, 20px, 0px); } + to { transform:translate3d(0px, 0px, 0px); } +} + +// slideUpIn10 +.ms-u-slideUpIn10 { + @include ms-u-slideUpIn10; +} +@-webkit-keyframes slideUpIn10 { + from { -webkit-transform:translate3d(0px, 10px, 0px); } + to { -webkit-transform:translate3d(0px, 0px, 0px); } +} +@keyframes slideUpIn10 { + from { transform:translate3d(0px, 10px, 0px); } + to { transform:translate3d(0px, 0px, 0px); } +} + +// slideDownIn20 +.ms-u-slideDownIn20 { + @include ms-u-slideDownIn20; +} +@-webkit-keyframes slideDownIn20 { + from { -webkit-transform:translate3d(0px, -20px, 0px); } + to { -webkit-transform:translate3d(0px, 0px, 0px); } +} +@keyframes slideDownIn20 { + from { transform:translate3d(0px, -20px, 0px); } + to { transform:translate3d(0px, 0px, 0px); } +} + +// slideDownIn10 +.ms-u-slideDownIn10 { + @include ms-u-slideDownIn10; +} +@-webkit-keyframes slideDownIn10 { + from { -webkit-transform:translate3d(0px, -10px, 0px); } + to { -webkit-transform:translate3d(0px, 0px, 0px); } +} +@keyframes slideDownIn10 { + from { transform:translate3d(0px, -10px, 0px); } + to { transform:translate3d(0px, 0px, 0px); } +} + +// slideRightOut40 +.ms-u-slideRightOut40 { + @include ms-u-slideRightOut40; +} +@-webkit-keyframes slideRightOut40 { + from { -webkit-transform:translate3d(0px, 0px, 0px); } + to { -webkit-transform:translate3d(40px, 0px, 0px); } +} +@keyframes slideRightOut40 { + from { transform:translate3d(0px, 0px, 0px); } + to { transform:translate3d(40px, 0px, 0px); } +} + +// slideLeftOut40 +.ms-u-slideLeftOut40 { + @include ms-u-slideLeftOut40; +} +@-webkit-keyframes slideLeftOut40 { + from { -webkit-transform:translate3d(0, 0px, 0px); } + to { -webkit-transform:translate3d(-40px, 0px, 0px); } +} +@keyframes slideLeftOut40 { + from { transform:translate3d(0, 0px, 0px); } + to { transform:translate3d(-40px, 0px, 0px); } +} + +// slideRightOut400 +.ms-u-slideRightOut400 { + @include ms-u-slideRightOut400; +} +@-webkit-keyframes slideRightOut400 { + from { -webkit-transform:translate3d(0, 0px, 0px); } + to { -webkit-transform:translate3d(400px, 0px, 0px); } +} +@keyframes slideRightOut400 { + from { transform:translate3d(0, 0px, 0px); } + to { transform:translate3d(400px, 0px, 0px); } +} + +// slideLeftOut400 +.ms-u-slideLeftOut400 { + @include ms-u-slideLeftOut400; +} +@-webkit-keyframes slideLeftOut400 { + from { -webkit-transform:translate3d(0, 0px, 0px); } + to { -webkit-transform:translate3d(-400px, 0px, 0px); } +} +@keyframes slideLeftOut400 { + from { transform:translate3d(0, 0px, 0px); } + to { transform:translate3d(-400px, 0px, 0px); } +} + +// slideUpOut20 +.ms-u-slideUpOut20 { + @include ms-u-slideUpOut20; +} +@-webkit-keyframes slideUpOut20 { + from { -webkit-transform:translate3d(0px, 0, 0px); } + to { -webkit-transform:translate3d(0px, -20px, 0px); } +} +@keyframes slideUpOut20 { + from { transform:translate3d(0px, 0, 0px); } + to { transform:translate3d(0px, -20px, 0px); } +} + +// slideUpOut10 +.ms-u-slideUpOut10 { + @include ms-u-slideUpOut10; +} +@-webkit-keyframes slideUpOut10 { + from { -webkit-transform:translate3d(0px, 0, 0px); } + to { -webkit-transform:translate3d(0px, -10px, 0px); } +} +@keyframes slideUpOut10 { + from { transform:translate3d(0px, 0, 0px); } + to { transform:translate3d(0px, -10px, 0px); } +} + +// slideDownOut20 +.ms-u-slideDownOut20 { + @include ms-u-slideDownOut20; +} +@-webkit-keyframes slideDownOut20 { + from { -webkit-transform:translate3d(0px, 0, 0px); } + to { -webkit-transform:translate3d(0px, 20px, 0px); } +} +@keyframes slideDownOut20 { + from { transform:translate3d(0px, 0, 0px); } + to { transform:translate3d(0px, 20px, 0px); } +} + +// slideDownOut10 +.ms-u-slideDownOut10 { + @include ms-u-slideDownOut10; +} +@-webkit-keyframes slideDownOut10 { + from { -webkit-transform:translate3d(0px, 0, 0px); } + to { -webkit-transform:translate3d(0px, 10px, 0px); } +} +@keyframes slideDownOut10 { + from { transform:translate3d(0px, 0, 0px); } + to { transform:translate3d(0px, 10px, 0px); } +} + +// scaleUpIn100 +.ms-u-scaleUpIn100 { + @include ms-u-scaleUpIn100; +} +@-webkit-keyframes scaleUp100 { + from { -webkit-transform:scale3d(.98, .98, 1); } + to { -webkit-transform:scale3d(1, 1, 1); } +} +@keyframes scaleUp100 { + from { transform:scale3d(.98, .98, 1); } + to { transform:scale3d(1, 1, 1); } +} + +// scaleDownIn100 +.ms-u-scaleDownIn100 { + @include ms-u-scaleDownIn100; +} +@-webkit-keyframes scaleDown100 { + from { -webkit-transform:scale3d(1.03, 1.03, 1); } + to { -webkit-transform:scale3d(1, 1, 1); } +} +@keyframes scaleDown100 { + from { transform:scale3d(1.03, 1.03, 1); } + to { transform:scale3d(1, 1, 1); } +} + +// scaleUpOut103 +.ms-u-scaleUpOut103 { + @include ms-u-scaleUpOut103; +} +@-webkit-keyframes scaleUp103 { + from { -webkit-transform:scale3d(1, 1, 1); } + to { -webkit-transform:scale3d(1.03, 1.03, 1); } +} +@keyframes scaleUp103 { + from { transform:scale3d(1, 1, 1); } + to { transform:scale3d(1.03, 1.03, 1); } +} + +// scaleDownOut98 +.ms-u-scaleDownOut98 { + @include ms-u-scaleDownOut98; +} +@-webkit-keyframes scaleDown98 { + from { -webkit-transform:scale3d(1, 1, 1); } + to { -webkit-transform:scale3d(0.98, 0.98, 1); } +} +@keyframes scaleDown98 { + from { transform:scale3d(1, 1, 1); } + to { transform:scale3d(0.98, 0.98, 1); } +} + +// fadeIn +.ms-u-fadeIn400 { + @include ms-u-fadeIn400; +} +.ms-u-fadeIn100 { + @include ms-u-fadeIn100; +} +.ms-u-fadeIn200 { + @include ms-u-fadeIn200; +} +.ms-u-fadeIn500 { + @include ms-u-fadeIn500; +} +@-webkit-keyframes fadeIn { + from { opacity: 0; -webkit-animation-timing-function: $ms-ease2; } + to { opacity: 1; } +} +@keyframes fadeIn { + from { opacity: 0; animation-timing-function: $ms-ease2; } + to { opacity: 1; } +} + +// fadeOut +.ms-u-fadeOut400 { + @include ms-u-fadeOut400; +} +.ms-u-fadeOut100 { + @include ms-u-fadeOut100; +} +.ms-u-fadeOut200 { + @include ms-u-fadeOut200; +} +.ms-u-fadeOut500 { + @include ms-u-fadeOut500; +} +@-webkit-keyframes fadeOut { + from { opacity: 1; -webkit-animation-timing-function: $ms-ease2; } + to { opacity: 0; } +} +@keyframes fadeOut { + from { opacity: 1; animation-timing-function: $ms-ease2; } + to { opacity: 0; } +} + +// rotate90deg +.ms-u-rotate90deg { + @include ms-u-rotate90deg; +} +@-webkit-keyframes rotate90 { + from { -webkit-transform:rotateZ(0deg); } + to { -webkit-transform:rotateZ(90deg); } +} +@keyframes rotate90 { + from { transform:rotateZ(0deg); } + to { transform:rotateZ(90deg); } +} + +// rotateN90deg +.ms-u-rotateN90deg { + @include ms-u-rotateN90deg; +} +@-webkit-keyframes rotateN90 { + from { -webkit-transform:rotateZ(90deg); } + to { -webkit-transform:rotateZ(0deg); } +} +@keyframes rotateN90 { + from { transform:rotateZ(90deg); } + to { transform:rotateZ(0deg); } +} + +// expandCollapse400 +.ms-u-expandCollapse400 { + @include ms-u-expandCollapse400; +} + +// expandCollapse200 +.ms-u-expandCollapse200 { + @include ms-u-expandCollapse200; +} + +// expandCollapse100 +.ms-u-expandCollapse100 { + @include ms-u-expandCollapse100; +} + +// delay100 +.ms-u-delay100 { + @include ms-u-delay100; +} + +// delay200 +.ms-u-delay200 { + @include ms-u-delay200; +} diff --git a/dist/sass/Fabric.Animations.RTL.Output.scss b/dist/sass/Fabric.Animations.RTL.Output.scss new file mode 100644 index 000000000..8ad465a5b --- /dev/null +++ b/dist/sass/Fabric.Animations.RTL.Output.scss @@ -0,0 +1,80 @@ +// Copyright (c) Microsoft. All rights reserved. Licensed under the MIT license. See LICENSE in the project root for license information. + +// +// Office UI Fabric +// -------------------------------------------------- +// RTL overrides for Fabric Animations + + +@import "Fabric.Animations.Output"; +@import "Fabric.Animations.RTL"; + +// slideRightIn10 +.ms-u-slideRightIn10 { + @include ms-u-slideRightIn10; +} + +// slideRightIn20 +.ms-u-slideRightIn20 { + @include ms-u-slideRightIn20; +} + +// slideRightIn40 +.ms-u-slideRightIn40 { + @include ms-u-slideRightIn40; +} + +// slideLeftIn10 +.ms-u-slideLeftIn10 { + @include ms-u-slideLeftIn10; +} + +// slideLeftIn20 +.ms-u-slideLeftIn20 { + @include ms-u-slideLeftIn20; +} + +// slideLeftIn40 +.ms-u-slideLeftIn40 { + @include ms-u-slideLeftIn40; +} + +// slideRightIn400 +.ms-u-slideRightIn400 { + @include ms-u-slideRightIn400; +} + +// slideLeftIn400 +.ms-u-slideLeftIn400 { + @include ms-u-slideLeftIn400; +} + +// slideRightOut40 +.ms-u-slideRightOut40 { + @include ms-u-slideRightOut40; +} + +// slideLeftOut40 +.ms-u-slideLeftOut40 { + @include ms-u-slideLeftOut40; +} + +// slideRightOut400 +.ms-u-slideRightOut400 { + @include ms-u-slideRightOut400; +} + +// slideLeftOut400 +.ms-u-slideLeftOut400 { + @include ms-u-slideLeftOut400; +} + +// rotate90deg +.ms-u-rotate90deg { + @include ms-u-rotate90deg; +} + +// rotateN90deg +.ms-u-rotateN90deg { + @include ms-u-rotateN90deg; +} diff --git a/dist/sass/Fabric.Base.Output.scss b/dist/sass/Fabric.Base.Output.scss new file mode 100644 index 000000000..78fd3ffd5 --- /dev/null +++ b/dist/sass/Fabric.Base.Output.scss @@ -0,0 +1,14 @@ +// Copyright (c) Microsoft. All rights reserved. Licensed under the MIT license. See LICENSE in the project root for license information. + +// +// Office UI Fabric +// -------------------------------------------------- +// Wrapper component to set base typography. + +@import "Fabric.Base"; + +//== Wrapper/base component +// +.ms-Fabric { + @include ms-Fabric; +} diff --git a/dist/sass/Fabric.Color.Mixins.Output.scss b/dist/sass/Fabric.Color.Mixins.Output.scss new file mode 100644 index 000000000..a5a6120b7 --- /dev/null +++ b/dist/sass/Fabric.Color.Mixins.Output.scss @@ -0,0 +1,443 @@ +// Copyright (c) Microsoft. All rights reserved. Licensed under the MIT license. See LICENSE in the project root for license information. + +// +// Office UI Fabric +// -------------------------------------------------- +// Fabric Core Color Mixins + +@import "Fabric.Color.Mixins"; + +//== Background colors +// +// Theme colors +.ms-bgColor-themeDark, +.ms-bgColor-themeDark--hover:hover { + @include ms-bgColor-themeDark; +} + +.ms-bgColor-themeDarkAlt, +.ms-bgColor-themeDarkAlt--hover:hover { + @include ms-bgColor-themeDarkAlt; +} + +.ms-bgColor-themeDarker, +.ms-bgColor-themeDarker--hover:hover { + @include ms-bgColor-themeDarker; +} + +.ms-bgColor-themePrimary, +.ms-bgColor-themePrimary--hover:hover { + @include ms-bgColor-themePrimary; +} + +.ms-bgColor-themeSecondary, +.ms-bgColor-themeSecondary--hover:hover { + @include ms-bgColor-themeSecondary; +} + +.ms-bgColor-themeTertiary, +.ms-bgColor-themeTertiary--hover:hover { + @include ms-bgColor-themeTertiary; +} + +.ms-bgColor-themeLight, +.ms-bgColor-themeLight--hover:hover { + @include ms-bgColor-themeLight; +} + +.ms-bgColor-themeLighter, +.ms-bgColor-themeLighter--hover:hover { + @include ms-bgColor-themeLighter; +} + +.ms-bgColor-themeLighterAlt, +.ms-bgColor-themeLighterAlt--hover:hover { + @include ms-bgColor-themeLighterAlt; +} + +// Neutral colors +.ms-bgColor-black, +.ms-bgColor-black--hover:hover { + @include ms-bgColor-black; +} + +.ms-bgColor-neutralDark, +.ms-bgColor-neutralDark--hover:hover { + @include ms-bgColor-neutralDark; +} + +.ms-bgColor-neutralPrimary, +.ms-bgColor-neutralPrimary--hover:hover { + @include ms-bgColor-neutralPrimary; +} + +.ms-bgColor-neutralPrimaryAlt, +.ms-bgColor-neutralPrimaryAlt--hover:hover { + @include ms-bgColor-neutralPrimaryAlt; +} + +.ms-bgColor-neutralSecondary, +.ms-bgColor-neutralSecondary--hover:hover { + @include ms-bgColor-neutralSecondary; +} + +.ms-bgColor-neutralSecondaryAlt, +.ms-bgColor-neutralSecondaryAlt--hover:hover { + @include ms-bgColor-neutralSecondaryAlt; +} + +.ms-bgColor-neutralTertiary, +.ms-bgColor-neutralTertiary--hover:hover { + @include ms-bgColor-neutralTertiary; +} + +.ms-bgColor-neutralTertiaryAlt, +.ms-bgColor-neutralTertiaryAlt--hover:hover { + @include ms-bgColor-neutralTertiaryAlt; +} + +.ms-bgColor-neutralLight, +.ms-bgColor-neutralLight--hover:hover { + @include ms-bgColor-neutralLight; +} + +.ms-bgColor-neutralLighter, +.ms-bgColor-neutralLighter--hover:hover { + @include ms-bgColor-neutralLighter; +} + +.ms-bgColor-neutralLighterAlt, +.ms-bgColor-neutralLighterAlt--hover:hover { + @include ms-bgColor-neutralLighterAlt; +} + +.ms-bgColor-white, +.ms-bgColor-white--hover:hover { + @include ms-bgColor-white; +} + + +// Brand and accent colors +.ms-bgColor-yellow { + @include ms-bgColor-yellow; +} + +.ms-bgColor-yellowLight { + @include ms-bgColor-yellowLight; +} + +.ms-bgColor-orange { + @include ms-bgColor-orange; +} + +.ms-bgColor-orangeLight { + @include ms-bgColor-orangeLight; +} + +.ms-bgColor-orangeLighter { + @include ms-bgColor-orangeLighter; +} + +.ms-bgColor-redDark { + @include ms-bgColor-redDark; +} + +.ms-bgColor-red { + @include ms-bgColor-red; +} + +.ms-bgColor-magentaDark { + @include ms-bgColor-magentaDark; +} + +.ms-bgColor-magenta { + @include ms-bgColor-magenta; +} + +.ms-bgColor-magentaLight { + @include ms-bgColor-magentaLight; +} + +.ms-bgColor-purpleDark { + @include ms-bgColor-purpleDark; +} + +.ms-bgColor-purple { + @include ms-bgColor-purple; +} + +.ms-bgColor-purpleLight { + @include ms-bgColor-purpleLight; +} + +.ms-bgColor-blueDark { + @include ms-bgColor-blueDark; +} + +.ms-bgColor-blueMid { + @include ms-bgColor-blueMid; +} + +.ms-bgColor-blue { + @include ms-bgColor-blue; +} + +.ms-bgColor-blueLight { + @include ms-bgColor-blueLight; +} + +.ms-bgColor-tealDark { + @include ms-bgColor-tealDark; +} + +.ms-bgColor-teal { + @include ms-bgColor-teal; +} + +.ms-bgColor-tealLight { + @include ms-bgColor-tealLight; +} + +.ms-bgColor-greenDark { + @include ms-bgColor-greenDark; +} + +.ms-bgColor-green { + @include ms-bgColor-green; +} + +.ms-bgColor-greenLight { + @include ms-bgColor-greenLight; +} + +// Message colors +.ms-bgColor-info { + @include ms-bgColor-info; +} + +.ms-bgColor-success { + @include ms-bgColor-success; +} + +.ms-bgColor-severeWarning { + @include ms-bgColor-severeWarning; +} + +.ms-bgColor-warning { + @include ms-bgColor-warning; +} + +.ms-bgColor-error { + @include ms-bgColor-error; +} + + +//== Border colors +// + +// Theme colors +.ms-borderColor-themeDark, +.ms-borderColor-themeDark--hover:hover { + @include ms-borderColor-themeDark; +} + +.ms-borderColor-themeDarkAlt, +.ms-borderColor-themeDarkAlt--hover:hover { + @include ms-borderColor-themeDarkAlt; +} + +.ms-borderColor-themeDarker, +.ms-borderColor-themeDarker--hover:hover { + @include ms-borderColor-themeDarker; +} + +.ms-borderColor-themePrimary, +.ms-borderColor-themePrimary--hover:hover { + @include ms-borderColor-themePrimary; +} + +.ms-borderColor-themeSecondary, +.ms-borderColor-themeSecondary--hover:hover { + @include ms-borderColor-themeSecondary; +} + +.ms-borderColor-themeTertiary, +.ms-borderColor-themeTertiary--hover:hover { + @include ms-borderColor-themeTertiary; +} + +.ms-borderColor-themeLight, +.ms-borderColor-themeLight--hover:hover { + @include ms-borderColor-themeLight; +} + +.ms-borderColor-themeLighter, +.ms-borderColor-themeLighter--hover:hover { + @include ms-borderColor-themeLighter; +} + +.ms-borderColor-themeLighterAlt, +.ms-borderColor-themeLighterAlt--hover:hover { + @include ms-borderColor-themeLighterAlt; +} + + +// Neutral colors +.ms-borderColor-black, +.ms-borderColor-black--hover:hover { + @include ms-borderColor-black; +} + +.ms-borderColor-neutralDark, +.ms-borderColor-neutralDark--hover:hover { + @include ms-borderColor-neutralDark; +} + +.ms-borderColor-neutralPrimary, +.ms-borderColor-neutralPrimary--hover:hover { + @include ms-borderColor-neutralPrimary; +} + +.ms-borderColor-neutralPrimaryAlt, +.ms-borderColor-neutralPrimaryAlt--hover:hover { + @include ms-borderColor-neutralPrimaryAlt; +} + +.ms-borderColor-neutralSecondary, +.ms-borderColor-neutralSecondary--hover:hover { + @include ms-borderColor-neutralSecondary; +} + +.ms-borderColor-neutralSecondaryAlt, +.ms-borderColor-neutralSecondaryAlt--hover:hover { + @include ms-borderColor-neutralSecondaryAlt; +} + +.ms-borderColor-neutralTertiary, +.ms-borderColor-neutralTertiary--hover:hover { + @include ms-borderColor-neutralTertiary; +} + +.ms-borderColor-neutralTertiaryAlt, +.ms-borderColor-neutralTertiaryAlt--hover:hover { + @include ms-borderColor-neutralTertiaryAlt; +} + +.ms-borderColor-neutralLight, +.ms-borderColor-neutralLight--hover:hover { + @include ms-borderColor-neutralLight; +} + +.ms-borderColor-neutralLighter, +.ms-borderColor-neutralLighter--hover:hover { + @include ms-borderColor-neutralLighter; +} + +.ms-borderColor-neutralLighterAlt, +.ms-borderColor-neutralLighterAlt--hover:hover { + @include ms-borderColor-neutralLighterAlt; +} + +.ms-borderColor-white, +.ms-borderColor-white--hover:hover { + @include ms-borderColor-white; +} + +// Brand and accent colors +.ms-borderColor-yellow { + @include ms-borderColor-yellow; +} + +.ms-borderColor-yellowLight { + @include ms-borderColor-yellowLight; +} + +.ms-borderColor-orange { + @include ms-borderColor-orange; +} + +.ms-borderColor-orangeLight { + @include ms-borderColor-orangeLight; +} + +.ms-borderColor-orangeLighter { + @include ms-borderColor-orangeLighter; +} + +.ms-borderColor-redDark { + @include ms-borderColor-redDark; +} + +.ms-borderColor-red { + @include ms-borderColor-red; +} + +.ms-borderColor-magentaDark { + @include ms-borderColor-magentaDark; +} + +.ms-borderColor-magenta { + @include ms-borderColor-magenta; +} + +.ms-borderColor-magentaLight { + @include ms-borderColor-magentaLight; +} + +.ms-borderColor-purpleDark { + @include ms-borderColor-purpleDark; +} + +.ms-borderColor-purple { + @include ms-borderColor-purple; +} + +.ms-borderColor-purpleLight { + @include ms-borderColor-purpleLight; +} + +.ms-borderColor-blueDark { + @include ms-borderColor-blueDark; +} + +.ms-borderColor-blueMid { + @include ms-borderColor-blueMid; +} + +.ms-borderColor-blue { + @include ms-borderColor-blue; +} + +.ms-borderColor-blueLight { + @include ms-borderColor-blueLight; +} + +.ms-borderColor-tealDark { + @include ms-borderColor-tealDark; +} + +.ms-borderColor-teal { + @include ms-borderColor-teal; +} + +.ms-borderColor-tealLight { + @include ms-borderColor-tealLight; +} + +.ms-borderColor-greenDark { + @include ms-borderColor-greenDark; +} + +.ms-borderColor-green { + @include ms-borderColor-green; +} + +.ms-borderColor-greenLight { + @include ms-borderColor-greenLight; +} + +// Individual borders, by request +.ms-borderColorTop-themePrimary, +.ms-borderColorTop-themePrimary--hover:hover { + @include ms-borderColorTop-themePrimary; +} diff --git a/dist/sass/Fabric.Grid.Output.scss b/dist/sass/Fabric.Grid.Output.scss new file mode 100644 index 000000000..eabedd697 --- /dev/null +++ b/dist/sass/Fabric.Grid.Output.scss @@ -0,0 +1,32 @@ +// Copyright (c) Microsoft. All rights reserved. Licensed under the MIT license. See LICENSE in the project root for license information. + +// +// Office UI Fabric +// -------------------------------------------------- +// Fluid 12-column grids for small, medium, and large devices + +@import "Fabric.Grid"; + +//== Grid container (same for all sizes) +// +.ms-Grid { + @include ms-Grid; +} + +//== Grid rows (pull first and last column out) +// +.ms-Grid-row { + @include ms-Grid-row; +} + +//== Grid cells +// +.ms-Grid-col { + @include ms-Grid-col; +} + +// For nested grids (a grid inside a column), removing the padding +// so that the nested grid's columns go to the edge of the parent's. +.ms-Grid-col .ms-Grid { + padding: 0; +} diff --git a/dist/sass/Fabric.Icons.Font.Output.scss b/dist/sass/Fabric.Icons.Font.Output.scss new file mode 100644 index 000000000..6dfb1bb4e --- /dev/null +++ b/dist/sass/Fabric.Icons.Font.Output.scss @@ -0,0 +1,21 @@ +// Copyright (c) Microsoft. All rights reserved. Licensed under the MIT license. See LICENSE in the project root for license information. + +// +// Office UI Fabric +// -------------------------------------------------- +// Icon font-family definition + +/* + Your use of the content in the files referenced here are subject to the terms of the license at http://aka.ms/fabric-font-license +*/ + +@import "Fabric.Typography.Fonts"; + +@font-face { + font-family: 'FabricMDL2Icons'; + src: url('#{$ms-font-directory}/icons/FabricMDL2Icons.woff') format('woff'), + url('#{$ms-font-directory}/icons/FabricMDL2Icons.ttf') format('truetype'); + font-weight: normal; + font-style: normal; +} + diff --git a/dist/sass/Fabric.Icons.Output.scss b/dist/sass/Fabric.Icons.Output.scss new file mode 100644 index 000000000..78e4efcd8 --- /dev/null +++ b/dist/sass/Fabric.Icons.Output.scss @@ -0,0 +1,708 @@ +// Copyright (c) Microsoft. All rights reserved. Licensed under the MIT license. See LICENSE in the project root for license information. + +// +// Office UI Fabric +// -------------------------------------------------- +// Icon definitions + + +@import './Fabric.Icons'; + +// Base icon definition +.ms-Icon { + @include ms-Icon(); +} + +// Modifiers: Each of the icons. +.ms-Icon--DecreaseIndentLegacy::before { @include ms-Icon--DecreaseIndentLegacy } +.ms-Icon--IncreaseIndentLegacy::before { @include ms-Icon--IncreaseIndentLegacy } +.ms-Icon--GlobalNavButton::before { @include ms-Icon--GlobalNavButton } +.ms-Icon--InternetSharing::before { @include ms-Icon--InternetSharing } +.ms-Icon--Brightness::before { @include ms-Icon--Brightness } +.ms-Icon--MapPin::before { @include ms-Icon--MapPin } +.ms-Icon--Airplane::before { @include ms-Icon--Airplane } +.ms-Icon--Tablet::before { @include ms-Icon--Tablet } +.ms-Icon--QuickNote::before { @include ms-Icon--QuickNote } +.ms-Icon--ChevronDown::before { @include ms-Icon--ChevronDown } +.ms-Icon--ChevronUp::before { @include ms-Icon--ChevronUp } +.ms-Icon--Edit::before { @include ms-Icon--Edit } +.ms-Icon--Add::before { @include ms-Icon--Add } +.ms-Icon--Cancel::before { @include ms-Icon--Cancel } +.ms-Icon--More::before { @include ms-Icon--More } +.ms-Icon--Settings::before { @include ms-Icon--Settings } +.ms-Icon--Video::before { @include ms-Icon--Video } +.ms-Icon--Mail::before { @include ms-Icon--Mail } +.ms-Icon--People::before { @include ms-Icon--People } +.ms-Icon--Phone::before { @include ms-Icon--Phone } +.ms-Icon--Pin::before { @include ms-Icon--Pin } +.ms-Icon--Shop::before { @include ms-Icon--Shop } +.ms-Icon--Link::before { @include ms-Icon--Link } +.ms-Icon--Filter::before { @include ms-Icon--Filter } +.ms-Icon--Zoom::before { @include ms-Icon--Zoom } +.ms-Icon--ZoomOut::before { @include ms-Icon--ZoomOut } +.ms-Icon--Microphone::before { @include ms-Icon--Microphone } +.ms-Icon--Search::before { @include ms-Icon--Search } +.ms-Icon--Camera::before { @include ms-Icon--Camera } +.ms-Icon--Attach::before { @include ms-Icon--Attach } +.ms-Icon--Send::before { @include ms-Icon--Send } +.ms-Icon--FavoriteList::before { @include ms-Icon--FavoriteList } +.ms-Icon--PageSolid::before { @include ms-Icon--PageSolid } +.ms-Icon--Forward::before { @include ms-Icon--Forward } +.ms-Icon--Back::before { @include ms-Icon--Back } +.ms-Icon--Refresh::before { @include ms-Icon--Refresh } +.ms-Icon--Share::before { @include ms-Icon--Share } +.ms-Icon--Lock::before { @include ms-Icon--Lock } +.ms-Icon--EMI::before { @include ms-Icon--EMI } +.ms-Icon--MiniLink::before { @include ms-Icon--MiniLink } +.ms-Icon--Blocked::before { @include ms-Icon--Blocked } +.ms-Icon--FavoriteStar::before { @include ms-Icon--FavoriteStar } +.ms-Icon--FavoriteStarFill::before { @include ms-Icon--FavoriteStarFill } +.ms-Icon--ReadingMode::before { @include ms-Icon--ReadingMode } +.ms-Icon--Remove::before { @include ms-Icon--Remove } +.ms-Icon--Checkbox::before { @include ms-Icon--Checkbox } +.ms-Icon--CheckboxComposite::before { @include ms-Icon--CheckboxComposite } +.ms-Icon--CheckboxIndeterminate::before { @include ms-Icon--CheckboxIndeterminate } +.ms-Icon--CheckMark::before { @include ms-Icon--CheckMark } +.ms-Icon--BackToWindow::before { @include ms-Icon--BackToWindow } +.ms-Icon--FullScreen::before { @include ms-Icon--FullScreen } +.ms-Icon--Print::before { @include ms-Icon--Print } +.ms-Icon--Up::before { @include ms-Icon--Up } +.ms-Icon--Down::before { @include ms-Icon--Down } +.ms-Icon--Delete::before { @include ms-Icon--Delete } +.ms-Icon--Save::before { @include ms-Icon--Save } +.ms-Icon--Sad::before { @include ms-Icon--Sad } +.ms-Icon--SIPMove::before { @include ms-Icon--SIPMove } +.ms-Icon--EraseTool::before { @include ms-Icon--EraseTool } +.ms-Icon--GripperTool::before { @include ms-Icon--GripperTool } +.ms-Icon--Dialpad::before { @include ms-Icon--Dialpad } +.ms-Icon--PageLeft::before { @include ms-Icon--PageLeft } +.ms-Icon--PageRight::before { @include ms-Icon--PageRight } +.ms-Icon--MultiSelect::before { @include ms-Icon--MultiSelect } +.ms-Icon--Play::before { @include ms-Icon--Play } +.ms-Icon--Pause::before { @include ms-Icon--Pause } +.ms-Icon--ChevronLeft::before { @include ms-Icon--ChevronLeft } +.ms-Icon--ChevronRight::before { @include ms-Icon--ChevronRight } +.ms-Icon--Emoji2::before { @include ms-Icon--Emoji2 } +.ms-Icon--System::before { @include ms-Icon--System } +.ms-Icon--Globe::before { @include ms-Icon--Globe } +.ms-Icon--ContactInfo::before { @include ms-Icon--ContactInfo } +.ms-Icon--Unpin::before { @include ms-Icon--Unpin } +.ms-Icon--Contact::before { @include ms-Icon--Contact } +.ms-Icon--Memo::before { @include ms-Icon--Memo } +.ms-Icon--WindowsLogo::before { @include ms-Icon--WindowsLogo } +.ms-Icon--Error::before { @include ms-Icon--Error } +.ms-Icon--Unlock::before { @include ms-Icon--Unlock } +.ms-Icon--Calendar::before { @include ms-Icon--Calendar } +.ms-Icon--Megaphone::before { @include ms-Icon--Megaphone } +.ms-Icon--AutoEnhanceOn::before { @include ms-Icon--AutoEnhanceOn } +.ms-Icon--AutoEnhanceOff::before { @include ms-Icon--AutoEnhanceOff } +.ms-Icon--Color::before { @include ms-Icon--Color } +.ms-Icon--SaveAs::before { @include ms-Icon--SaveAs } +.ms-Icon--Light::before { @include ms-Icon--Light } +.ms-Icon--Filters::before { @include ms-Icon--Filters } +.ms-Icon--Contrast::before { @include ms-Icon--Contrast } +.ms-Icon--Redo::before { @include ms-Icon--Redo } +.ms-Icon--Undo::before { @include ms-Icon--Undo } +.ms-Icon--Album::before { @include ms-Icon--Album } +.ms-Icon--Rotate::before { @include ms-Icon--Rotate } +.ms-Icon--PanoIndicator::before { @include ms-Icon--PanoIndicator } +.ms-Icon--ThumbnailView::before { @include ms-Icon--ThumbnailView } +.ms-Icon--Package::before { @include ms-Icon--Package } +.ms-Icon--Warning::before { @include ms-Icon--Warning } +.ms-Icon--Financial::before { @include ms-Icon--Financial } +.ms-Icon--ShoppingCart::before { @include ms-Icon--ShoppingCart } +.ms-Icon--Train::before { @include ms-Icon--Train } +.ms-Icon--Flag::before { @include ms-Icon--Flag } +.ms-Icon--Move::before { @include ms-Icon--Move } +.ms-Icon--Page::before { @include ms-Icon--Page } +.ms-Icon--TouchPointer::before { @include ms-Icon--TouchPointer } +.ms-Icon--Merge::before { @include ms-Icon--Merge } +.ms-Icon--TurnRight::before { @include ms-Icon--TurnRight } +.ms-Icon--Ferry::before { @include ms-Icon--Ferry } +.ms-Icon--Tab::before { @include ms-Icon--Tab } +.ms-Icon--Admin::before { @include ms-Icon--Admin } +.ms-Icon--TVMonitor::before { @include ms-Icon--TVMonitor } +.ms-Icon--Speakers::before { @include ms-Icon--Speakers } +.ms-Icon--Car::before { @include ms-Icon--Car } +.ms-Icon--EatDrink::before { @include ms-Icon--EatDrink } +.ms-Icon--LocationCircle::before { @include ms-Icon--LocationCircle } +.ms-Icon--Home::before { @include ms-Icon--Home } +.ms-Icon--SwitcherStartEnd::before { @include ms-Icon--SwitcherStartEnd } +.ms-Icon--IncidentTriangle::before { @include ms-Icon--IncidentTriangle } +.ms-Icon--Touch::before { @include ms-Icon--Touch } +.ms-Icon--MapDirections::before { @include ms-Icon--MapDirections } +.ms-Icon--History::before { @include ms-Icon--History } +.ms-Icon--Location::before { @include ms-Icon--Location } +.ms-Icon--Work::before { @include ms-Icon--Work } +.ms-Icon--Recent::before { @include ms-Icon--Recent } +.ms-Icon--Hotel::before { @include ms-Icon--Hotel } +.ms-Icon--LocationDot::before { @include ms-Icon--LocationDot } +.ms-Icon--News::before { @include ms-Icon--News } +.ms-Icon--Chat::before { @include ms-Icon--Chat } +.ms-Icon--Group::before { @include ms-Icon--Group } +.ms-Icon--View::before { @include ms-Icon--View } +.ms-Icon--Clear::before { @include ms-Icon--Clear } +.ms-Icon--Sync::before { @include ms-Icon--Sync } +.ms-Icon--Download::before { @include ms-Icon--Download } +.ms-Icon--Help::before { @include ms-Icon--Help } +.ms-Icon--Upload::before { @include ms-Icon--Upload } +.ms-Icon--Emoji::before { @include ms-Icon--Emoji } +.ms-Icon--MailForward::before { @include ms-Icon--MailForward } +.ms-Icon--ClosePane::before { @include ms-Icon--ClosePane } +.ms-Icon--OpenPane::before { @include ms-Icon--OpenPane } +.ms-Icon--PreviewLink::before { @include ms-Icon--PreviewLink } +.ms-Icon--ZoomIn::before { @include ms-Icon--ZoomIn } +.ms-Icon--Bookmarks::before { @include ms-Icon--Bookmarks } +.ms-Icon--Document::before { @include ms-Icon--Document } +.ms-Icon--ProtectedDocument::before { @include ms-Icon--ProtectedDocument } +.ms-Icon--OpenInNewWindow::before { @include ms-Icon--OpenInNewWindow } +.ms-Icon--MailFill::before { @include ms-Icon--MailFill } +.ms-Icon--ViewAll::before { @include ms-Icon--ViewAll } +.ms-Icon--Switch::before { @include ms-Icon--Switch } +.ms-Icon--Rename::before { @include ms-Icon--Rename } +.ms-Icon--Folder::before { @include ms-Icon--Folder } +.ms-Icon--Picture::before { @include ms-Icon--Picture } +.ms-Icon--ShowResults::before { @include ms-Icon--ShowResults } +.ms-Icon--Message::before { @include ms-Icon--Message } +.ms-Icon--CalendarDay::before { @include ms-Icon--CalendarDay } +.ms-Icon--CalendarWeek::before { @include ms-Icon--CalendarWeek } +.ms-Icon--MailReplyAll::before { @include ms-Icon--MailReplyAll } +.ms-Icon--Read::before { @include ms-Icon--Read } +.ms-Icon--PaymentCard::before { @include ms-Icon--PaymentCard } +.ms-Icon--Copy::before { @include ms-Icon--Copy } +.ms-Icon--Important::before { @include ms-Icon--Important } +.ms-Icon--MailReply::before { @include ms-Icon--MailReply } +.ms-Icon--Sort::before { @include ms-Icon--Sort } +.ms-Icon--GotoToday::before { @include ms-Icon--GotoToday } +.ms-Icon--Font::before { @include ms-Icon--Font } +.ms-Icon--FontColor::before { @include ms-Icon--FontColor } +.ms-Icon--FolderFill::before { @include ms-Icon--FolderFill } +.ms-Icon--Permissions::before { @include ms-Icon--Permissions } +.ms-Icon--DisableUpdates::before { @include ms-Icon--DisableUpdates } +.ms-Icon--Unfavorite::before { @include ms-Icon--Unfavorite } +.ms-Icon--Italic::before { @include ms-Icon--Italic } +.ms-Icon--Underline::before { @include ms-Icon--Underline } +.ms-Icon--Bold::before { @include ms-Icon--Bold } +.ms-Icon--MoveToFolder::before { @include ms-Icon--MoveToFolder } +.ms-Icon--Dislike::before { @include ms-Icon--Dislike } +.ms-Icon--Like::before { @include ms-Icon--Like } +.ms-Icon--AlignRight::before { @include ms-Icon--AlignRight } +.ms-Icon--AlignCenter::before { @include ms-Icon--AlignCenter } +.ms-Icon--AlignLeft::before { @include ms-Icon--AlignLeft } +.ms-Icon--OpenFile::before { @include ms-Icon--OpenFile } +.ms-Icon--FontDecrease::before { @include ms-Icon--FontDecrease } +.ms-Icon--FontIncrease::before { @include ms-Icon--FontIncrease } +.ms-Icon--FontSize::before { @include ms-Icon--FontSize } +.ms-Icon--CellPhone::before { @include ms-Icon--CellPhone } +.ms-Icon--Tag::before { @include ms-Icon--Tag } +.ms-Icon--Library::before { @include ms-Icon--Library } +.ms-Icon--PostUpdate::before { @include ms-Icon--PostUpdate } +.ms-Icon--NewFolder::before { @include ms-Icon--NewFolder } +.ms-Icon--CalendarReply::before { @include ms-Icon--CalendarReply } +.ms-Icon--UnsyncFolder::before { @include ms-Icon--UnsyncFolder } +.ms-Icon--SyncFolder::before { @include ms-Icon--SyncFolder } +.ms-Icon--BlockContact::before { @include ms-Icon--BlockContact } +.ms-Icon--AddFriend::before { @include ms-Icon--AddFriend } +.ms-Icon--BulletedList::before { @include ms-Icon--BulletedList } +.ms-Icon--Preview::before { @include ms-Icon--Preview } +.ms-Icon--DockLeft::before { @include ms-Icon--DockLeft } +.ms-Icon--DockRight::before { @include ms-Icon--DockRight } +.ms-Icon--Repair::before { @include ms-Icon--Repair } +.ms-Icon--Accounts::before { @include ms-Icon--Accounts } +.ms-Icon--RadioBullet::before { @include ms-Icon--RadioBullet } +.ms-Icon--Stopwatch::before { @include ms-Icon--Stopwatch } +.ms-Icon--Clock::before { @include ms-Icon--Clock } +.ms-Icon--AlarmClock::before { @include ms-Icon--AlarmClock } +.ms-Icon--Hospital::before { @include ms-Icon--Hospital } +.ms-Icon--Timer::before { @include ms-Icon--Timer } +.ms-Icon--FullCircleMask::before { @include ms-Icon--FullCircleMask } +.ms-Icon--LocationFill::before { @include ms-Icon--LocationFill } +.ms-Icon--ChromeMinimize::before { @include ms-Icon--ChromeMinimize } +.ms-Icon--Annotation::before { @include ms-Icon--Annotation } +.ms-Icon--ChromeClose::before { @include ms-Icon--ChromeClose } +.ms-Icon--Accept::before { @include ms-Icon--Accept } +.ms-Icon--Fingerprint::before { @include ms-Icon--Fingerprint } +.ms-Icon--Handwriting::before { @include ms-Icon--Handwriting } +.ms-Icon--StackIndicator::before { @include ms-Icon--StackIndicator } +.ms-Icon--Completed::before { @include ms-Icon--Completed } +.ms-Icon--Label::before { @include ms-Icon--Label } +.ms-Icon--FlickDown::before { @include ms-Icon--FlickDown } +.ms-Icon--FlickUp::before { @include ms-Icon--FlickUp } +.ms-Icon--FlickLeft::before { @include ms-Icon--FlickLeft } +.ms-Icon--FlickRight::before { @include ms-Icon--FlickRight } +.ms-Icon--MusicInCollection::before { @include ms-Icon--MusicInCollection } +.ms-Icon--OneDrive::before { @include ms-Icon--OneDrive } +.ms-Icon--CompassNW::before { @include ms-Icon--CompassNW } +.ms-Icon--Code::before { @include ms-Icon--Code } +.ms-Icon--LightningBolt::before { @include ms-Icon--LightningBolt } +.ms-Icon--Info::before { @include ms-Icon--Info } +.ms-Icon--CalculatorAddition::before { @include ms-Icon--CalculatorAddition } +.ms-Icon--CalculatorSubtract::before { @include ms-Icon--CalculatorSubtract } +.ms-Icon--PrintfaxPrinterFile::before { @include ms-Icon--PrintfaxPrinterFile } +.ms-Icon--Health::before { @include ms-Icon--Health } +.ms-Icon--ChevronUpSmall::before { @include ms-Icon--ChevronUpSmall } +.ms-Icon--ChevronDownSmall::before { @include ms-Icon--ChevronDownSmall } +.ms-Icon--ChevronLeftSmall::before { @include ms-Icon--ChevronLeftSmall } +.ms-Icon--ChevronRightSmall::before { @include ms-Icon--ChevronRightSmall } +.ms-Icon--ChevronUpMed::before { @include ms-Icon--ChevronUpMed } +.ms-Icon--ChevronDownMed::before { @include ms-Icon--ChevronDownMed } +.ms-Icon--ChevronLeftMed::before { @include ms-Icon--ChevronLeftMed } +.ms-Icon--ChevronRightMed::before { @include ms-Icon--ChevronRightMed } +.ms-Icon--Dictionary::before { @include ms-Icon--Dictionary } +.ms-Icon--ChromeBack::before { @include ms-Icon--ChromeBack } +.ms-Icon--PC1::before { @include ms-Icon--PC1 } +.ms-Icon--PresenceChickletVideo::before { @include ms-Icon--PresenceChickletVideo } +.ms-Icon--Reply::before { @include ms-Icon--Reply } +.ms-Icon--DoubleChevronLeftMed::before { @include ms-Icon--DoubleChevronLeftMed } +.ms-Icon--Volume0::before { @include ms-Icon--Volume0 } +.ms-Icon--Volume1::before { @include ms-Icon--Volume1 } +.ms-Icon--Volume2::before { @include ms-Icon--Volume2 } +.ms-Icon--Volume3::before { @include ms-Icon--Volume3 } +.ms-Icon--CaretHollow::before { @include ms-Icon--CaretHollow } +.ms-Icon--CaretSolid::before { @include ms-Icon--CaretSolid } +.ms-Icon--Pinned::before { @include ms-Icon--Pinned } +.ms-Icon--PinnedFill::before { @include ms-Icon--PinnedFill } +.ms-Icon--Chart::before { @include ms-Icon--Chart } +.ms-Icon--BidiLtr::before { @include ms-Icon--BidiLtr } +.ms-Icon--BidiRtl::before { @include ms-Icon--BidiRtl } +.ms-Icon--RevToggleKey::before { @include ms-Icon--RevToggleKey } +.ms-Icon--RightDoubleQuote::before { @include ms-Icon--RightDoubleQuote } +.ms-Icon--Sunny::before { @include ms-Icon--Sunny } +.ms-Icon--CloudWeather::before { @include ms-Icon--CloudWeather } +.ms-Icon--Cloudy::before { @include ms-Icon--Cloudy } +.ms-Icon--PartlyCloudyDay::before { @include ms-Icon--PartlyCloudyDay } +.ms-Icon--PartlyCloudyNight::before { @include ms-Icon--PartlyCloudyNight } +.ms-Icon--ClearNight::before { @include ms-Icon--ClearNight } +.ms-Icon--RainShowersDay::before { @include ms-Icon--RainShowersDay } +.ms-Icon--Rain::before { @include ms-Icon--Rain } +.ms-Icon--Thunderstorms::before { @include ms-Icon--Thunderstorms } +.ms-Icon--RainSnow::before { @include ms-Icon--RainSnow } +.ms-Icon--Snow::before { @include ms-Icon--Snow } +.ms-Icon--BlowingSnow::before { @include ms-Icon--BlowingSnow } +.ms-Icon--Frigid::before { @include ms-Icon--Frigid } +.ms-Icon--Fog::before { @include ms-Icon--Fog } +.ms-Icon--Squalls::before { @include ms-Icon--Squalls } +.ms-Icon--Duststorm::before { @include ms-Icon--Duststorm } +.ms-Icon--Precipitation::before { @include ms-Icon--Precipitation } +.ms-Icon--Ringer::before { @include ms-Icon--Ringer } +.ms-Icon--PDF::before { @include ms-Icon--PDF } +.ms-Icon--SortLines::before { @include ms-Icon--SortLines } +.ms-Icon--Ribbon::before { @include ms-Icon--Ribbon } +.ms-Icon--CheckList::before { @include ms-Icon--CheckList } +.ms-Icon--Generate::before { @include ms-Icon--Generate } +.ms-Icon--Equalizer::before { @include ms-Icon--Equalizer } +.ms-Icon--BarChartHorizontal::before { @include ms-Icon--BarChartHorizontal } +.ms-Icon--Freezing::before { @include ms-Icon--Freezing } +.ms-Icon--SnowShowerDay::before { @include ms-Icon--SnowShowerDay } +.ms-Icon--HailDay::before { @include ms-Icon--HailDay } +.ms-Icon--WorkFlow::before { @include ms-Icon--WorkFlow } +.ms-Icon--StoreLogoMed::before { @include ms-Icon--StoreLogoMed } +.ms-Icon--RainShowersNight::before { @include ms-Icon--RainShowersNight } +.ms-Icon--SnowShowerNight::before { @include ms-Icon--SnowShowerNight } +.ms-Icon--HailNight::before { @include ms-Icon--HailNight } +.ms-Icon--Info2::before { @include ms-Icon--Info2 } +.ms-Icon--StoreLogo::before { @include ms-Icon--StoreLogo } +.ms-Icon--MultiSelectMirrored::before { @include ms-Icon--MultiSelectMirrored } +.ms-Icon--Broom::before { @include ms-Icon--Broom } +.ms-Icon--MusicInCollectionFill::before { @include ms-Icon--MusicInCollectionFill } +.ms-Icon--List::before { @include ms-Icon--List } +.ms-Icon--Asterisk::before { @include ms-Icon--Asterisk } +.ms-Icon--ErrorBadge::before { @include ms-Icon--ErrorBadge } +.ms-Icon--CircleRing::before { @include ms-Icon--CircleRing } +.ms-Icon--CircleFill::before { @include ms-Icon--CircleFill } +.ms-Icon--BookmarksMirrored::before { @include ms-Icon--BookmarksMirrored } +.ms-Icon--BulletedListMirrored::before { @include ms-Icon--BulletedListMirrored } +.ms-Icon--CaretHollowMirrored::before { @include ms-Icon--CaretHollowMirrored } +.ms-Icon--CaretSolidMirrored::before { @include ms-Icon--CaretSolidMirrored } +.ms-Icon--ChromeBackMirrored::before { @include ms-Icon--ChromeBackMirrored } +.ms-Icon--ClosePaneMirrored::before { @include ms-Icon--ClosePaneMirrored } +.ms-Icon--DockLeftMirrored::before { @include ms-Icon--DockLeftMirrored } +.ms-Icon--DoubleChevronLeftMedMirrored::before { @include ms-Icon--DoubleChevronLeftMedMirrored } +.ms-Icon--HelpMirrored::before { @include ms-Icon--HelpMirrored } +.ms-Icon--ListMirrored::before { @include ms-Icon--ListMirrored } +.ms-Icon--MailForwardMirrored::before { @include ms-Icon--MailForwardMirrored } +.ms-Icon--MailReplyMirrored::before { @include ms-Icon--MailReplyMirrored } +.ms-Icon--MailReplyAllMirrored::before { @include ms-Icon--MailReplyAllMirrored } +.ms-Icon--OpenPaneMirrored::before { @include ms-Icon--OpenPaneMirrored } +.ms-Icon--SendMirrored::before { @include ms-Icon--SendMirrored } +.ms-Icon--ShowResultsMirrored::before { @include ms-Icon--ShowResultsMirrored } +.ms-Icon--ThumbnailViewMirrored::before { @include ms-Icon--ThumbnailViewMirrored } +.ms-Icon--Lightbulb::before { @include ms-Icon--Lightbulb } +.ms-Icon--StatusTriangle::before { @include ms-Icon--StatusTriangle } +.ms-Icon--VolumeDisabled::before { @include ms-Icon--VolumeDisabled } +.ms-Icon--Puzzle::before { @include ms-Icon--Puzzle } +.ms-Icon--EmojiNeutral::before { @include ms-Icon--EmojiNeutral } +.ms-Icon--EmojiDisappointed::before { @include ms-Icon--EmojiDisappointed } +.ms-Icon--HomeSolid::before { @include ms-Icon--HomeSolid } +.ms-Icon--Cocktails::before { @include ms-Icon--Cocktails } +.ms-Icon--Articles::before { @include ms-Icon--Articles } +.ms-Icon--Cycling::before { @include ms-Icon--Cycling } +.ms-Icon--DietPlanNotebook::before { @include ms-Icon--DietPlanNotebook } +.ms-Icon--Pill::before { @include ms-Icon--Pill } +.ms-Icon--Running::before { @include ms-Icon--Running } +.ms-Icon--Weights::before { @include ms-Icon--Weights } +.ms-Icon--BarChart4::before { @include ms-Icon--BarChart4 } +.ms-Icon--CirclePlus::before { @include ms-Icon--CirclePlus } +.ms-Icon--Coffee::before { @include ms-Icon--Coffee } +.ms-Icon--Cotton::before { @include ms-Icon--Cotton } +.ms-Icon--Market::before { @include ms-Icon--Market } +.ms-Icon--Money::before { @include ms-Icon--Money } +.ms-Icon--PieDouble::before { @include ms-Icon--PieDouble } +.ms-Icon--RemoveFilter::before { @include ms-Icon--RemoveFilter } +.ms-Icon--StockDown::before { @include ms-Icon--StockDown } +.ms-Icon--StockUp::before { @include ms-Icon--StockUp } +.ms-Icon--Cricket::before { @include ms-Icon--Cricket } +.ms-Icon--Golf::before { @include ms-Icon--Golf } +.ms-Icon--Baseball::before { @include ms-Icon--Baseball } +.ms-Icon--Soccer::before { @include ms-Icon--Soccer } +.ms-Icon--MoreSports::before { @include ms-Icon--MoreSports } +.ms-Icon--AutoRacing::before { @include ms-Icon--AutoRacing } +.ms-Icon--CollegeHoops::before { @include ms-Icon--CollegeHoops } +.ms-Icon--CollegeFootball::before { @include ms-Icon--CollegeFootball } +.ms-Icon--ProFootball::before { @include ms-Icon--ProFootball } +.ms-Icon--ProHockey::before { @include ms-Icon--ProHockey } +.ms-Icon--Rugby::before { @include ms-Icon--Rugby } +.ms-Icon--Tennis::before { @include ms-Icon--Tennis } +.ms-Icon--Arrivals::before { @include ms-Icon--Arrivals } +.ms-Icon--Design::before { @include ms-Icon--Design } +.ms-Icon--Website::before { @include ms-Icon--Website } +.ms-Icon--Drop::before { @include ms-Icon--Drop } +.ms-Icon--Snow::before { @include ms-Icon--Snow } +.ms-Icon--BusSolid::before { @include ms-Icon--BusSolid } +.ms-Icon--FerrySolid::before { @include ms-Icon--FerrySolid } +.ms-Icon--TrainSolid::before { @include ms-Icon--TrainSolid } +.ms-Icon--Heart::before { @include ms-Icon--Heart } +.ms-Icon--HeartFill::before { @include ms-Icon--HeartFill } +.ms-Icon--Ticket::before { @include ms-Icon--Ticket } +.ms-Icon--AzureLogo::before { @include ms-Icon--AzureLogo } +.ms-Icon--BingLogo::before { @include ms-Icon--BingLogo } +.ms-Icon--MSNLogo::before { @include ms-Icon--MSNLogo } +.ms-Icon--OutlookLogo::before { @include ms-Icon--OutlookLogo } +.ms-Icon--OfficeLogo::before { @include ms-Icon--OfficeLogo } +.ms-Icon--SkypeLogo::before { @include ms-Icon--SkypeLogo } +.ms-Icon--Door::before { @include ms-Icon--Door } +.ms-Icon--EditMirrored::before { @include ms-Icon--EditMirrored } +.ms-Icon--GiftCard::before { @include ms-Icon--GiftCard } +.ms-Icon--DoubleBookmark::before { @include ms-Icon--DoubleBookmark } +.ms-Icon--StatusErrorFull::before { @include ms-Icon--StatusErrorFull } +.ms-Icon--Certificate::before { @include ms-Icon--Certificate } +.ms-Icon--Photo2::before { @include ms-Icon--Photo2 } +.ms-Icon--CloudDownload::before { @include ms-Icon--CloudDownload } +.ms-Icon--WindDirection::before { @include ms-Icon--WindDirection } +.ms-Icon--Family::before { @include ms-Icon--Family } +.ms-Icon--CSS::before { @include ms-Icon--CSS } +.ms-Icon--JS::before { @include ms-Icon--JS } +.ms-Icon--ReminderGroup::before { @include ms-Icon--ReminderGroup } +.ms-Icon--Section::before { @include ms-Icon--Section } +.ms-Icon--OneNoteLogo::before { @include ms-Icon--OneNoteLogo } +.ms-Icon--ToggleFilled::before { @include ms-Icon--ToggleFilled } +.ms-Icon--ToggleBorder::before { @include ms-Icon--ToggleBorder } +.ms-Icon--SliderThumb::before { @include ms-Icon--SliderThumb } +.ms-Icon--ToggleThumb::before { @include ms-Icon--ToggleThumb } +.ms-Icon--Documentation::before { @include ms-Icon--Documentation } +.ms-Icon--Badge::before { @include ms-Icon--Badge } +.ms-Icon--Giftbox::before { @include ms-Icon--Giftbox } +.ms-Icon--ExcelLogo::before { @include ms-Icon--ExcelLogo } +.ms-Icon--WordLogo::before { @include ms-Icon--WordLogo } +.ms-Icon--PowerPointLogo::before { @include ms-Icon--PowerPointLogo } +.ms-Icon--Cafe::before { @include ms-Icon--Cafe } +.ms-Icon--SpeedHigh::before { @include ms-Icon--SpeedHigh } +.ms-Icon--MusicNote::before { @include ms-Icon--MusicNote } +.ms-Icon--EdgeLogo::before { @include ms-Icon--EdgeLogo } +.ms-Icon--CompletedSolid::before { @include ms-Icon--CompletedSolid } +.ms-Icon--AlbumRemove::before { @include ms-Icon--AlbumRemove } +.ms-Icon--MessageFill::before { @include ms-Icon--MessageFill } +.ms-Icon--TabletSelected::before { @include ms-Icon--TabletSelected } +.ms-Icon--MobileSelected::before { @include ms-Icon--MobileSelected } +.ms-Icon--LaptopSelected::before { @include ms-Icon--LaptopSelected } +.ms-Icon--TVMonitorSelected::before { @include ms-Icon--TVMonitorSelected } +.ms-Icon--DeveloperTools::before { @include ms-Icon--DeveloperTools } +.ms-Icon--InsertTextBox::before { @include ms-Icon--InsertTextBox } +.ms-Icon--LowerBrightness::before { @include ms-Icon--LowerBrightness } +.ms-Icon--CloudUpload::before { @include ms-Icon--CloudUpload } +.ms-Icon--DateTime::before { @include ms-Icon--DateTime } +.ms-Icon--Event::before { @include ms-Icon--Event } +.ms-Icon--Cake::before { @include ms-Icon--Cake } +.ms-Icon--Tiles::before { @include ms-Icon--Tiles } +.ms-Icon--Org::before { @include ms-Icon--Org } +.ms-Icon--PartyLeader::before { @include ms-Icon--PartyLeader } +.ms-Icon--DRM::before { @include ms-Icon--DRM } +.ms-Icon--CloudAdd::before { @include ms-Icon--CloudAdd } +.ms-Icon--AppIconDefault::before { @include ms-Icon--AppIconDefault } +.ms-Icon--Photo2Add::before { @include ms-Icon--Photo2Add } +.ms-Icon--Photo2Remove::before { @include ms-Icon--Photo2Remove } +.ms-Icon--POI::before { @include ms-Icon--POI } +.ms-Icon--FacebookLogo::before { @include ms-Icon--FacebookLogo } +.ms-Icon--AddTo::before { @include ms-Icon--AddTo } +.ms-Icon--RadioBtnOn::before { @include ms-Icon--RadioBtnOn } +.ms-Icon--Embed::before { @include ms-Icon--Embed } +.ms-Icon--VideoSolid::before { @include ms-Icon--VideoSolid } +.ms-Icon--Teamwork::before { @include ms-Icon--Teamwork } +.ms-Icon--PeopleAdd::before { @include ms-Icon--PeopleAdd } +.ms-Icon--Glasses::before { @include ms-Icon--Glasses } +.ms-Icon--DateTime2::before { @include ms-Icon--DateTime2 } +.ms-Icon--Shield::before { @include ms-Icon--Shield } +.ms-Icon--Header1::before { @include ms-Icon--Header1 } +.ms-Icon--PageAdd::before { @include ms-Icon--PageAdd } +.ms-Icon--NumberedList::before { @include ms-Icon--NumberedList } +.ms-Icon--PowerBILogo::before { @include ms-Icon--PowerBILogo } +.ms-Icon--Product::before { @include ms-Icon--Product } +.ms-Icon--Blocked2::before { @include ms-Icon--Blocked2 } +.ms-Icon--FangBody::before { @include ms-Icon--FangBody } +.ms-Icon--Glimmer::before { @include ms-Icon--Glimmer } +.ms-Icon--ChatInviteFriend::before { @include ms-Icon--ChatInviteFriend } +.ms-Icon--SharepointLogo::before { @include ms-Icon--SharepointLogo } +.ms-Icon--YammerLogo::before { @include ms-Icon--YammerLogo } +.ms-Icon--ReturnToSession::before { @include ms-Icon--ReturnToSession } +.ms-Icon--OpenFolderHorizontal::before { @include ms-Icon--OpenFolderHorizontal } +.ms-Icon--CalendarMirrored::before { @include ms-Icon--CalendarMirrored } +.ms-Icon--SwayLogo::before { @include ms-Icon--SwayLogo } +.ms-Icon--OutOfOffice::before { @include ms-Icon--OutOfOffice } +.ms-Icon--Trophy::before { @include ms-Icon--Trophy } +.ms-Icon--ReopenPages::before { @include ms-Icon--ReopenPages } +.ms-Icon--AADLogo::before { @include ms-Icon--AADLogo } +.ms-Icon--AccessLogo::before { @include ms-Icon--AccessLogo } +.ms-Icon--AdminALogo::before { @include ms-Icon--AdminALogo } +.ms-Icon--AdminCLogo::before { @include ms-Icon--AdminCLogo } +.ms-Icon--AdminDLogo::before { @include ms-Icon--AdminDLogo } +.ms-Icon--AdminELogo::before { @include ms-Icon--AdminELogo } +.ms-Icon--AdminLLogo::before { @include ms-Icon--AdminLLogo } +.ms-Icon--AdminMLogo::before { @include ms-Icon--AdminMLogo } +.ms-Icon--AdminOLogo::before { @include ms-Icon--AdminOLogo } +.ms-Icon--AdminPLogo::before { @include ms-Icon--AdminPLogo } +.ms-Icon--AdminSLogo::before { @include ms-Icon--AdminSLogo } +.ms-Icon--AdminYLogo::before { @include ms-Icon--AdminYLogo } +.ms-Icon--AlchemyLogo::before { @include ms-Icon--AlchemyLogo } +.ms-Icon--BoxLogo::before { @include ms-Icon--BoxLogo } +.ms-Icon--DelveLogo::before { @include ms-Icon--DelveLogo } +.ms-Icon--DropboxLogo::before { @include ms-Icon--DropboxLogo } +.ms-Icon--ExchangeLogo::before { @include ms-Icon--ExchangeLogo } +.ms-Icon--LyncLogo::before { @include ms-Icon--LyncLogo } +.ms-Icon--OfficeVideoLogo::before { @include ms-Icon--OfficeVideoLogo } +.ms-Icon--ParatureLogo::before { @include ms-Icon--ParatureLogo } +.ms-Icon--SocialListeningLogo::before { @include ms-Icon--SocialListeningLogo } +.ms-Icon--VisioLogo::before { @include ms-Icon--VisioLogo } +.ms-Icon--Balloons::before { @include ms-Icon--Balloons } +.ms-Icon--Cat::before { @include ms-Icon--Cat } +.ms-Icon--MailAlert::before { @include ms-Icon--MailAlert } +.ms-Icon--MailCheck::before { @include ms-Icon--MailCheck } +.ms-Icon--MailLowImportance::before { @include ms-Icon--MailLowImportance } +.ms-Icon--MailPause::before { @include ms-Icon--MailPause } +.ms-Icon--MailRepeat::before { @include ms-Icon--MailRepeat } +.ms-Icon--SecurityGroup::before { @include ms-Icon--SecurityGroup } +.ms-Icon--Table::before { @include ms-Icon--Table } +.ms-Icon--VoicemailForward::before { @include ms-Icon--VoicemailForward } +.ms-Icon--VoicemailReply::before { @include ms-Icon--VoicemailReply } +.ms-Icon--Waffle::before { @include ms-Icon--Waffle } +.ms-Icon--RemoveEvent::before { @include ms-Icon--RemoveEvent } +.ms-Icon--EventInfo::before { @include ms-Icon--EventInfo } +.ms-Icon--ForwardEvent::before { @include ms-Icon--ForwardEvent } +.ms-Icon--WipePhone::before { @include ms-Icon--WipePhone } +.ms-Icon--AddOnlineMeeting::before { @include ms-Icon--AddOnlineMeeting } +.ms-Icon--JoinOnlineMeeting::before { @include ms-Icon--JoinOnlineMeeting } +.ms-Icon--RemoveLink::before { @include ms-Icon--RemoveLink } +.ms-Icon--PeopleBlock::before { @include ms-Icon--PeopleBlock } +.ms-Icon--PeopleRepeat::before { @include ms-Icon--PeopleRepeat } +.ms-Icon--PeopleAlert::before { @include ms-Icon--PeopleAlert } +.ms-Icon--PeoplePause::before { @include ms-Icon--PeoplePause } +.ms-Icon--TransferCall::before { @include ms-Icon--TransferCall } +.ms-Icon--AddPhone::before { @include ms-Icon--AddPhone } +.ms-Icon--UnknownCall::before { @include ms-Icon--UnknownCall } +.ms-Icon--NoteReply::before { @include ms-Icon--NoteReply } +.ms-Icon--NoteForward::before { @include ms-Icon--NoteForward } +.ms-Icon--NotePinned::before { @include ms-Icon--NotePinned } +.ms-Icon--RemoveOccurrence::before { @include ms-Icon--RemoveOccurrence } +.ms-Icon--Timeline::before { @include ms-Icon--Timeline } +.ms-Icon--EditNote::before { @include ms-Icon--EditNote } +.ms-Icon--CircleHalfFull::before { @include ms-Icon--CircleHalfFull } +.ms-Icon--Room::before { @include ms-Icon--Room } +.ms-Icon--Unsubscribe::before { @include ms-Icon--Unsubscribe } +.ms-Icon--Subscribe::before { @include ms-Icon--Subscribe } +.ms-Icon--RecurringTask::before { @include ms-Icon--RecurringTask } +.ms-Icon--TaskManager::before { @include ms-Icon--TaskManager } +.ms-Icon--TaskManagerMirrored::before { @include ms-Icon--TaskManagerMirrored } +.ms-Icon--Combine::before { @include ms-Icon--Combine } +.ms-Icon--Split::before { @include ms-Icon--Split } +.ms-Icon--DoubleChevronUp::before { @include ms-Icon--DoubleChevronUp } +.ms-Icon--DoubleChevronLeft::before { @include ms-Icon--DoubleChevronLeft } +.ms-Icon--DoubleChevronRight::before { @include ms-Icon--DoubleChevronRight } +.ms-Icon--Ascending::before { @include ms-Icon--Ascending } +.ms-Icon--Descending::before { @include ms-Icon--Descending } +.ms-Icon--TextBox::before { @include ms-Icon--TextBox } +.ms-Icon--TextField::before { @include ms-Icon--TextField } +.ms-Icon--NumberField::before { @include ms-Icon--NumberField } +.ms-Icon--Dropdown::before { @include ms-Icon--Dropdown } +.ms-Icon--BookingsLogo::before { @include ms-Icon--BookingsLogo } +.ms-Icon--ClassNotebookLogo::before { @include ms-Icon--ClassNotebookLogo } +.ms-Icon--CollabsDBLogo::before { @include ms-Icon--CollabsDBLogo } +.ms-Icon--DelveAnalyticsLogo::before { @include ms-Icon--DelveAnalyticsLogo } +.ms-Icon--DocsLogo::before { @include ms-Icon--DocsLogo } +.ms-Icon--DynamicsCRMLogo::before { @include ms-Icon--DynamicsCRMLogo } +.ms-Icon--DynamicSMBLogo::before { @include ms-Icon--DynamicSMBLogo } +.ms-Icon--OfficeAssistantLogo::before { @include ms-Icon--OfficeAssistantLogo } +.ms-Icon--OfficeStoreLogo::before { @include ms-Icon--OfficeStoreLogo } +.ms-Icon--OneNoteEduLogo::before { @include ms-Icon--OneNoteEduLogo } +.ms-Icon--Planner::before { @include ms-Icon--Planner } +.ms-Icon--PowerApps::before { @include ms-Icon--PowerApps } +.ms-Icon--Suitcase::before { @include ms-Icon--Suitcase } +.ms-Icon--ProjectLogo::before { @include ms-Icon--ProjectLogo } +.ms-Icon--CaretLeft8::before { @include ms-Icon--CaretLeft8 } +.ms-Icon--CaretRight8::before { @include ms-Icon--CaretRight8 } +.ms-Icon--CaretUp8::before { @include ms-Icon--CaretUp8 } +.ms-Icon--CaretDown8::before { @include ms-Icon--CaretDown8 } +.ms-Icon--CaretLeftSolid8::before { @include ms-Icon--CaretLeftSolid8 } +.ms-Icon--CarotRightSolid8::before { @include ms-Icon--CarotRightSolid8 } +.ms-Icon--CaretUpSolid8::before { @include ms-Icon--CaretUpSolid8 } +.ms-Icon--CaretDownSolid8::before { @include ms-Icon--CaretDownSolid8 } +.ms-Icon--ClearFormatting::before { @include ms-Icon--ClearFormatting } +.ms-Icon--Superscript::before { @include ms-Icon--Superscript } +.ms-Icon--Subscript::before { @include ms-Icon--Subscript } +.ms-Icon--Strikethrough::before { @include ms-Icon--Strikethrough } +.ms-Icon--SingleBookmark::before { @include ms-Icon--SingleBookmark } +.ms-Icon--DoubleChevronDown::before { @include ms-Icon--DoubleChevronDown } +.ms-Icon--ReplyAll::before { @include ms-Icon--ReplyAll } +.ms-Icon--GoogleDriveLogo::before { @include ms-Icon--GoogleDriveLogo } +.ms-Icon--Questionnaire::before { @include ms-Icon--Questionnaire } +.ms-Icon--ReplyMirrored::before { @include ms-Icon--ReplyMirrored } +.ms-Icon--ReplyAllMirrored::before { @include ms-Icon--ReplyAllMirrored } +.ms-Icon--AddGroup::before { @include ms-Icon--AddGroup } +.ms-Icon--QuestionnaireMirrored::before { @include ms-Icon--QuestionnaireMirrored } +.ms-Icon--TemporaryUser::before { @include ms-Icon--TemporaryUser } +.ms-Icon--GroupedDescending::before { @include ms-Icon--GroupedDescending } +.ms-Icon--GroupedAscending::before { @include ms-Icon--GroupedAscending } +.ms-Icon--SortUp::before { @include ms-Icon--SortUp } +.ms-Icon--SortDown::before { @include ms-Icon--SortDown } +.ms-Icon--AwayStatus::before { @include ms-Icon--AwayStatus } +.ms-Icon--SyncToPC::before { @include ms-Icon--SyncToPC } +.ms-Icon--AustralianRules::before { @include ms-Icon--AustralianRules } +.ms-Icon--DateTimeMirrored::before { @include ms-Icon--DateTimeMirrored } +.ms-Icon--DoubleChevronUp12::before { @include ms-Icon--DoubleChevronUp12 } +.ms-Icon--DoubleChevronDown12::before { @include ms-Icon--DoubleChevronDown12 } +.ms-Icon--DoubleChevronLeft12::before { @include ms-Icon--DoubleChevronLeft12 } +.ms-Icon--DoubleChevronRight12::before { @include ms-Icon--DoubleChevronRight12 } +.ms-Icon--CalendarAgenda::before { @include ms-Icon--CalendarAgenda } +.ms-Icon--AddEvent::before { @include ms-Icon--AddEvent } +.ms-Icon--AssetLibrary::before { @include ms-Icon--AssetLibrary } +.ms-Icon--DataConnectionLibrary::before { @include ms-Icon--DataConnectionLibrary } +.ms-Icon--DocLibrary::before { @include ms-Icon--DocLibrary } +.ms-Icon--FormLibrary::before { @include ms-Icon--FormLibrary } +.ms-Icon--FormLibraryMirrored::before { @include ms-Icon--FormLibraryMirrored } +.ms-Icon--ReportLibrary::before { @include ms-Icon--ReportLibrary } +.ms-Icon--ReportLibraryMirrored::before { @include ms-Icon--ReportLibraryMirrored } +.ms-Icon--ContactCard::before { @include ms-Icon--ContactCard } +.ms-Icon--CustomList::before { @include ms-Icon--CustomList } +.ms-Icon--CustomListMirrored::before { @include ms-Icon--CustomListMirrored } +.ms-Icon--IssueTracking::before { @include ms-Icon--IssueTracking } +.ms-Icon--IssueTrackingMirrored::before { @include ms-Icon--IssueTrackingMirrored } +.ms-Icon--PictureLibrary::before { @include ms-Icon--PictureLibrary } +.ms-Icon--AppForOfficeLogo::before { @include ms-Icon--AppForOfficeLogo } +.ms-Icon--OfflineOneDriveParachute::before { @include ms-Icon--OfflineOneDriveParachute } +.ms-Icon--OfflineOneDriveParachuteDisabled::before { @include ms-Icon--OfflineOneDriveParachuteDisabled } +.ms-Icon--LargeGrid::before { @include ms-Icon--LargeGrid } +.ms-Icon--TriangleSolidUp12::before { @include ms-Icon--TriangleSolidUp12 } +.ms-Icon--TriangleSolidDown12::before { @include ms-Icon--TriangleSolidDown12 } +.ms-Icon--TriangleSolidLeft12::before { @include ms-Icon--TriangleSolidLeft12 } +.ms-Icon--TriangleSolidRight12::before { @include ms-Icon--TriangleSolidRight12 } +.ms-Icon--TriangleUp12::before { @include ms-Icon--TriangleUp12 } +.ms-Icon--TriangleDown12::before { @include ms-Icon--TriangleDown12 } +.ms-Icon--TriangleLeft12::before { @include ms-Icon--TriangleLeft12 } +.ms-Icon--TriangleRight12::before { @include ms-Icon--TriangleRight12 } +.ms-Icon--ArrowUpRight8::before { @include ms-Icon--ArrowUpRight8 } +.ms-Icon--ArrowDownRight8::before { @include ms-Icon--ArrowDownRight8 } +.ms-Icon--DocumentSet::before { @include ms-Icon--DocumentSet } +.ms-Icon--DelveAnalytics::before { @include ms-Icon--DelveAnalytics } +.ms-Icon--ArrowUpRightMirrored8::before { @include ms-Icon--ArrowUpRightMirrored8 } +.ms-Icon--ArrowDownRightMirrored8::before { @include ms-Icon--ArrowDownRightMirrored8 } +.ms-Icon--OneDriveAdd::before { @include ms-Icon--OneDriveAdd } +.ms-Icon--Header2::before { @include ms-Icon--Header2 } +.ms-Icon--Header3::before { @include ms-Icon--Header3 } +.ms-Icon--Header4::before { @include ms-Icon--Header4 } +.ms-Icon--MarketDown::before { @include ms-Icon--MarketDown } +.ms-Icon--CalendarWorkWeek::before { @include ms-Icon--CalendarWorkWeek } +.ms-Icon--SidePanel::before { @include ms-Icon--SidePanel } +.ms-Icon--GlobeFavorite::before { @include ms-Icon--GlobeFavorite } +.ms-Icon--CaretTopLeftSolid8::before { @include ms-Icon--CaretTopLeftSolid8 } +.ms-Icon--CaretTopRightSolid8::before { @include ms-Icon--CaretTopRightSolid8 } +.ms-Icon--ViewAll2::before { @include ms-Icon--ViewAll2 } +.ms-Icon--DocumentReply::before { @include ms-Icon--DocumentReply } +.ms-Icon--PlayerSettings::before { @include ms-Icon--PlayerSettings } +.ms-Icon--ReceiptForward::before { @include ms-Icon--ReceiptForward } +.ms-Icon--ReceiptReply::before { @include ms-Icon--ReceiptReply } +.ms-Icon--ReceiptCheck::before { @include ms-Icon--ReceiptCheck } +.ms-Icon--Fax::before { @include ms-Icon--Fax } +.ms-Icon--RecurringEvent::before { @include ms-Icon--RecurringEvent } +.ms-Icon--ReplyAlt::before { @include ms-Icon--ReplyAlt } +.ms-Icon--ReplyAllAlt::before { @include ms-Icon--ReplyAllAlt } +.ms-Icon--EditStyle::before { @include ms-Icon--EditStyle } +.ms-Icon--EditMail::before { @include ms-Icon--EditMail } +.ms-Icon--Lifesaver::before { @include ms-Icon--Lifesaver } +.ms-Icon--LifesaverLock::before { @include ms-Icon--LifesaverLock } +.ms-Icon--InboxCheck::before { @include ms-Icon--InboxCheck } +.ms-Icon--FolderSearch::before { @include ms-Icon--FolderSearch } +.ms-Icon--CollapseMenu::before { @include ms-Icon--CollapseMenu } +.ms-Icon--ExpandMenu::before { @include ms-Icon--ExpandMenu } +.ms-Icon--Boards::before { @include ms-Icon--Boards } +.ms-Icon--SunAdd::before { @include ms-Icon--SunAdd } +.ms-Icon--SunQuestionMark::before { @include ms-Icon--SunQuestionMark } +.ms-Icon--LandscapeOrientation::before { @include ms-Icon--LandscapeOrientation } +.ms-Icon--DocumentSearch::before { @include ms-Icon--DocumentSearch } +.ms-Icon--PublicCalendar::before { @include ms-Icon--PublicCalendar } +.ms-Icon--PublicContactCard::before { @include ms-Icon--PublicContactCard } +.ms-Icon--PublicEmail::before { @include ms-Icon--PublicEmail } +.ms-Icon--PublicFolder::before { @include ms-Icon--PublicFolder } +.ms-Icon--WordDocument::before { @include ms-Icon--WordDocument } +.ms-Icon--PowerPointDocument::before { @include ms-Icon--PowerPointDocument } +.ms-Icon--ExcelDocument::before { @include ms-Icon--ExcelDocument } +.ms-Icon--GroupedList::before { @include ms-Icon--GroupedList } +.ms-Icon--ClassroomLogo::before { @include ms-Icon--ClassroomLogo } +.ms-Icon--Sections::before { @include ms-Icon--Sections } +.ms-Icon--EditPhoto::before { @include ms-Icon--EditPhoto } +.ms-Icon--Starburst::before { @include ms-Icon--Starburst } +.ms-Icon--ShareiOS::before { @include ms-Icon--ShareiOS } +.ms-Icon--AirTickets::before { @include ms-Icon--AirTickets } +.ms-Icon--PencilReply::before { @include ms-Icon--PencilReply } +.ms-Icon--Tiles2::before { @include ms-Icon--Tiles2 } +.ms-Icon--SkypeCircleCheck::before { @include ms-Icon--SkypeCircleCheck } +.ms-Icon--SkypeCircleClock::before { @include ms-Icon--SkypeCircleClock } +.ms-Icon--SkypeCircleMinus::before { @include ms-Icon--SkypeCircleMinus } +.ms-Icon--SkypeCheck::before { @include ms-Icon--SkypeCheck } +.ms-Icon--SkypeClock::before { @include ms-Icon--SkypeClock } +.ms-Icon--SkypeMinus::before { @include ms-Icon--SkypeMinus } +.ms-Icon--SkypeMessage::before { @include ms-Icon--SkypeMessage } +.ms-Icon--ClosedCaption::before { @include ms-Icon--ClosedCaption } +.ms-Icon--ATPLogo::before { @include ms-Icon--ATPLogo } +.ms-Icon--OfficeFormLogo::before { @include ms-Icon--OfficeFormLogo } +.ms-Icon--RecycleBin::before { @include ms-Icon--RecycleBin } +.ms-Icon--EmptyRecycleBin::before { @include ms-Icon--EmptyRecycleBin } +.ms-Icon--Hide2::before { @include ms-Icon--Hide2 } +.ms-Icon--iOSAppStoreLogo::before { @include ms-Icon--iOSAppStoreLogo } +.ms-Icon--AndroidLogo::before { @include ms-Icon--AndroidLogo } +.ms-Icon--Breadcrumb::before { @include ms-Icon--Breadcrumb } +.ms-Icon--ClearFilter::before { @include ms-Icon--ClearFilter } +.ms-Icon--Flow::before { @include ms-Icon--Flow } +.ms-Icon--PowerAppsLogo::before { @include ms-Icon--PowerAppsLogo } +.ms-Icon--PowerApps2Logo::before { @include ms-Icon--PowerApps2Logo } + + +// Modifier: Place the icon in a circle. +.ms-Icon--circle { + @include ms-Icon--circle; +} + +// Icon size classes + +.ms-Icon--xs { + @include ms-Icon--xs; +} + +.ms-Icon--s { + @include ms-Icon--s; +} + +.ms-Icon--m { + @include ms-Icon--m; +} + +.ms-Icon--l { + @include ms-Icon--l; +} diff --git a/dist/sass/Fabric.Icons.RTL.Output.scss b/dist/sass/Fabric.Icons.RTL.Output.scss new file mode 100644 index 000000000..6b2b2e165 --- /dev/null +++ b/dist/sass/Fabric.Icons.RTL.Output.scss @@ -0,0 +1,114 @@ +// Copyright (c) Microsoft. All rights reserved. Licensed under the MIT license. See LICENSE in the project root for license information. + +// +// Office UI Fabric +// -------------------------------------------------- +// RTL overrides for Fabricicons + + +@import 'Fabric.Icons.Output'; + +// Flip icons with 'directionality' +.ms-Icon--question, +.ms-Icon--calendar, +.ms-Icon--folder, +.ms-Icon--chat, +.ms-Icon--listBullets, +.ms-Icon--folderMove, +.ms-Icon--mailSend, +.ms-Icon--reply, +.ms-Icon--play, +.ms-Icon--replyAll, +.ms-Icon--refresh, +.ms-Icon--questionReverse, +.ms-Icon--notRecurring, +.ms-Icon--tasks, +.ms-Icon--check, +.ms-Icon--arrowLeft, +.ms-Icon--arrowRight, +.ms-Icon--directions, +.ms-Icon--caretLeft, +.ms-Icon--caretRight, +.ms-Icon--caretUpLeft, +.ms-Icon--caretUpRight, +.ms-Icon--caretDownRight, +.ms-Icon--caretDownLeft, +.ms-Icon--note, +.ms-Icon--noteReply, +.ms-Icon--noteForward, +.ms-Icon--taskRecurring, +.ms-Icon--documentReply, +.ms-Icon--documentForward, +.ms-Icon--reactivate, +.ms-Icon--chevronLeft, +.ms-Icon--chevronRight, +.ms-Icon--notebook, +.ms-Icon--chevronsLeft, +.ms-Icon--chevronsRight, +.ms-Icon--receiptForward, +.ms-Icon--receiptReply, +.ms-Icon--receiptCheck, +.ms-Icon--eventShare, +.ms-Icon--oofReply, +.ms-Icon--voicemailReply, +.ms-Icon--voicemailForward, +.ms-Icon--post, +.ms-Icon--toggle, +.ms-Icon--late, +.ms-Icon--eventRecurring, +.ms-Icon--cart, +.ms-Icon--socialListening, +.ms-Icon--replyAlt, +.ms-Icon--replyAllAlt, +.ms-Icon--graph, +.ms-Icon--pinLeft, +.ms-Icon--chart, +.ms-Icon--page, +.ms-Icon--document, +.ms-Icon--metadata, +.ms-Icon--pointItem, +.ms-Icon--dropdown, +.ms-Icon--checkbox, +.ms-Icon--reload, +.ms-Icon--multiChoice, +.ms-Icon--contactForm, +.ms-Icon--inboxCheck, +.ms-Icon--checkboxCheck, +.ms-Icon--folderSearch, +.ms-Icon--listCheck, +.ms-Icon--listGroup, +.ms-Icon--timeline +.ms-Icon--mailCheck, +.ms-Icon--listCheckbox, +.ms-Icon--sunQuestion, +.ms-Icon--chevronThinLeft, +.ms-Icon--chevronThinRight, +.ms-Icon--chevronThickLeft, +.ms-Icon--chevronThickRight, +.ms-Icon--documentLandscape, +.ms-Icon--peopleCheck, +.ms-Icon--caretLeftOutline, +.ms-Icon--caretRightOutline, +.ms-Icon--mailSync, +.ms-Icon--peopleSync, +.ms-Icon--checkPeople, +.ms-Icon--sortLines, +.ms-Icon--triangleRight::before, +.ms-Icon--triangleLeft::before, +.ms-Icon--contactPublic::before, +.ms-Icon--triangleEmptyRight::before, +.ms-Icon--triangleEmptyLeft::before, +.ms-Icon--fileDocument::before, +.ms-Icon--listGroup2::before, +.ms-Icon--copy::before, +.ms-Icon--sections::before, +.ms-Icon--arrowUpRight::before, +.ms-Icon--arrowDownRight::before, +.ms-Icon--arrowDownLeft::before, +.ms-Icon--arrowUpLeft::before, +.ms-Icon--bundle::before { + -moz-transform: scaleX(-1); + -webkit-transform: scaleX(-1); + -o-transform: scaleX(-1); + transform: scaleX(-1); +} \ No newline at end of file diff --git a/dist/sass/Fabric.RTL.scss b/dist/sass/Fabric.RTL.scss new file mode 100644 index 000000000..30739e46c --- /dev/null +++ b/dist/sass/Fabric.RTL.scss @@ -0,0 +1,39 @@ +// Copyright (c) Microsoft. All rights reserved. Licensed under the MIT license. See LICENSE in the project root for license information. + +// +// OSS Framework Design Language +// -------------------------------------------------- +// Fabric Core Module Loader (RTL) + +// Common utilities +@import './Fabric.Utilities.Output'; +@import './Fabric.ZIndex.Variables'; +@import './Fabric.Mixins'; +@import './Fabric.Mixins.RTL'; + +// Colors +@import './Fabric.Color.Variables'; +@import './Fabric.Color.Mixins.Output'; + +// Typography +@import './Fabric.Typography.Variables'; +@import './Fabric.Typography.Fonts.Output'; +@import './Fabric.Typography.Output'; +@import './Fabric.Typography.Language.Overrides.Output'; + +// Icons +@import './Fabric.Icons.Font.Output'; +@import './Fabric.Icons.RTL.Output'; + +// Animations +@import './Fabric.Animations.RTL.Output'; + +// Responsive +@import './Fabric.Responsive.Variables'; +@import './Fabric.Responsive.Utilities.Output'; + +// Grid +@import './Fabric.Grid.Output'; + +// Base/wrapper component +@import './Fabric.Base.Output'; diff --git a/dist/sass/Fabric.Responsive.Utilities.Output.scss b/dist/sass/Fabric.Responsive.Utilities.Output.scss new file mode 100644 index 000000000..caa7c267b --- /dev/null +++ b/dist/sass/Fabric.Responsive.Utilities.Output.scss @@ -0,0 +1,1022 @@ +// Copyright (c) Microsoft. All rights reserved. Licensed under the MIT license. See LICENSE in the project root for license information. + +// +// Office UI Fabric +// -------------------------------------------------- +// Responsive utilities based on defined variables, component visibility, +// and size for different displays. +@import "./Fabric.Responsive.Variables"; +@import "./Fabric.Responsive.Utilities.Variables"; + +//== Responsive visiblity classes +// + +// Hidden on small +@media (max-width: $ms-screen-sm-max) { + .ms-u-hiddenSm, + .ms-u-hiddenMdDown, + .ms-u-hiddenLgDown, + .ms-u-hiddenXlDown, + .ms-u-hiddenXxlDown { + display: none !important; + } +} + +// Hidden on medium +@media (min-width: $ms-screen-md-min) and (max-width: $ms-screen-md-max) { + .ms-u-hiddenMd, + .ms-u-hiddenMdUp, + .ms-u-hiddenMdDown, + .ms-u-hiddenLgDown, + .ms-u-hiddenXlDown, + .ms-u-hiddenXxlDown { + display: none !important; + } +} + +// Hidden on large +@media (min-width: $ms-screen-lg-min) and (max-width: $ms-screen-lg-max) { + .ms-u-hiddenMdUp, + .ms-u-hiddenLg, + .ms-u-hiddenLgUp, + .ms-u-hiddenLgDown, + .ms-u-hiddenXlDown, + .ms-u-hiddenXxlDown { + display: none !important; + } +} + +// Hidden on extra large +@media (min-width: $ms-screen-xl-min) and (max-width: $ms-screen-xl-max) { + .ms-u-hiddenMdUp, + .ms-u-hiddenLgUp, + .ms-u-hiddenXl, + .ms-u-hiddenXlUp, + .ms-u-hiddenXlDown, + .ms-u-hiddenXxlDown { + display: none !important; + } +} + +// Hidden on extra extra large +@media (min-width: $ms-screen-xxl-min) and (max-width: $ms-screen-xxl-max) { + .ms-u-hiddenMdUp, + .ms-u-hiddenLgUp, + .ms-u-hiddenXlUp, + .ms-u-hiddenXxl, + .ms-u-hiddenXxlUp, + .ms-u-hiddenXxlDown { + display: none !important; + } +} + +// Hidden on extra extra extra large +@media (min-width: $ms-screen-xxxl-min) { + .ms-u-hiddenMdUp, + .ms-u-hiddenLgUp, + .ms-u-hiddenXlUp, + .ms-u-hiddenXxlUp, + .ms-u-hiddenXxxl { + display: none !important; + } +} + + +//== Responsive sizes +// +// These are all based on a 12 column grid. For example, +// ms-u-sm6 sets the width to 50% (6/12) on small screens. + +// Small screens (default) +.ms-u-sm12 { + @include ms-u-sm12; +} +.ms-u-sm11 { + @include ms-u-sm11; +} +.ms-u-sm10 { + @include ms-u-sm10; +} +.ms-u-sm9 { + @include ms-u-sm9; +} +.ms-u-sm8 { + @include ms-u-sm8; +} +.ms-u-sm7 { + @include ms-u-sm7; +} +.ms-u-sm6 { + @include ms-u-sm6; +} +.ms-u-sm5 { + @include ms-u-sm5; +} +.ms-u-sm4 { + @include ms-u-sm4; +} +.ms-u-sm3 { + @include ms-u-sm3; +} +.ms-u-sm2 { + @include ms-u-sm2; +} +.ms-u-sm1 { + @include ms-u-sm1; +} +.ms-u-smPull12 { + @include ms-u-smPull12; +} +.ms-u-smPull11 { + @include ms-u-smPull11; +} +.ms-u-smPull10 { + @include ms-u-smPull10; +} +.ms-u-smPull9 { + @include ms-u-smPull9; +} +.ms-u-smPull8 { + @include ms-u-smPull8; +} +.ms-u-smPull7 { + @include ms-u-smPull7; +} +.ms-u-smPull6 { + @include ms-u-smPull6; +} +.ms-u-smPull5 { + @include ms-u-smPull5; +} +.ms-u-smPull4 { + @include ms-u-smPull4; +} +.ms-u-smPull3 { + @include ms-u-smPull3; +} +.ms-u-smPull2 { + @include ms-u-smPull2; +} +.ms-u-smPull1 { + @include ms-u-smPull1; +} +.ms-u-smPull0 { + @include ms-u-smPull0; +} +.ms-u-smPush12 { + @include ms-u-smPush12; +} +.ms-u-smPush11 { + @include ms-u-smPush11; +} +.ms-u-smPush10 { + @include ms-u-smPush10; +} +.ms-u-smPush9 { + @include ms-u-smPush9; +} +.ms-u-smPush8 { + @include ms-u-smPush8; +} +.ms-u-smPush7 { + @include ms-u-smPush7; +} +.ms-u-smPush6 { + @include ms-u-smPush6; +} +.ms-u-smPush5 { + @include ms-u-smPush5; +} +.ms-u-smPush4 { + @include ms-u-smPush4; +} +.ms-u-smPush3 { + @include ms-u-smPush3; +} +.ms-u-smPush2 { + @include ms-u-smPush2; +} +.ms-u-smPush1 { + @include ms-u-smPush1; +} +.ms-u-smPush0 { + @include ms-u-smPush0; +} + +// Small Offset classes 0 ... 11 +.ms-u-smOffset11 { + margin-left: 91.66666666666666%; +} +.ms-u-smOffset10 { + margin-left: 83.33333333333334%; +} +.ms-u-smOffset9 { + margin-left: 75%; +} +.ms-u-smOffset8 { + margin-left: 66.66666666666666%; +} +.ms-u-smOffset7 { + margin-left: 58.333333333333336%; +} +.ms-u-smOffset6 { + margin-left: 50%; +} +.ms-u-smOffset5 { + margin-left: 41.66666666666667%; +} +.ms-u-smOffset4 { + margin-left: 33.33333333333333%; +} +.ms-u-smOffset3 { + margin-left: 25%; +} +.ms-u-smOffset2 { + margin-left: 16.666666666666664%; +} +.ms-u-smOffset1 { + margin-left: 8.333333333333332%; +} +.ms-u-smOffset0 { + margin-left: 0; +} + +// Medium screens +@media (min-width: $ms-screen-md-min) { + .ms-u-md12 { + @include ms-u-md12; + } + .ms-u-md11 { + @include ms-u-md11; + } + .ms-u-md10 { + @include ms-u-md10; + } + .ms-u-md9 { + @include ms-u-md9; + } + .ms-u-md8 { + @include ms-u-md8; + } + .ms-u-md7 { + @include ms-u-md7; + } + .ms-u-md6 { + @include ms-u-md6; + } + .ms-u-md5 { + @include ms-u-md5; + } + .ms-u-md4 { + @include ms-u-md4; + } + .ms-u-md3 { + @include ms-u-md3; + } + .ms-u-md2 { + @include ms-u-md2; + } + .ms-u-md1 { + @include ms-u-md1; + } + .ms-u-mdPull12 { + @include ms-u-mdPull12; + } + .ms-u-mdPull11 { + @include ms-u-mdPull11; + } + .ms-u-mdPull10 { + @include ms-u-mdPull10; + } + .ms-u-mdPull9 { + @include ms-u-mdPull9; + } + .ms-u-mdPull8 { + @include ms-u-mdPull8; + } + .ms-u-mdPull7 { + @include ms-u-mdPull7; + } + .ms-u-mdPull6 { + @include ms-u-mdPull6; + } + .ms-u-mdPull5 { + @include ms-u-mdPull5; + } + .ms-u-mdPull4 { + @include ms-u-mdPull4; + } + .ms-u-mdPull3 { + @include ms-u-mdPull3; + } + .ms-u-mdPull2 { + @include ms-u-mdPull2; + } + .ms-u-mdPull1 { + @include ms-u-mdPull1; + } + .ms-u-mdPull0 { + @include ms-u-mdPull0; + } + .ms-u-mdPush12 { + @include ms-u-mdPush12; + } + .ms-u-mdPush11 { + @include ms-u-mdPush11; + } + .ms-u-mdPush10 { + @include ms-u-mdPush10; + } + .ms-u-mdPush9 { + @include ms-u-mdPush9; + } + .ms-u-mdPush8 { + @include ms-u-mdPush8; + } + .ms-u-mdPush7 { + @include ms-u-mdPush7; + } + .ms-u-mdPush6 { + @include ms-u-mdPush6; + } + .ms-u-mdPush5 { + @include ms-u-mdPush5; + } + .ms-u-mdPush4 { + @include ms-u-mdPush4; + } + .ms-u-mdPush3 { + @include ms-u-mdPush3; + } + .ms-u-mdPush2 { + @include ms-u-mdPush2; + } + .ms-u-mdPush1 { + @include ms-u-mdPush1; + } + .ms-u-mdPush0 { + @include ms-u-mdPush0; + } + + // Medium Offset classes 0 ... 11 + .ms-u-mdOffset11 { + margin-left: 91.66666666666666%; + } + .ms-u-mdOffset10 { + margin-left: 83.33333333333334%; + } + .ms-u-mdOffset9 { + margin-left: 75%; + } + .ms-u-mdOffset8 { + margin-left: 66.66666666666666%; + } + .ms-u-mdOffset7 { + margin-left: 58.333333333333336%; + } + .ms-u-mdOffset6 { + margin-left: 50%; + } + .ms-u-mdOffset5 { + margin-left: 41.66666666666667%; + } + .ms-u-mdOffset4 { + margin-left: 33.33333333333333%; + } + .ms-u-mdOffset3 { + margin-left: 25%; + } + .ms-u-mdOffset2 { + margin-left: 16.666666666666664%; + } + .ms-u-mdOffset1 { + margin-left: 8.333333333333332%; + } + .ms-u-mdOffset0 { + margin-left: 0; + } +} + +// Large screens +@media (min-width: $ms-screen-lg-min) { + .ms-u-lg12 { + @include ms-u-lg12; + } + .ms-u-lg11 { + @include ms-u-lg11; + } + .ms-u-lg10 { + @include ms-u-lg10; + } + .ms-u-lg9 { + @include ms-u-lg9; + } + .ms-u-lg8 { + @include ms-u-lg8; + } + .ms-u-lg7 { + @include ms-u-lg7; + } + .ms-u-lg6 { + @include ms-u-lg6; + } + .ms-u-lg5 { + @include ms-u-lg5; + } + .ms-u-lg4 { + @include ms-u-lg4; + } + .ms-u-lg3 { + @include ms-u-lg3; + } + .ms-u-lg2 { + @include ms-u-lg2; + } + .ms-u-lg1 { + @include ms-u-lg1; + } + .ms-u-lgPull12 { + @include ms-u-lgPull12; + } + .ms-u-lgPull11 { + @include ms-u-lgPull11; + } + .ms-u-lgPull10 { + @include ms-u-lgPull10; + } + .ms-u-lgPull9 { + @include ms-u-lgPull9; + } + .ms-u-lgPull8 { + @include ms-u-lgPull8; + } + .ms-u-lgPull7 { + @include ms-u-lgPull7; + } + .ms-u-lgPull6 { + @include ms-u-lgPull6; + } + .ms-u-lgPull5 { + @include ms-u-lgPull5; + } + .ms-u-lgPull4 { + @include ms-u-lgPull4; + } + .ms-u-lgPull3 { + @include ms-u-lgPull3; + } + .ms-u-lgPull2 { + @include ms-u-lgPull2; + } + .ms-u-lgPull1 { + @include ms-u-lgPull1; + } + .ms-u-lgPull0 { + @include ms-u-lgPull0; + } + .ms-u-lgPush12 { + @include ms-u-lgPush12; + } + .ms-u-lgPush11 { + @include ms-u-lgPush11; + } + .ms-u-lgPush10 { + @include ms-u-lgPush10; + } + .ms-u-lgPush9 { + @include ms-u-lgPush9; + } + .ms-u-lgPush8 { + @include ms-u-lgPush8; + } + .ms-u-lgPush7 { + @include ms-u-lgPush7; + } + .ms-u-lgPush6 { + @include ms-u-lgPush6; + } + .ms-u-lgPush5 { + @include ms-u-lgPush5; + } + .ms-u-lgPush4 { + @include ms-u-lgPush4; + } + .ms-u-lgPush3 { + @include ms-u-lgPush3; + } + .ms-u-lgPush2 { + @include ms-u-lgPush2; + } + .ms-u-lgPush1 { + @include ms-u-lgPush1; + } + .ms-u-lgPush0 { + @include ms-u-lgPush0; + } + + // Large Offset classes 0 ... 11 + .ms-u-lgOffset11 { + margin-left: 91.66666666666666%; + } + .ms-u-lgOffset10 { + margin-left: 83.33333333333334%; + } + .ms-u-lgOffset9 { + margin-left: 75%; + } + .ms-u-lgOffset8 { + margin-left: 66.66666666666666%; + } + .ms-u-lgOffset7 { + margin-left: 58.333333333333336%; + } + .ms-u-lgOffset6 { + margin-left: 50%; + } + .ms-u-lgOffset5 { + margin-left: 41.66666666666667%; + } + .ms-u-lgOffset4 { + margin-left: 33.33333333333333%; + } + .ms-u-lgOffset3 { + margin-left: 25%; + } + .ms-u-lgOffset2 { + margin-left: 16.666666666666664%; + } + .ms-u-lgOffset1 { + margin-left: 8.333333333333332%; + } + .ms-u-lgOffset0 { + margin-left: 0; + } +} + +// Extra large screens +@media (min-width: $ms-screen-xl-min) { + .ms-u-xl12 { + @include ms-u-xl12; + } + .ms-u-xl11 { + @include ms-u-xl11; + } + .ms-u-xl10 { + @include ms-u-xl10; + } + .ms-u-xl9 { + @include ms-u-xl9; + } + .ms-u-xl8 { + @include ms-u-xl8; + } + .ms-u-xl7 { + @include ms-u-xl7; + } + .ms-u-xl6 { + @include ms-u-xl6; + } + .ms-u-xl5 { + @include ms-u-xl5; + } + .ms-u-xl4 { + @include ms-u-xl4; + } + .ms-u-xl3 { + @include ms-u-xl3; + } + .ms-u-xl2 { + @include ms-u-xl2; + } + .ms-u-xl1 { + @include ms-u-xl1; + } + .ms-u-xlPull12 { + @include ms-u-xlPull12; + } + .ms-u-xlPull11 { + @include ms-u-xlPull11; + } + .ms-u-xlPull10 { + @include ms-u-xlPull10; + } + .ms-u-xlPull9 { + @include ms-u-xlPull9; + } + .ms-u-xlPull8 { + @include ms-u-xlPull8; + } + .ms-u-xlPull7 { + @include ms-u-xlPull7; + } + .ms-u-xlPull6 { + @include ms-u-xlPull6; + } + .ms-u-xlPull5 { + @include ms-u-xlPull5; + } + .ms-u-xlPull4 { + @include ms-u-xlPull4; + } + .ms-u-xlPull3 { + @include ms-u-xlPull3; + } + .ms-u-xlPull2 { + @include ms-u-xlPull2; + } + .ms-u-xlPull1 { + @include ms-u-xlPull1; + } + .ms-u-xlPull0 { + @include ms-u-xlPull0; + } + .ms-u-xlPush12 { + @include ms-u-xlPush12; + } + .ms-u-xlPush11 { + @include ms-u-xlPush11; + } + .ms-u-xlPush10 { + @include ms-u-xlPush10; + } + .ms-u-xlPush9 { + @include ms-u-xlPush9; + } + .ms-u-xlPush8 { + @include ms-u-xlPush8; + } + .ms-u-xlPush7 { + @include ms-u-xlPush7; + } + .ms-u-xlPush6 { + @include ms-u-xlPush6; + } + .ms-u-xlPush5 { + @include ms-u-xlPush5; + } + .ms-u-xlPush4 { + @include ms-u-xlPush4; + } + .ms-u-xlPush3 { + @include ms-u-xlPush3; + } + .ms-u-xlPush2 { + @include ms-u-xlPush2; + } + .ms-u-xlPush1 { + @include ms-u-xlPush1; + } + .ms-u-xlPush0 { + @include ms-u-xlPush0; + } + + // Large Offset classes 0 ... 11 + .ms-u-xlOffset11 { + margin-left: 91.66666666666666%; + } + .ms-u-xlOffset10 { + margin-left: 83.33333333333334%; + } + .ms-u-xlOffset9 { + margin-left: 75%; + } + .ms-u-xlOffset8 { + margin-left: 66.66666666666666%; + } + .ms-u-xlOffset7 { + margin-left: 58.333333333333336%; + } + .ms-u-xlOffset6 { + margin-left: 50%; + } + .ms-u-xlOffset5 { + margin-left: 41.66666666666667%; + } + .ms-u-xlOffset4 { + margin-left: 33.33333333333333%; + } + .ms-u-xlOffset3 { + margin-left: 25%; + } + .ms-u-xlOffset2 { + margin-left: 16.666666666666664%; + } + .ms-u-xlOffset1 { + margin-left: 8.333333333333332%; + } + .ms-u-xlOffset0 { + margin-left: 0; + } +} + +// Extra extra large screens +@media (min-width: $ms-screen-xxl-min) { + .ms-u-xxl12 { + @include ms-u-xxl12; + } + .ms-u-xxl11 { + @include ms-u-xxl11; + } + .ms-u-xxl10 { + @include ms-u-xxl10; + } + .ms-u-xxl9 { + @include ms-u-xxl9; + } + .ms-u-xxl8 { + @include ms-u-xxl8; + } + .ms-u-xxl7 { + @include ms-u-xxl7; + } + .ms-u-xxl6 { + @include ms-u-xxl6; + } + .ms-u-xxl5 { + @include ms-u-xxl5; + } + .ms-u-xxl4 { + @include ms-u-xxl4; + } + .ms-u-xxl3 { + @include ms-u-xxl3; + } + .ms-u-xxl2 { + @include ms-u-xxl2; + } + .ms-u-xxl1 { + @include ms-u-xxl1; + } + .ms-u-xxlPull12 { + @include ms-u-xxlPull12; + } + .ms-u-xxlPull11 { + @include ms-u-xxlPull11; + } + .ms-u-xxlPull10 { + @include ms-u-xxlPull10; + } + .ms-u-xxlPull9 { + @include ms-u-xxlPull9; + } + .ms-u-xxlPull8 { + @include ms-u-xxlPull8; + } + .ms-u-xxlPull7 { + @include ms-u-xxlPull7; + } + .ms-u-xxlPull6 { + @include ms-u-xxlPull6; + } + .ms-u-xxlPull5 { + @include ms-u-xxlPull5; + } + .ms-u-xxlPull4 { + @include ms-u-xxlPull4; + } + .ms-u-xxlPull3 { + @include ms-u-xxlPull3; + } + .ms-u-xxlPull2 { + @include ms-u-xxlPull2; + } + .ms-u-xxlPull1 { + @include ms-u-xxlPull1; + } + .ms-u-xxlPull0 { + @include ms-u-xxlPull0; + } + .ms-u-xxlPush12 { + @include ms-u-xxlPush12; + } + .ms-u-xxlPush11 { + @include ms-u-xxlPush11; + } + .ms-u-xxlPush10 { + @include ms-u-xxlPush10; + } + .ms-u-xxlPush9 { + @include ms-u-xxlPush9; + } + .ms-u-xxlPush8 { + @include ms-u-xxlPush8; + } + .ms-u-xxlPush7 { + @include ms-u-xxlPush7; + } + .ms-u-xxlPush6 { + @include ms-u-xxlPush6; + } + .ms-u-xxlPush5 { + @include ms-u-xxlPush5; + } + .ms-u-xxlPush4 { + @include ms-u-xxlPush4; + } + .ms-u-xxlPush3 { + @include ms-u-xxlPush3; + } + .ms-u-xxlPush2 { + @include ms-u-xxlPush2; + } + .ms-u-xxlPush1 { + @include ms-u-xxlPush1; + } + .ms-u-xxlPush0 { + @include ms-u-xxlPush0; + } + + // Extra extra large Offset classes 0 ... 11 + .ms-u-xxlOffset11 { + margin-left: 91.66666666666666%; + } + .ms-u-xxlOffset10 { + margin-left: 83.33333333333334%; + } + .ms-u-xxlOffset9 { + margin-left: 75%; + } + .ms-u-xxlOffset8 { + margin-left: 66.66666666666666%; + } + .ms-u-xxlOffset7 { + margin-left: 58.333333333333336%; + } + .ms-u-xxlOffset6 { + margin-left: 50%; + } + .ms-u-xxlOffset5 { + margin-left: 41.66666666666667%; + } + .ms-u-xxlOffset4 { + margin-left: 33.33333333333333%; + } + .ms-u-xxlOffset3 { + margin-left: 25%; + } + .ms-u-xxlOffset2 { + margin-left: 16.666666666666664%; + } + .ms-u-xxlOffset1 { + margin-left: 8.333333333333332%; + } + .ms-u-xxlOffset0 { + margin-left: 0; + } +} + +// Extra extra extra large screens +@media (min-width: $ms-screen-xxxl-min) { + .ms-u-xxxl12 { + @include ms-u-xxxl12; + } + .ms-u-xxxl11 { + @include ms-u-xxxl11; + } + .ms-u-xxxl10 { + @include ms-u-xxxl10; + } + .ms-u-xxxl9 { + @include ms-u-xxxl9; + } + .ms-u-xxxl8 { + @include ms-u-xxxl8; + } + .ms-u-xxxl7 { + @include ms-u-xxxl7; + } + .ms-u-xxxl6 { + @include ms-u-xxxl6; + } + .ms-u-xxxl5 { + @include ms-u-xxxl5; + } + .ms-u-xxxl4 { + @include ms-u-xxxl4; + } + .ms-u-xxxl3 { + @include ms-u-xxxl3; + } + .ms-u-xxxl2 { + @include ms-u-xxxl2; + } + .ms-u-xxxl1 { + @include ms-u-xxxl1; + } + .ms-u-xxxlPull12 { + @include ms-u-xxxlPull12; + } + .ms-u-xxxlPull11 { + @include ms-u-xxxlPull11; + } + .ms-u-xxxlPull10 { + @include ms-u-xxxlPull10; + } + .ms-u-xxxlPull9 { + @include ms-u-xxxlPull9; + } + .ms-u-xxxlPull8 { + @include ms-u-xxxlPull8; + } + .ms-u-xxxlPull7 { + @include ms-u-xxxlPull7; + } + .ms-u-xxxlPull6 { + @include ms-u-xxxlPull6; + } + .ms-u-xxxlPull5 { + @include ms-u-xxxlPull5; + } + .ms-u-xxxlPull4 { + @include ms-u-xxxlPull4; + } + .ms-u-xxxlPull3 { + @include ms-u-xxxlPull3; + } + .ms-u-xxxlPull2 { + @include ms-u-xxxlPull2; + } + .ms-u-xxxlPull1 { + @include ms-u-xxxlPull1; + } + .ms-u-xxxlPull0 { + @include ms-u-xxxlPull0; + } + .ms-u-xxxlPush12 { + @include ms-u-xxxlPush12; + } + .ms-u-xxxlPush11 { + @include ms-u-xxxlPush11; + } + .ms-u-xxxlPush10 { + @include ms-u-xxxlPush10; + } + .ms-u-xxxlPush9 { + @include ms-u-xxxlPush9; + } + .ms-u-xxxlPush8 { + @include ms-u-xxxlPush8; + } + .ms-u-xxxlPush7 { + @include ms-u-xxxlPush7; + } + .ms-u-xxxlPush6 { + @include ms-u-xxxlPush6; + } + .ms-u-xxxlPush5 { + @include ms-u-xxxlPush5; + } + .ms-u-xxxlPush4 { + @include ms-u-xxxlPush4; + } + .ms-u-xxxlPush3 { + @include ms-u-xxxlPush3; + } + .ms-u-xxxlPush2 { + @include ms-u-xxxlPush2; + } + .ms-u-xxxlPush1 { + @include ms-u-xxxlPush1; + } + .ms-u-xxxlPush0 { + @include ms-u-xxxlPush0; + } + + // Extra extra extra large Offset classes 0 ... 11 + .ms-u-xxxlOffset11 { + margin-left: 91.66666666666666%; + } + .ms-u-xxxlOffset10 { + margin-left: 83.33333333333334%; + } + .ms-u-xxxlOffset9 { + margin-left: 75%; + } + .ms-u-xxxlOffset8 { + margin-left: 66.66666666666666%; + } + .ms-u-xxxlOffset7 { + margin-left: 58.333333333333336%; + } + .ms-u-xxxlOffset6 { + margin-left: 50%; + } + .ms-u-xxxlOffset5 { + margin-left: 41.66666666666667%; + } + .ms-u-xxxlOffset4 { + margin-left: 33.33333333333333%; + } + .ms-u-xxxlOffset3 { + margin-left: 25%; + } + .ms-u-xxxlOffset2 { + margin-left: 16.666666666666664%; + } + .ms-u-xxxlOffset1 { + margin-left: 8.333333333333332%; + } + .ms-u-xxxlOffset0 { + margin-left: 0; + } +} diff --git a/dist/sass/Fabric.Typography.Fonts.Extended.Output.scss b/dist/sass/Fabric.Typography.Fonts.Extended.Output.scss new file mode 100644 index 000000000..929f7a19b --- /dev/null +++ b/dist/sass/Fabric.Typography.Fonts.Extended.Output.scss @@ -0,0 +1,67 @@ +// Copyright (c) Microsoft. All rights reserved. Licensed under the MIT license. See LICENSE in the project root for license information. + +// +// Office UI Fabric +// -------------------------------------------------- + +// Additional @font-face rules for the Leelawadee font. +@font-face { + font-family: "Leelawadee UI"; + src: local('Leelawadee UI Bold'), + url('#{$ms-font-directory}/LeelawadeeUI-Thai/LeelawadeeUI-Bold.woff2') format('woff2'), + url('#{$ms-font-directory}/LeelawadeeUI-Thai/LeelawadeeUI-Bold.woff') format('woff'), + url('#{$ms-font-directory}/LeelawadeeUI-Thai/LeelawadeeUI-Bold.ttf') format('truetype'); + font-weight: 600; + font-style: normal; +} + +@font-face { + font-family: "Leelawadee UI"; + src: local('Leelawadee UI Regular'), + url('#{$ms-font-directory}/LeelawadeeUI-Thai/LeelawadeeUI-Regular.woff2') format('woff2'), + url('#{$ms-font-directory}/LeelawadeeUI-Thai/LeelawadeeUI-Regular.woff') format('woff'), + url('#{$ms-font-directory}/LeelawadeeUI-Thai/LeelawadeeUI-Regular.ttf') format('truetype'); + font-weight: 400; + font-style: normal; +} + +@font-face { + font-family: "Leelawadee UI"; + src: local('Leelawadee UI Semilight'), + url('#{$ms-font-directory}/LeelawadeeUI-Thai/LeelawadeeUI-Semilight.woff2') format('woff2'), + url('#{$ms-font-directory}/LeelawadeeUI-Thai/LeelawadeeUI-Semilight.woff') format('woff'), + url('#{$ms-font-directory}/LeelawadeeUI-Thai/LeelawadeeUI-Semilight.ttf') format('truetype'); + font-weight: 300; + font-style: normal; +} + +// Mixins to generate language-specific font faces. +@include SegoeUIArabicLight; +@include SegoeUIArabicRegular; +@include SegoeUIArabicSemibold; +@include SegoeUIArabicSemilight; + +@include SegoeUICyrillicLight; +@include SegoeUICyrillicRegular; +@include SegoeUICyrillicSemibold; +@include SegoeUICyrillicSemilight; + +@include SegoeUIEastEuropeanLight; +@include SegoeUIEastEuropeanRegular; +@include SegoeUIEastEuropeanSemibold; +@include SegoeUIEastEuropeanSemilight; + +@include SegoeUIGreekLight; +@include SegoeUIGreekRegular; +@include SegoeUIGreekSemibold; +@include SegoeUIGreekSemilight; + +@include SegoeUIHebrewLight; +@include SegoeUIHebrewRegular; +@include SegoeUIHebrewSemibold; +@include SegoeUIHebrewSemilight; + +@include SegoeUIVietnameseLight; +@include SegoeUIVietnameseRegular; +@include SegoeUIVietnameseSemibold; +@include SegoeUIVietnameseSemilight; diff --git a/dist/sass/Fabric.Typography.Fonts.Output.scss b/dist/sass/Fabric.Typography.Fonts.Output.scss new file mode 100644 index 000000000..3a6688a38 --- /dev/null +++ b/dist/sass/Fabric.Typography.Fonts.Output.scss @@ -0,0 +1,13 @@ +// Copyright (c) Microsoft. All rights reserved. Licensed under the MIT license. See LICENSE in the project root for license information. + +// +// Office UI Fabric +// -------------------------------------------------- +// Font definitions + +@import "Fabric.Typography.Fonts"; + +@include SegoeUIWestEuropeanLight; +@include SegoeUIWestEuropeanRegular; +@include SegoeUIWestEuropeanSemibold; +@include SegoeUIWestEuropeanSemilight; \ No newline at end of file diff --git a/dist/sass/Fabric.Typography.Language.Overrides.Output.scss b/dist/sass/Fabric.Typography.Language.Overrides.Output.scss new file mode 100644 index 000000000..829d7aa24 --- /dev/null +++ b/dist/sass/Fabric.Typography.Language.Overrides.Output.scss @@ -0,0 +1,53 @@ +// Copyright (c) Microsoft. All rights reserved. Licensed under the MIT license. See LICENSE in the project root for license information. + +// +// Office UI Fabric +// -------------------------------------------------- +// Language override definitions using ISO 639-3 language codes + +@import "./Fabric.Typography.Language.Overrides"; + +// Generate the override classes for non-distributed fonts. +@include language-override-system-fonts(jpn, $ms-font-stack-japanese); +@include language-override-system-fonts(kor, $ms-font-stack-korean); +@include language-override-system-fonts(cmn, $ms-font-stack-chinese-simplified); +@include language-override-system-fonts(yue, $ms-font-stack-chinese-traditional); +@include language-override-system-fonts(hin, $ms-font-stack-hindi); + +// Generate the override classes for web fonts. +// Thai (Leelawadee) +// tha +@include language-override-system-fonts(tha, $ms-font-stack-leelawadee); + +// Arabic +// ara +@include language-override-system-fonts(ara, $ms-font-stack-arabic); + +// East European +// ces, et, hrv, hun, lit, pl, lat, tur, slk, kaz +@include language-override-system-fonts(ces, $ms-font-stack-eastEuropean); +@include language-override-system-fonts(est, $ms-font-stack-eastEuropean); +@include language-override-system-fonts(hrv, $ms-font-stack-eastEuropean); +@include language-override-system-fonts(hun, $ms-font-stack-eastEuropean); +@include language-override-system-fonts(kaz, $ms-font-stack-eastEuropean); +@include language-override-system-fonts(lav, $ms-font-stack-eastEuropean); +@include language-override-system-fonts(lit, $ms-font-stack-eastEuropean); +@include language-override-system-fonts(pol, $ms-font-stack-eastEuropean); +@include language-override-system-fonts(slk, $ms-font-stack-eastEuropean); +@include language-override-system-fonts(tur, $ms-font-stack-eastEuropean); + +// Cyrillic +// rus +@include language-override-system-fonts(rus, $ms-font-stack-cyrillic); + +// Greek +// ell +@include language-override-system-fonts(ell, $ms-font-stack-greek); + +// Hebrew +// heb +@include language-override-system-fonts(heb, $ms-font-stack-hebrew); + +// Vietnamese +// vie +@include language-override-system-fonts(vie, $ms-font-stack-vietnamese); \ No newline at end of file diff --git a/dist/sass/Fabric.Typography.Output.scss b/dist/sass/Fabric.Typography.Output.scss new file mode 100644 index 000000000..8d2e8285c --- /dev/null +++ b/dist/sass/Fabric.Typography.Output.scss @@ -0,0 +1,389 @@ +// Copyright (c) Microsoft. All rights reserved. Licensed under the MIT license. See LICENSE in the project root for license information. + +// +// Office UI Fabric +// -------------------------------------------------- +// Typographic mixins arranged with appropriate size and family combinations. +@import './Fabric.Typography'; + +// Super Styles (LIMITED USE) +// Weights: Light +.ms-font-su { + @include ms-font-su; +} +// No touch class for Super + +// Extra-Extra-Large +// Allowed weights: Light, SemiLight +.ms-font-xxl { + @include ms-font-xxl; +} + +// Extra-Large Styles +// Allowed weights: Light, SemiLight +.ms-font-xl { + @include ms-font-xl; +} + +// Large Styles +// Allowed weights: SemiLight, Regular, Semibold +.ms-font-l { + @include ms-font-l; +} + +// Medium Plus Styles +// Allowed weights: SemiLight, Regular, Semibold +.ms-font-m-plus { + @include ms-font-m-plus; +} + +// Medium Styles +// Allowed weights: SemiLight, Regular, Semibold +.ms-font-m { + @include ms-font-m; +} + +// Small Plus Styles +// Allowed weights: SemiLight, Regular, Semibold +.ms-font-s-plus { + @include ms-font-s-plus; +} + +// Small Styles +// Allowed weights: SemiLight, Regular, Semibold +.ms-font-s { + @include ms-font-s; +} + +// XS Styles +// Allowed weights: SemiLight, Regular, Semibold +.ms-font-xs { + @include ms-font-xs; +} + +// Micro Styles (LIMITED USE) +// Weights: Semibold +.ms-font-mi { + @include ms-font-mi; +} + +//== Helper classes & mixins +// +// Helper mixins to override default type values + +// Font weights +.ms-fontWeight-light, +.ms-fontWeight-light--hover:hover { + @include ms-fontWeight-light; +} + +.ms-fontWeight-semilight, +.ms-fontWeight-semilight--hover:hover { + @include ms-fontWeight-semilight; +} + +.ms-fontWeight-regular, +.ms-fontWeight-regular--hover:hover { + @include ms-fontWeight-regular; +} + +.ms-fontWeight-semibold, +.ms-fontWeight-semibold--hover:hover { + @include ms-fontWeight-semibold; +} + +// Font sizes +.ms-fontSize-su { + @include ms-fontSize-su; +} + +.ms-fontSize-xxl { + @include ms-fontSize-xxl; +} + +.ms-fontSize-xl { + @include ms-fontSize-xl; +} + +.ms-fontSize-l { + @include ms-fontSize-l; +} + +.ms-fontSize-mPlus { + @include ms-fontSize-mPlus; +} + +.ms-fontSize-m { + @include ms-fontSize-m; +} + +.ms-fontSize-sPlus { + @include ms-fontSize-sPlus; +} + +.ms-fontSize-s { + @include ms-fontSize-s; +} + +.ms-fontSize-xs { + @include ms-fontSize-xs; +} + +.ms-fontSize-mi { + @include ms-fontSize-mi; +} + +// Theme colors +.ms-fontColor-themeDarker, +.ms-fontColor-themeDarker--hover:hover { + @include ms-fontColor-themeDarker; +} + +.ms-fontColor-themeDark, +.ms-fontColor-themeDark--hover:hover { + @include ms-fontColor-themeDark; +} + +.ms-fontColor-themeDarkAlt, +.ms-fontColor-themeDarkAlt--hover:hover { + @include ms-fontColor-themeDarkAlt; +} + +.ms-fontColor-themePrimary, +.ms-fontColor-themePrimary--hover:hover { + @include ms-fontColor-themePrimary; +} + +.ms-fontColor-themeSecondary, +.ms-fontColor-themeSecondary--hover:hover { + @include ms-fontColor-themeSecondary; +} + +.ms-fontColor-themeTertiary, +.ms-fontColor-themeTertiary--hover:hover { + @include ms-fontColor-themeTertiary; +} + +.ms-fontColor-themeLight, +.ms-fontColor-themeLight--hover:hover { + @include ms-fontColor-themeLight; +} + +.ms-fontColor-themeLighter, +.ms-fontColor-themeLighter--hover:hover { + @include ms-fontColor-themeLighter; +} + +.ms-fontColor-themeLighterAlt, +.ms-fontColor-themeLighterAlt--hover:hover { + @include ms-fontColor-themeLighterAlt; +} + + +// Neutral colors +.ms-fontColor-black, +.ms-fontColor-black--hover:hover { + @include ms-fontColor-black; +} + +.ms-fontColor-neutralDark, +.ms-fontColor-neutralDark--hover:hover { + @include ms-fontColor-neutralDark; +} + +.ms-fontColor-neutralPrimary, +.ms-fontColor-neutralPrimary--hover:hover { + @include ms-fontColor-neutralPrimary; +} + +.ms-fontColor-neutralPrimaryAlt, +.ms-fontColor-neutralPrimaryAlt--hover:hover { + @include ms-fontColor-neutralPrimaryAlt; +} + +.ms-fontColor-neutralSecondary, +.ms-fontColor-neutralSecondary--hover:hover { + @include ms-fontColor-neutralSecondary; +} + +.ms-fontColor-neutralSecondaryAlt, +.ms-fontColor-neutralSecondaryAlt--hover:hover { + @include ms-fontColor-neutralSecondaryAlt; +} + +.ms-fontColor-neutralTertiary, +.ms-fontColor-neutralTertiary--hover:hover { + @include ms-fontColor-neutralTertiary; +} + +.ms-fontColor-neutralTertiaryAlt, +.ms-fontColor-neutralTertiaryAlt--hover:hover { + @include ms-fontColor-neutralTertiaryAlt; +} + +.ms-fontColor-neutralLight, +.ms-fontColor-neutralLight--hover:hover { + @include ms-fontColor-neutralLight; +} + +.ms-fontColor-neutralLighter, +.ms-fontColor-neutralLighter--hover:hover { + @include ms-fontColor-neutralLighter; +} + +.ms-fontColor-neutralLighterAlt, +.ms-fontColor-neutralLighterAlt--hover:hover { + @include ms-fontColor-neutralLighterAlt; +} + +.ms-fontColor-white, +.ms-fontColor-white--hover:hover { + @include ms-fontColor-white; +} + +// Brand and accent colors +.ms-fontColor-yellow, +.ms-fontColor-yellow--hover:hover { + @include ms-fontColor-yellow; +} + +.ms-fontColor-yellowLight, +.ms-fontColor-yellowLight--hover:hover { + @include ms-fontColor-yellowLight; +} + +.ms-fontColor-orange, +.ms-fontColor-orange--hover:hover { + @include ms-fontColor-orange; +} + +.ms-fontColor-orangeLight, +.ms-fontColor-orangeLight--hover:hover { + @include ms-fontColor-orangeLight; +} + +.ms-fontColor-orangeLighter, +.ms-fontColor-orangeLighter--hover:hover { + @include ms-fontColor-orangeLighter; +} + +.ms-fontColor-redDark, +.ms-fontColor-redDark--hover:hover { + @include ms-fontColor-redDark; +} + +.ms-fontColor-red, +.ms-fontColor-red--hover:hover { + @include ms-fontColor-red; +} + +.ms-fontColor-magentaDark, +.ms-fontColor-magentaDark--hover:hover { + @include ms-fontColor-magentaDark; +} + +.ms-fontColor-magenta, +.ms-fontColor-magenta--hover:hover { + @include ms-fontColor-magenta; +} + +.ms-fontColor-magentaLight, +.ms-fontColor-magentaLight--hover:hover { + @include ms-fontColor-magentaLight; +} + +.ms-fontColor-purpleDark, +.ms-fontColor-purpleDark--hover:hover { + @include ms-fontColor-purpleDark; +} + +.ms-fontColor-purple, +.ms-fontColor-purple--hover:hover { + @include ms-fontColor-purple; +} + +.ms-fontColor-purpleLight, +.ms-fontColor-purpleLight--hover:hover { + @include ms-fontColor-purpleLight; +} + +.ms-fontColor-blueDark, +.ms-fontColor-blueDark--hover:hover { + @include ms-fontColor-blueDark; +} + +.ms-fontColor-blueMid, +.ms-fontColor-blueMid--hover:hover { + @include ms-fontColor-blueMid; +} + +.ms-fontColor-blue, +.ms-fontColor-blue--hover:hover { + @include ms-fontColor-blue; +} + +.ms-fontColor-blueLight, +.ms-fontColor-blueLight--hover:hover { + @include ms-fontColor-blueLight; +} + +.ms-fontColor-tealDark, +.ms-fontColor-tealDark--hover:hover { + @include ms-fontColor-tealDark; +} + +.ms-fontColor-teal, +.ms-fontColor-teal--hover:hover { + @include ms-fontColor-teal; +} + +.ms-fontColor-tealLight, +.ms-fontColor-tealLight--hover:hover { + @include ms-fontColor-tealLight; +} + +.ms-fontColor-greenDark, +.ms-fontColor-greenDark--hover:hover { + @include ms-fontColor-greenDark; +} + +.ms-fontColor-green, +.ms-fontColor-green--hover:hover { + @include ms-fontColor-green; +} + +.ms-fontColor-greenLight, +.ms-fontColor-greenLight--hover:hover { + @include ms-fontColor-greenLight; +} + +// Message colors +.ms-fontColor-info, +.ms-fontColor-info--hover:hover { + @include ms-fontColor-info; +} + +.ms-fontColor-success, +.ms-fontColor-success--hover:hover { + @include ms-fontColor-success; +} + +.ms-fontColor-alert, +.ms-fontColor-alert--hover:hover { // Deprecated: Use ms-fontColor-severeWarning + @include ms-fontColor-alert; +} + +.ms-fontColor-warning, +.ms-fontColor-warning--hover:hover { + @include ms-fontColor-warning; +} + +.ms-fontColor-severeWarning, +.ms-fontColor-severeWarning--hover:hover { + @include ms-fontColor-severeWarning; +} + +.ms-fontColor-error, +.ms-fontColor-error--hover:hover { + @include ms-fontColor-error; +} diff --git a/dist/sass/Fabric.Utilities.Output.scss b/dist/sass/Fabric.Utilities.Output.scss new file mode 100644 index 000000000..c131d7a2a --- /dev/null +++ b/dist/sass/Fabric.Utilities.Output.scss @@ -0,0 +1,46 @@ +// Copyright (c) Microsoft. All rights reserved. Licensed under the MIT license. See LICENSE in the project root for license information. + +// +// Office UI Fabric +// -------------------------------------------------- +// Utility classes and mixins used throughout Fabric. + +@import "Fabric.Utilities"; + +// The best box is a border box. +.ms-u-borderBox, .ms-u-borderBox::before, .ms-u-borderBox::after { + @include ms-u-borderBox; +} + +// To apply border base settings +.ms-u-borderBase { + @include ms-u-borderBase; +} + +// Ensures the block expands to the full height to enclose its floated childen. +.ms-u-clearfix { + @include ms-u-clearfix; +} + +// Basic border-box, margin, and padding reset. +.ms-u-normalize { + @include ms-u-normalize; +} + +// Use to set left, center, right text alignment styles +@include ms-u-textAlign(left, center, right); + +// Use to hide content while still making it readable by screen reader (Accessibility) +.ms-u-screenReaderOnly { + @include ms-u-screenReaderOnly +} + +// Use to add truncation with ellipsis +.ms-u-textTruncate { + @include ms-u-textTruncate +} + +// Use to disable text wrapping +.ms-u-noWrap{ + @include ms-u-noWrap +} \ No newline at end of file diff --git a/dist/sass/Fabric.scss b/dist/sass/Fabric.scss new file mode 100644 index 000000000..2c283120e --- /dev/null +++ b/dist/sass/Fabric.scss @@ -0,0 +1,40 @@ +// Copyright (c) Microsoft. All rights reserved. Licensed under the MIT license. See LICENSE in the project root for license information. + +// +// Office UI Fabric +// Core Module Loader + + +// Common utilities +@import './Fabric.Utilities.Output'; +@import './Fabric.ZIndex.Variables'; +@import './Fabric.Mixins'; +@import "./Fabric.Mixins.RTL"; + +// Colors +@import './Fabric.Color.Variables'; +@import './Fabric.Color.Mixins.Output'; + +// Typography +@import './Fabric.Typography.Variables'; +@import './Fabric.Typography.Mixins'; +@import './Fabric.Typography.Output'; +@import './Fabric.Typography.Fonts.Output'; + +// Icons +@import './Fabric.Icons.Font.Output'; +@import './Fabric.Icons.Output'; + +// Animations +@import './Fabric.Animations.Output'; + +// Responsive +@import './Fabric.Responsive.Variables'; +@import './Fabric.Responsive.Utilities.Variables'; +@import './Fabric.Responsive.Utilities.Output'; + +// Grid +@import './Fabric.Grid.Output'; + +// Base/wrapper component +@import './Fabric.Base.Output'; diff --git a/dist/sass/_Fabric.Animations.RTL.scss b/dist/sass/_Fabric.Animations.RTL.scss new file mode 100644 index 000000000..c6d1a6190 --- /dev/null +++ b/dist/sass/_Fabric.Animations.RTL.scss @@ -0,0 +1,79 @@ +// Copyright (c) Microsoft. All rights reserved. Licensed under the MIT license. See LICENSE in the project root for license information. + +// +// Office UI Fabric +// -------------------------------------------------- +// RTL overrides for Fabric Animations + + +@import 'Fabric.Animations'; + +// slideRightIn10 +@mixin ms-u-slideRightIn10 { + @include animationMix((fadeIn, slideLeft10), $ms-duration3, $ms-ease1); +} + +// slideRightIn20 +@mixin ms-u-slideRightIn20 { + @include animationMix((fadeIn, slideLeft20), $ms-duration3, $ms-ease1); +} + +// slideRightIn40 +@mixin ms-u-slideRightIn40 { + @include animationMix((fadeIn, slideLeft40), $ms-duration3, $ms-ease1); +} + +// slideLeftIn10 +@mixin ms-u-slideLeftIn10 { + @include animationMix((fadeIn, slideRight10), $ms-duration3, $ms-ease1); +} + +// slideLeftIn20 +@mixin ms-u-slideLeftIn20 { + @include animationMix((fadeIn, slideRight20), $ms-duration3, $ms-ease1); +} + +// slideLeftIn40 +@mixin ms-u-slideLeftIn40 { + @include animationMix((fadeIn, slideRight40), $ms-duration3, $ms-ease1); +} + +// slideRightIn400 +@mixin ms-u-slideRightIn400 { + @include animationMix((fadeIn, slideLeft400), $ms-duration3, $ms-ease1); +} + +// slideLeftIn400 +@mixin ms-u-slideLeftIn400 { + @include animationMix((fadeIn, slideRight400), $ms-duration3, $ms-ease1); +} + +// slideRightOut40 +@mixin ms-u-slideRightOut40 { + @include animationMix((fadeOut, slideLeftOut40), $ms-duration1, $ms-ease2); +} + +// slideLeftOut40 +@mixin ms-u-slideLeftOut40 { + @include animationMix((fadeOut, slideRightOut40), $ms-duration1, $ms-ease2); +} + +// slideRightOut400 +@mixin ms-u-slideRightOut400 { + @include animationMix((fadeOut, slideLeftOut400), $ms-duration1, $ms-ease2); +} + +// slideLeftOut400 +@mixin ms-u-slideLeftOut400 { + @include animationMix((fadeOut, slideRightOut400), $ms-duration1, $ms-ease2); +} + +// rotate90deg +@mixin ms-u-rotate90deg { + @include animationMix(rotateN90, 0.1s, $ms-ease2); +} + +// rotateN90deg +@mixin ms-u-rotateN90deg { + @include animationMix(rotate90, 0.1s, $ms-ease2); +} diff --git a/dist/sass/_Fabric.Animations.scss b/dist/sass/_Fabric.Animations.scss new file mode 100644 index 000000000..5b92983de --- /dev/null +++ b/dist/sass/_Fabric.Animations.scss @@ -0,0 +1,237 @@ +// Copyright (c) Microsoft. All rights reserved. Licensed under the MIT license. See LICENSE in the project root for license information. + +// +// Office UI Fabric +// -------------------------------------------------- +// Fabric Animations + + +// Note that all animation classes should begin with the "ms-u" utility prefix. +// The original class names are deprecated and will be removed in a future release. + +// Variables +$ms-ease1: cubic-bezier(0.1,0.9,0.2,1); +$ms-ease2: cubic-bezier(0.1,0.25,0.75,0.9); +$ms-duration1: 0.167s; +$ms-duration2: 0.267s; +$ms-duration3: 0.367s; +$ms-duration4: 0.467s; + + +// Animation mixin +@mixin animationMix($ms-name, $ms-duration, $ms-ease: $ms-ease1, $ms-fillMode: both) { + @include animationName($ms-name); + @include animationDuration($ms-duration); + @include animationTiming($ms-ease); + @include animationFillMode($ms-fillMode); +} + +// slideRightIn10 +@mixin ms-u-slideRightIn10 { + @include animationMix((fadeIn, slideRightIn10), $ms-duration3, $ms-ease1); +} + +// slideRightIn20 +@mixin ms-u-slideRightIn20 { + @include animationMix((fadeIn, slideRightIn20), $ms-duration3, $ms-ease1); +} + +// slideRightIn40 +@mixin ms-u-slideRightIn40 { + @include animationMix((fadeIn, slideRightIn40), $ms-duration3, $ms-ease1); +} + +// slideLeftIn10 +@mixin ms-u-slideLeftIn10 { + @include animationMix((fadeIn, slideLeftIn10), $ms-duration3, $ms-ease1); +} + +// slideLeftIn20 +@mixin ms-u-slideLeftIn20 { + @include animationMix((fadeIn, slideLeftIn20), $ms-duration3, $ms-ease1); +} + +// slideLeftIn40 +@mixin ms-u-slideLeftIn40 { + @include animationMix((fadeIn, slideLeftIn40), $ms-duration3, $ms-ease1); +} + +// slideRightIn400 +@mixin ms-u-slideRightIn400 { + @include animationMix((fadeIn, slideRightIn400), $ms-duration3, $ms-ease1); +} + +// slideLeftIn400 +@mixin ms-u-slideLeftIn400 { + @include animationMix((fadeIn, slideLeft400), $ms-duration3, $ms-ease1); +} + +// slideUpIn20 +@mixin ms-u-slideUpIn20 { + @include animationMix((fadeIn, slideUpIn20), $ms-duration3, $ms-ease1); +} + +// slideUpIn10 +@mixin ms-u-slideUpIn10 { + @include animationMix((fadeIn, slideUpIn10), $ms-duration1, $ms-ease2); +} + +// slideDownIn20 +@mixin ms-u-slideDownIn20 { + @include animationMix((fadeIn, slideDownIn20), $ms-duration3, $ms-ease1); +} + +// slideDownIn10 +@mixin ms-u-slideDownIn10 { + @include animationMix((fadeIn, slideDownIn10), $ms-duration1, $ms-ease2); +} + +// slideRightOut40 +@mixin ms-u-slideRightOut40 { + @include animationMix((fadeOut, slideRightOut40), $ms-duration1, $ms-ease2); +} + +// slideLeftOut40 +@mixin ms-u-slideLeftOut40 { + @include animationMix((fadeOut, slideLeftOut40), $ms-duration1, $ms-ease2); +} + +// slideRightOut400 +@mixin ms-u-slideRightOut400 { + @include animationMix((fadeOut, slideRightOut400), $ms-duration1, $ms-ease2); +} + +// slideLeftOut400 +@mixin ms-u-slideLeftOut400 { + @include animationMix((fadeOut, slideLeftOut400), $ms-duration1, $ms-ease2); +} + +// slideUpOut20 +@mixin ms-u-slideUpOut20 { + @include animationMix((fadeOut, slideUpOut20), $ms-duration1, $ms-ease2); +} + +// slideUpOut10 +@mixin ms-u-slideUpOut10 { + @include animationMix((fadeOut, slideUpOut10), $ms-duration1, $ms-ease2); +} + +// slideDownOut20 +@mixin ms-u-slideDownOut20 { + @include animationMix((fadeOut, slideDownOut20), $ms-duration1, $ms-ease2); +} + +// slideDownOut10 +@mixin ms-u-slideDownOut10 { + @include animationMix((fadeOut, slideDownOut10), $ms-duration1, $ms-ease2); +} + +// scaleUpIn100 +@mixin ms-u-scaleUpIn100 { + @include animationMix((fadeIn, scaleUp100), $ms-duration3, $ms-ease1); +} + +// scaleDownIn100 +@mixin ms-u-scaleDownIn100 { + @include animationMix((fadeIn, scaleDown100), $ms-duration3, $ms-ease1); +} + +// scaleUpOut103 +@mixin ms-u-scaleUpOut103 { + @include animationMix((fadeOut, scaleUp103), $ms-duration1, $ms-ease2); +} + +// scaleDownOut98 +@mixin ms-u-scaleDownOut98 { + @include animationMix((fadeOut, scaleDown98), $ms-duration1, $ms-ease2); +} + +// fadeIn +@mixin ms-u-fadeIn400 { + -webkit-animation-duration: $ms-duration3; + -webkit-animation-name: fadeIn; + -webkit-animation-fill-mode: both; + animation-duration: $ms-duration3; + animation-name: fadeIn; + animation-fill-mode: both; +} +@mixin ms-u-fadeIn100 { + @include ms-u-fadeIn400; + -webkit-animation-duration: $ms-duration1; + animation-duration: $ms-duration1; +} +@mixin ms-u-fadeIn200 { + @include ms-u-fadeIn400; + -webkit-animation-duration: $ms-duration2; + animation-duration: $ms-duration2; +} +@mixin ms-u-fadeIn500 { + @include ms-u-fadeIn400; + -webkit-animation-duration: $ms-duration4; + animation-duration: $ms-duration4; +} + +// fadeOut +@mixin ms-u-fadeOut400 { + -webkit-animation-duration: $ms-duration3; + -webkit-animation-name: fadeOut; + -webkit-animation-fill-mode: both; + animation-duration: $ms-duration3; + animation-name: fadeOut; + animation-fill-mode: both; +} +@mixin ms-u-fadeOut100 { + @include ms-u-fadeOut400; + -webkit-animation-duration: 0.1s; + animation-duration: 0.1s; +} +@mixin ms-u-fadeOut200 { + @include ms-u-fadeOut400; + -webkit-animation-duration: $ms-duration1; + animation-duration: $ms-duration1; +} +@mixin ms-u-fadeOut500 { + @include ms-u-fadeOut400; + -webkit-animation-duration: $ms-duration4; + animation-duration: $ms-duration4; +} + +// rotate90deg +@mixin ms-u-rotate90deg { + @include animationMix(rotate90, 0.1s, $ms-ease2); +} + +// rotateN90deg +@mixin ms-u-rotateN90deg { + @include animationMix(rotateN90, 0.1s, $ms-ease2); +} + +// expandCollapse400 +@mixin ms-u-expandCollapse400 { + -webkit-transition: height $ms-duration3 $ms-ease2; + transition: height $ms-duration3 $ms-ease2; +} + +// expandCollapse200 +@mixin ms-u-expandCollapse200 { + -webkit-transition: height $ms-duration1 $ms-ease2; + transition: height $ms-duration1 $ms-ease2; +} + +// expandCollapse100 +@mixin ms-u-expandCollapse100 { + -webkit-transition: height 0.1s $ms-ease2; + transition: height 0.1s $ms-ease2; +} + +// delay100 +@mixin ms-u-delay100 { + -webkit-animation-delay: $ms-duration1; + animation-delay: $ms-duration1; +} + +// delay200 +@mixin ms-u-delay200 { + -webkit-animation-delay: 0.267s; + animation-delay: 0.267s; +} diff --git a/dist/sass/_Fabric.Base.scss b/dist/sass/_Fabric.Base.scss new file mode 100644 index 000000000..8fabc232c --- /dev/null +++ b/dist/sass/_Fabric.Base.scss @@ -0,0 +1,13 @@ +// Copyright (c) Microsoft. All rights reserved. Licensed under the MIT license. See LICENSE in the project root for license information. + +// +// Office UI Fabric +// -------------------------------------------------- +// Wrapper component to set base typography. + + +//== Wrapper/base component +// +@mixin ms-Fabric { + @include ms-fontColor-neutralPrimary; +} diff --git a/dist/sass/_Fabric.Color.Mixins.scss b/dist/sass/_Fabric.Color.Mixins.scss new file mode 100644 index 000000000..2d87a98e1 --- /dev/null +++ b/dist/sass/_Fabric.Color.Mixins.scss @@ -0,0 +1,418 @@ +// Copyright (c) Microsoft. All rights reserved. Licensed under the MIT license. See LICENSE in the project root for license information. + +// +// Office UI Fabric +// -------------------------------------------------- +// Fabric Core Color Mixins + + +//== Background colors +// +// Theme colors +@mixin ms-bgColor-themeDark { + background-color: $ms-color-themeDark; +} + +@mixin ms-bgColor-themeDarkAlt { + background-color: $ms-color-themeDarkAlt; +} + +@mixin ms-bgColor-themeDarker { + background-color: $ms-color-themeDarker; +} + +@mixin ms-bgColor-themePrimary { + background-color: $ms-color-themePrimary; +} + +@mixin ms-bgColor-themeSecondary { + background-color: $ms-color-themeSecondary; +} + +@mixin ms-bgColor-themeTertiary { + background-color: $ms-color-themeTertiary; +} + +@mixin ms-bgColor-themeLight { + background-color: $ms-color-themeLight; +} + +@mixin ms-bgColor-themeLighter { + background-color: $ms-color-themeLighter; +} + +@mixin ms-bgColor-themeLighterAlt { + background-color: $ms-color-themeLighterAlt; +} + +// Neutral colors +@mixin ms-bgColor-black { + background-color: $ms-color-black; +} + +@mixin ms-bgColor-neutralDark { + background-color: $ms-color-neutralDark; +} + +@mixin ms-bgColor-neutralPrimary { + background-color: $ms-color-neutralPrimary; +} + +@mixin ms-bgColor-neutralPrimaryAlt { + background-color: $ms-color-neutralPrimaryAlt; +} + +@mixin ms-bgColor-neutralSecondary { + background-color: $ms-color-neutralSecondary; +} + +@mixin ms-bgColor-neutralSecondaryAlt { + background-color: $ms-color-neutralSecondaryAlt; +} + +@mixin ms-bgColor-neutralTertiary { + background-color: $ms-color-neutralTertiary; +} + +@mixin ms-bgColor-neutralTertiaryAlt { + background-color: $ms-color-neutralTertiaryAlt; +} + +@mixin ms-bgColor-neutralLight { + background-color: $ms-color-neutralLight; +} + +@mixin ms-bgColor-neutralLighter { + background-color: $ms-color-neutralLighter; +} + +@mixin ms-bgColor-neutralLighterAlt { + background-color: $ms-color-neutralLighterAlt; +} + +@mixin ms-bgColor-white { + background-color: $ms-color-white; +} + + +// Brand and accent colors +@mixin ms-bgColor-yellow { + background-color: $ms-color-yellow; +} + +@mixin ms-bgColor-yellowLight { + background-color: $ms-color-yellowLight; +} + +@mixin ms-bgColor-orange { + background-color: $ms-color-orange; +} + +@mixin ms-bgColor-orangeLight { + background-color: $ms-color-orangeLight; +} + +@mixin ms-bgColor-orangeLighter { + background-color: $ms-color-orangeLighter; +} + +@mixin ms-bgColor-redDark { + background-color: $ms-color-redDark; +} + +@mixin ms-bgColor-red { + background-color: $ms-color-red; +} + +@mixin ms-bgColor-magentaDark { + background-color: $ms-color-magentaDark; +} + +@mixin ms-bgColor-magenta { + background-color: $ms-color-magenta; +} + +@mixin ms-bgColor-magentaLight { + background-color: $ms-color-magentaLight; +} + +@mixin ms-bgColor-purpleDark { + background-color: $ms-color-purpleDark; +} + +@mixin ms-bgColor-purple { + background-color: $ms-color-purple; +} + +@mixin ms-bgColor-purpleLight { + background-color: $ms-color-purpleLight; +} + +@mixin ms-bgColor-blueDark { + background-color: $ms-color-blueDark; +} + +@mixin ms-bgColor-blueMid { + background-color: $ms-color-blueMid; +} + +@mixin ms-bgColor-blue { + background-color: $ms-color-blue; +} + +@mixin ms-bgColor-blueLight { + background-color: $ms-color-blueLight; +} + +@mixin ms-bgColor-tealDark { + background-color: $ms-color-tealDark; +} + +@mixin ms-bgColor-teal { + background-color: $ms-color-teal; +} + +@mixin ms-bgColor-tealLight { + background-color: $ms-color-tealLight; +} + +@mixin ms-bgColor-greenDark { + background-color: $ms-color-greenDark; +} + +@mixin ms-bgColor-green { + background-color: $ms-color-green; +} + +@mixin ms-bgColor-greenLight { + background-color: $ms-color-greenLight; +} + +// Message colors +@mixin ms-bgColor-info { + background-color: $ms-color-infoBackground; +} + +@mixin ms-bgColor-success { + background-color: $ms-color-successBackground; +} + +@mixin ms-bgColor-severeWarning { + background-color: $ms-color-severeWarningBackground; +} + +@mixin ms-bgColor-warning { + background-color: $ms-color-warningBackground; +} + +@mixin ms-bgColor-error { + background-color: $ms-color-errorBackground; +} + + +//== Border colors +// + +// Theme colors +@mixin ms-borderColor-themeDark { + border-color: $ms-color-themeDark; +} + +@mixin ms-borderColor-themeDarkAlt { + border-color: $ms-color-themeDarkAlt; +} + +@mixin ms-borderColor-themeDarker { + border-color: $ms-color-themeDarker; +} + +@mixin ms-borderColor-themePrimary { + border-color: $ms-color-themePrimary; +} + +@mixin ms-borderColor-themeSecondary { + border-color: $ms-color-themeSecondary; +} + +@mixin ms-borderColor-themeTertiary { + border-color: $ms-color-themeTertiary; +} + +@mixin ms-borderColor-themeLight { + border-color: $ms-color-themeLight; +} + +@mixin ms-borderColor-themeLighter { + border-color: $ms-color-themeLighter; +} + +@mixin ms-borderColor-themeLighterAlt { + border-color: $ms-color-themeLighterAlt; +} + + +// Neutral colors +@mixin ms-borderColor-black { + border-color: $ms-color-black; +} + +@mixin ms-borderColor-neutralDark { + border-color: $ms-color-neutralDark; +} + +@mixin ms-borderColor-neutralPrimary { + border-color: $ms-color-neutralPrimary; +} + +@mixin ms-borderColor-neutralPrimaryAlt { + border-color: $ms-color-neutralPrimaryAlt; +} + +@mixin ms-borderColor-neutralSecondary { + border-color: $ms-color-neutralSecondary; +} + +@mixin ms-borderColor-neutralSecondaryAlt { + border-color: $ms-color-neutralSecondaryAlt; +} + +@mixin ms-borderColor-neutralTertiary { + border-color: $ms-color-neutralTertiary; +} + +@mixin ms-borderColor-neutralTertiaryAlt { + border-color: $ms-color-neutralTertiaryAlt; +} + +@mixin ms-borderColor-neutralLight { + border-color: $ms-color-neutralLight; +} + +@mixin ms-borderColor-neutralLighter { + border-color: $ms-color-neutralLighter; +} + +@mixin ms-borderColor-neutralLighterAlt { + border-color: $ms-color-neutralLighterAlt; +} + +@mixin ms-borderColor-white { + border-color: $ms-color-white; +} + +// Brand and accent colors +@mixin ms-borderColor-yellow { + border-color: $ms-color-yellow; +} + +@mixin ms-borderColor-yellowLight { + border-color: $ms-color-yellowLight; +} + +@mixin ms-borderColor-orange { + border-color: $ms-color-orange; +} + +@mixin ms-borderColor-orangeLight { + border-color: $ms-color-orangeLight; +} + +@mixin ms-borderColor-orangeLighter { + border-color: $ms-color-orangeLighter; +} + +@mixin ms-borderColor-redDark { + border-color: $ms-color-redDark; +} + +@mixin ms-borderColor-red { + border-color: $ms-color-red; +} + +@mixin ms-borderColor-magentaDark { + border-color: $ms-color-magentaDark; +} + +@mixin ms-borderColor-magenta { + border-color: $ms-color-magenta; +} + +@mixin ms-borderColor-magentaLight { + border-color: $ms-color-magentaLight; +} + +@mixin ms-borderColor-purpleDark { + border-color: $ms-color-purpleDark; +} + +@mixin ms-borderColor-purple { + border-color: $ms-color-purple; +} + +@mixin ms-borderColor-purpleLight { + border-color: $ms-color-purpleLight; +} + +@mixin ms-borderColor-blueDark { + border-color: $ms-color-blueDark; +} + +@mixin ms-borderColor-blueMid { + border-color: $ms-color-blueMid; +} + +@mixin ms-borderColor-blue { + border-color: $ms-color-blue; +} + +@mixin ms-borderColor-blueLight { + border-color: $ms-color-blueLight; +} + +@mixin ms-borderColor-tealDark { + border-color: $ms-color-tealDark; +} + +@mixin ms-borderColor-teal { + border-color: $ms-color-teal; +} + +@mixin ms-borderColor-tealLight { + border-color: $ms-color-tealLight; +} + +@mixin ms-borderColor-greenDark { + border-color: $ms-color-greenDark; +} + +@mixin ms-borderColor-green { + border-color: $ms-color-green; +} + +@mixin ms-borderColor-greenLight { + border-color: $ms-color-greenLight; +} + + +// Message colors +@mixin ms-borderColor-info { + border-color: $ms-color-info; +} + +@mixin ms-borderColor-success { + border-color: $ms-color-success; +} + +@mixin ms-borderColor-alert { + border-color: $ms-color-alert; +} + +@mixin ms-borderColor-error { + border-color: $ms-color-error; +} + + +// Individual borders, by request +@mixin ms-borderColorTop-themePrimary { + border-top-color: $ms-color-themePrimary; +} diff --git a/dist/sass/_Fabric.Color.Variables.scss b/dist/sass/_Fabric.Color.Variables.scss new file mode 100644 index 000000000..67f14ac6d --- /dev/null +++ b/dist/sass/_Fabric.Color.Variables.scss @@ -0,0 +1,93 @@ +// Copyright (c) Microsoft. All rights reserved. Licensed under the MIT license. See LICENSE in the project root for license information. + +// +// Office UI Fabric +// -------------------------------------------------- +// Fabric Core Color Variables + + +//== Theme Colors +// +$ms-color-themeDarker: #004578; +$ms-color-themeDark: #005a9e; +$ms-color-themeDarkAlt: #106ebe; +$ms-color-themePrimary: #0078d7; +$ms-color-themeSecondary: #2488d8; +$ms-color-themeTertiary: #69afe5; +$ms-color-themeLight: #b3d6f2; +$ms-color-themeLighter: #deecf9; +$ms-color-themeLighterAlt: #eff6fc; + + +//== Grayscale Colors +// +$ms-color-black: #000000; +$ms-color-neutralDark: #212121; +$ms-color-neutralPrimary: #333333; +$ms-color-neutralPrimaryAlt: #3C3C3C; +$ms-color-neutralSecondary: #666666; +$ms-color-neutralSecondaryAlt: #767676; +$ms-color-neutralTertiary: #a6a6a6; +$ms-color-neutralTertiaryAlt: #c8c8c8; +$ms-color-neutralQuaternary: #d0d0d0; +$ms-color-neutralQuaternaryAlt: #dadada; +$ms-color-neutralLight: #eaeaea; +$ms-color-neutralLighter: #f4f4f4; +$ms-color-neutralLighterAlt: #f8f8f8; +$ms-color-white: #ffffff; + +//== Translucent Colors +// +$ms-color-blackTranslucent40: rgba(0,0,0,.4); +$ms-color-whiteTranslucent40: rgba(255,255,255,.4); + + +//== Core brand and accent colors +// +$ms-color-yellow: #ffb900; +$ms-color-yellowLight: #fff100; +$ms-color-orange: #d83b01; +$ms-color-orangeLight: #ea4300; +$ms-color-orangeLighter: #ff8c00; +$ms-color-redDark: #a80000; +$ms-color-red: #e81123; +$ms-color-magentaDark: #5c005c; +$ms-color-magenta: #b4009e; +$ms-color-magentaLight: #e3008c; +$ms-color-purpleDark: #32145a; +$ms-color-purple: #5c2d91; +$ms-color-purpleLight: #b4a0ff; +$ms-color-blueDark: #002050; +$ms-color-blueMid: #00188f; +$ms-color-blue: #0078d7; +$ms-color-blueLight: #00bcf2; +$ms-color-tealDark: #004b50; +$ms-color-teal: #008272; +$ms-color-tealLight: #00b294; +$ms-color-greenDark: #004b1c; +$ms-color-green: #107c10; +$ms-color-greenLight: #bad80a; + + +//== Message colors +// +$ms-color-info: $ms-color-neutralSecondaryAlt; +$ms-color-infoBackground: $ms-color-neutralLighter; +$ms-color-success: $ms-color-green; +$ms-color-successBackground: #dff6dd; +$ms-color-severeWarning: $ms-color-orange; +$ms-color-severeWarningBackground: #fed9cc; +$ms-color-alert: $ms-color-severeWarning; // Deprecated: Use $ms-color-severeWarning +$ms-color-alertBackground: $ms-color-severeWarningBackground; // Deprecated: Use $ms-color-severeWarningBackground +$ms-color-warning: $ms-color-neutralSecondaryAlt; +$ms-color-warningBackground: #fff4ce; +$ms-color-error: $ms-color-redDark; +$ms-color-errorBackground: #fde7e9; + + +//== High contrast colors +// +$ms-color-contrastBlackDisabled: #00ff00; +$ms-color-contrastWhiteDisabled: #600000; +$ms-color-contrastBlackSelected: #1AEBFF; +$ms-color-contrastWhiteSelected: #37006E; diff --git a/dist/sass/_Fabric.Common.scss b/dist/sass/_Fabric.Common.scss new file mode 100644 index 000000000..011af6683 --- /dev/null +++ b/dist/sass/_Fabric.Common.scss @@ -0,0 +1,16 @@ +@import "./Fabric.Animations"; +@import "./Fabric.Color.Mixins"; +@import "./Fabric.Color.Variables"; +@import "./Fabric.Grid"; +@import "./Fabric.Icons"; +@import "./Fabric.i18n"; +@import "./Fabric.Mixins"; +@import "./Fabric.Mixins.RTL"; +@import './Fabric.Responsive.Utilities.Variables'; +@import "./Fabric.Responsive.Variables"; +@import "./Fabric.Typography"; +@import "./Fabric.Typography.Fonts"; +@import "./Fabric.Typography.Variables"; +@import "./Fabric.Typography.Mixins"; +@import "./Fabric.Utilities"; +@import "./Fabric.ZIndex.Variables"; diff --git a/dist/sass/_Fabric.Grid.scss b/dist/sass/_Fabric.Grid.scss new file mode 100644 index 000000000..14430d2d8 --- /dev/null +++ b/dist/sass/_Fabric.Grid.scss @@ -0,0 +1,34 @@ +// Copyright (c) Microsoft. All rights reserved. Licensed under the MIT license. See LICENSE in the project root for license information. + +// +// Office UI Fabric +// -------------------------------------------------- +// Fluid 12-column grids for small, medium, and large devices + + +//== Grid container (same for all sizes) +// +@mixin ms-Grid { + @include ms-u-borderBox; + @include ms-u-clearfix; + padding: 0 8px; +} + +//== Grid rows (pull first and last column out) +// +@mixin ms-Grid-row { + margin: 0 -8px; + @include ms-u-borderBox; + @include ms-u-clearfix; +} + +//== Grid cells +// +@mixin ms-Grid-col { + position: relative; + min-height: 1px; + padding-left: 8px; + padding-right: 8px; + @include ms-u-borderBox; + float: left; +} \ No newline at end of file diff --git a/dist/sass/_Fabric.Icons.Adjustments.scss b/dist/sass/_Fabric.Icons.Adjustments.scss new file mode 100644 index 000000000..a4fdeee97 --- /dev/null +++ b/dist/sass/_Fabric.Icons.Adjustments.scss @@ -0,0 +1,6 @@ +// Copyright (c) Microsoft. All rights reserved. Licensed under the MIT license. See LICENSE in the project root for license information. + +// +// Office UI Fabric +// -------------------------------------------------- +// Fabric Core Icon Adjustments variables \ No newline at end of file diff --git a/dist/sass/_Fabric.Icons.scss b/dist/sass/_Fabric.Icons.scss new file mode 100644 index 000000000..e4d221620 --- /dev/null +++ b/dist/sass/_Fabric.Icons.scss @@ -0,0 +1,739 @@ +// Copyright (c) Microsoft. All rights reserved. Licensed under the MIT license. See LICENSE in the project root for license information. + +// +// Office UI Fabric +// -------------------------------------------------- +// Icon mixin definitions + + +// Base icon definition +@mixin ms-Icon { + -moz-osx-font-smoothing: grayscale; + -webkit-font-smoothing: antialiased; + display: inline-block; + font-family: 'FabricMDL2Icons'; + font-style: normal; + font-weight: normal; + speak: none; +} + +// Modifiers: Each of the icons. +@mixin ms-Icon--DecreaseIndentLegacy { content: "\E290"; } +@mixin ms-Icon--IncreaseIndentLegacy { content: "\E291"; } +@mixin ms-Icon--GlobalNavButton { content: "\E700"; } +@mixin ms-Icon--InternetSharing { content: "\E704"; } +@mixin ms-Icon--Brightness { content: "\E706"; } +@mixin ms-Icon--MapPin { content: "\E707"; } +@mixin ms-Icon--Airplane { content: "\E709"; } +@mixin ms-Icon--Tablet { content: "\E70A"; } +@mixin ms-Icon--QuickNote { content: "\E70B"; } +@mixin ms-Icon--ChevronDown { content: "\E70D"; } +@mixin ms-Icon--ChevronUp { content: "\E70E"; } +@mixin ms-Icon--Edit { content: "\E70F"; } +@mixin ms-Icon--Add { content: "\E710"; } +@mixin ms-Icon--Cancel { content: "\E711"; } +@mixin ms-Icon--More { content: "\E712"; } +@mixin ms-Icon--Settings { content: "\E713"; } +@mixin ms-Icon--Video { content: "\E714"; } +@mixin ms-Icon--Mail { content: "\E715"; } +@mixin ms-Icon--People { content: "\E716"; } +@mixin ms-Icon--Phone { content: "\E717"; } +@mixin ms-Icon--Pin { content: "\E718"; } +@mixin ms-Icon--Shop { content: "\E719"; } +@mixin ms-Icon--Link { content: "\E71B"; } +@mixin ms-Icon--Filter { content: "\E71C"; } +@mixin ms-Icon--Zoom { content: "\E71E"; } +@mixin ms-Icon--ZoomOut { content: "\E71F"; } +@mixin ms-Icon--Microphone { content: "\E720"; } +@mixin ms-Icon--Search { content: "\E721"; } +@mixin ms-Icon--Camera { content: "\E722"; } +@mixin ms-Icon--Attach { content: "\E723"; } +@mixin ms-Icon--Send { content: "\E724"; } +@mixin ms-Icon--FavoriteList { content: "\E728"; } +@mixin ms-Icon--PageSolid { content: "\E729"; } +@mixin ms-Icon--Forward { content: "\E72A"; } +@mixin ms-Icon--Back { content: "\E72B"; } +@mixin ms-Icon--Refresh { content: "\E72C"; } +@mixin ms-Icon--Share { content: "\E72D"; } +@mixin ms-Icon--Lock { content: "\E72E"; } +@mixin ms-Icon--EMI { content: "\E731"; } +@mixin ms-Icon--MiniLink { content: "\E732"; } +@mixin ms-Icon--Blocked { content: "\E733"; } +@mixin ms-Icon--FavoriteStar { content: "\E734"; } +@mixin ms-Icon--FavoriteStarFill { content: "\E735"; } +@mixin ms-Icon--ReadingMode { content: "\E736"; } +@mixin ms-Icon--Remove { content: "\E738"; } +@mixin ms-Icon--Checkbox { content: "\E739"; } +@mixin ms-Icon--CheckboxComposite { content: "\E73A"; } +@mixin ms-Icon--CheckboxIndeterminate { content: "\E73C"; } +@mixin ms-Icon--CheckMark { content: "\E73E"; } +@mixin ms-Icon--BackToWindow { content: "\E73F"; } +@mixin ms-Icon--FullScreen { content: "\E740"; } +@mixin ms-Icon--Print { content: "\E749"; } +@mixin ms-Icon--Up { content: "\E74A"; } +@mixin ms-Icon--Down { content: "\E74B"; } +@mixin ms-Icon--Delete { content: "\E74D"; } +@mixin ms-Icon--Save { content: "\E74E"; } +@mixin ms-Icon--Sad { content: "\E757"; } +@mixin ms-Icon--SIPMove { content: "\E759"; } +@mixin ms-Icon--EraseTool { content: "\E75C"; } +@mixin ms-Icon--GripperTool { content: "\E75E"; } +@mixin ms-Icon--Dialpad { content: "\E75F"; } +@mixin ms-Icon--PageLeft { content: "\E760"; } +@mixin ms-Icon--PageRight { content: "\E761"; } +@mixin ms-Icon--MultiSelect { content: "\E762"; } +@mixin ms-Icon--Play { content: "\E768"; } +@mixin ms-Icon--Pause { content: "\E769"; } +@mixin ms-Icon--ChevronLeft { content: "\E76B"; } +@mixin ms-Icon--ChevronRight { content: "\E76C"; } +@mixin ms-Icon--Emoji2 { content: "\E76E"; } +@mixin ms-Icon--System { content: "\E770"; } +@mixin ms-Icon--Globe { content: "\E774"; } +@mixin ms-Icon--ContactInfo { content: "\E779"; } +@mixin ms-Icon--Unpin { content: "\E77A"; } +@mixin ms-Icon--Contact { content: "\E77B"; } +@mixin ms-Icon--Memo { content: "\E77C"; } +@mixin ms-Icon--WindowsLogo { content: "\E782"; } +@mixin ms-Icon--Error { content: "\E783"; } +@mixin ms-Icon--Unlock { content: "\E785"; } +@mixin ms-Icon--Calendar { content: "\E787"; } +@mixin ms-Icon--Megaphone { content: "\E789"; } +@mixin ms-Icon--AutoEnhanceOn { content: "\E78D"; } +@mixin ms-Icon--AutoEnhanceOff { content: "\E78E"; } +@mixin ms-Icon--Color { content: "\E790"; } +@mixin ms-Icon--SaveAs { content: "\E792"; } +@mixin ms-Icon--Light { content: "\E793"; } +@mixin ms-Icon--Filters { content: "\E795"; } +@mixin ms-Icon--Contrast { content: "\E7A1"; } +@mixin ms-Icon--Redo { content: "\E7A6"; } +@mixin ms-Icon--Undo { content: "\E7A7"; } +@mixin ms-Icon--Album { content: "\E7AB"; } +@mixin ms-Icon--Rotate { content: "\E7AD"; } +@mixin ms-Icon--PanoIndicator { content: "\E7B0"; } +@mixin ms-Icon--ThumbnailView { content: "\E7B6"; } +@mixin ms-Icon--Package { content: "\E7B8"; } +@mixin ms-Icon--Warning { content: "\E7BA"; } +@mixin ms-Icon--Financial { content: "\E7BB"; } +@mixin ms-Icon--ShoppingCart { content: "\E7BF"; } +@mixin ms-Icon--Train { content: "\E7C0"; } +@mixin ms-Icon--Flag { content: "\E7C1"; } +@mixin ms-Icon--Move { content: "\E7C2"; } +@mixin ms-Icon--Page { content: "\E7C3"; } +@mixin ms-Icon--TouchPointer { content: "\E7C9"; } +@mixin ms-Icon--Merge { content: "\E7D5"; } +@mixin ms-Icon--TurnRight { content: "\E7DB"; } +@mixin ms-Icon--Ferry { content: "\E7E3"; } +@mixin ms-Icon--Tab { content: "\E7E9"; } +@mixin ms-Icon--Admin { content: "\E7EF"; } +@mixin ms-Icon--TVMonitor { content: "\E7F4"; } +@mixin ms-Icon--Speakers { content: "\E7F5"; } +@mixin ms-Icon--Car { content: "\E804"; } +@mixin ms-Icon--EatDrink { content: "\E807"; } +@mixin ms-Icon--LocationCircle { content: "\E80E"; } +@mixin ms-Icon--Home { content: "\E80F"; } +@mixin ms-Icon--SwitcherStartEnd { content: "\E810"; } +@mixin ms-Icon--IncidentTriangle { content: "\E814"; } +@mixin ms-Icon--Touch { content: "\E815"; } +@mixin ms-Icon--MapDirections { content: "\E816"; } +@mixin ms-Icon--History { content: "\E81C"; } +@mixin ms-Icon--Location { content: "\E81D"; } +@mixin ms-Icon--Work { content: "\E821"; } +@mixin ms-Icon--Recent { content: "\E823"; } +@mixin ms-Icon--Hotel { content: "\E824"; } +@mixin ms-Icon--LocationDot { content: "\E827"; } +@mixin ms-Icon--News { content: "\E900"; } +@mixin ms-Icon--Chat { content: "\E901"; } +@mixin ms-Icon--Group { content: "\E902"; } +@mixin ms-Icon--View { content: "\E890"; } +@mixin ms-Icon--Clear { content: "\E894"; } +@mixin ms-Icon--Sync { content: "\E895"; } +@mixin ms-Icon--Download { content: "\E896"; } +@mixin ms-Icon--Help { content: "\E897"; } +@mixin ms-Icon--Upload { content: "\E898"; } +@mixin ms-Icon--Emoji { content: "\E899"; } +@mixin ms-Icon--MailForward { content: "\E89C"; } +@mixin ms-Icon--ClosePane { content: "\E89F"; } +@mixin ms-Icon--OpenPane { content: "\E8A0"; } +@mixin ms-Icon--PreviewLink { content: "\E8A1"; } +@mixin ms-Icon--ZoomIn { content: "\E8A3"; } +@mixin ms-Icon--Bookmarks { content: "\E8A4"; } +@mixin ms-Icon--Document { content: "\E8A5"; } +@mixin ms-Icon--ProtectedDocument { content: "\E8A6"; } +@mixin ms-Icon--OpenInNewWindow { content: "\E8A7"; } +@mixin ms-Icon--MailFill { content: "\E8A8"; } +@mixin ms-Icon--ViewAll { content: "\E8A9"; } +@mixin ms-Icon--Switch { content: "\E8AB"; } +@mixin ms-Icon--Rename { content: "\E8AC"; } +@mixin ms-Icon--Folder { content: "\E8B7"; } +@mixin ms-Icon--Picture { content: "\E8B9"; } +@mixin ms-Icon--ShowResults { content: "\E8BC"; } +@mixin ms-Icon--Message { content: "\E8BD"; } +@mixin ms-Icon--CalendarDay { content: "\E8BF"; } +@mixin ms-Icon--CalendarWeek { content: "\E8C0"; } +@mixin ms-Icon--MailReplyAll { content: "\E8C2"; } +@mixin ms-Icon--Read { content: "\E8C3"; } +@mixin ms-Icon--PaymentCard { content: "\E8C7"; } +@mixin ms-Icon--Copy { content: "\E8C8"; } +@mixin ms-Icon--Important { content: "\E8C9"; } +@mixin ms-Icon--MailReply { content: "\E8CA"; } +@mixin ms-Icon--Sort { content: "\E8CB"; } +@mixin ms-Icon--GotoToday { content: "\E8D1"; } +@mixin ms-Icon--Font { content: "\E8D2"; } +@mixin ms-Icon--FontColor { content: "\E8D3"; } +@mixin ms-Icon--FolderFill { content: "\E8D5"; } +@mixin ms-Icon--Permissions { content: "\E8D7"; } +@mixin ms-Icon--DisableUpdates { content: "\E8D8"; } +@mixin ms-Icon--Unfavorite { content: "\E8D9"; } +@mixin ms-Icon--Italic { content: "\E8DB"; } +@mixin ms-Icon--Underline { content: "\E8DC"; } +@mixin ms-Icon--Bold { content: "\E8DD"; } +@mixin ms-Icon--MoveToFolder { content: "\E8DE"; } +@mixin ms-Icon--Dislike { content: "\E8E0"; } +@mixin ms-Icon--Like { content: "\E8E1"; } +@mixin ms-Icon--AlignRight { content: "\E8E2"; } +@mixin ms-Icon--AlignCenter { content: "\E8E3"; } +@mixin ms-Icon--AlignLeft { content: "\E8E4"; } +@mixin ms-Icon--OpenFile { content: "\E8E5"; } +@mixin ms-Icon--FontDecrease { content: "\E8E7"; } +@mixin ms-Icon--FontIncrease { content: "\E8E8"; } +@mixin ms-Icon--FontSize { content: "\E8E9"; } +@mixin ms-Icon--CellPhone { content: "\E8EA"; } +@mixin ms-Icon--Tag { content: "\E8EC"; } +@mixin ms-Icon--Library { content: "\E8F1"; } +@mixin ms-Icon--PostUpdate { content: "\E8F3"; } +@mixin ms-Icon--NewFolder { content: "\E8F4"; } +@mixin ms-Icon--CalendarReply { content: "\E8F5"; } +@mixin ms-Icon--UnsyncFolder { content: "\E8F6"; } +@mixin ms-Icon--SyncFolder { content: "\E8F7"; } +@mixin ms-Icon--BlockContact { content: "\E8F8"; } +@mixin ms-Icon--AddFriend { content: "\E8FA"; } +@mixin ms-Icon--BulletedList { content: "\E8FD"; } +@mixin ms-Icon--Preview { content: "\E8FF"; } +@mixin ms-Icon--DockLeft { content: "\E90C"; } +@mixin ms-Icon--DockRight { content: "\E90D"; } +@mixin ms-Icon--Repair { content: "\E90F"; } +@mixin ms-Icon--Accounts { content: "\E910"; } +@mixin ms-Icon--RadioBullet { content: "\E915"; } +@mixin ms-Icon--Stopwatch { content: "\E916"; } +@mixin ms-Icon--Clock { content: "\E917"; } +@mixin ms-Icon--AlarmClock { content: "\E919"; } +@mixin ms-Icon--Hospital { content: "\E91D"; } +@mixin ms-Icon--Timer { content: "\E91E"; } +@mixin ms-Icon--FullCircleMask { content: "\E91F"; } +@mixin ms-Icon--LocationFill { content: "\E920"; } +@mixin ms-Icon--ChromeMinimize { content: "\E921"; } +@mixin ms-Icon--Annotation { content: "\E924"; } +@mixin ms-Icon--ChromeClose { content: "\E8BB"; } +@mixin ms-Icon--Accept { content: "\E8FB"; } +@mixin ms-Icon--Fingerprint { content: "\E928"; } +@mixin ms-Icon--Handwriting { content: "\E929"; } +@mixin ms-Icon--StackIndicator { content: "\E7FF"; } +@mixin ms-Icon--Completed { content: "\E930"; } +@mixin ms-Icon--Label { content: "\E932"; } +@mixin ms-Icon--FlickDown { content: "\E935"; } +@mixin ms-Icon--FlickUp { content: "\E936"; } +@mixin ms-Icon--FlickLeft { content: "\E937"; } +@mixin ms-Icon--FlickRight { content: "\E938"; } +@mixin ms-Icon--MusicInCollection { content: "\E940"; } +@mixin ms-Icon--OneDrive { content: "\E941"; } +@mixin ms-Icon--CompassNW { content: "\E942"; } +@mixin ms-Icon--Code { content: "\E943"; } +@mixin ms-Icon--LightningBolt { content: "\E945"; } +@mixin ms-Icon--Info { content: "\E946"; } +@mixin ms-Icon--CalculatorAddition { content: "\E948"; } +@mixin ms-Icon--CalculatorSubtract { content: "\E949"; } +@mixin ms-Icon--PrintfaxPrinterFile { content: "\E956"; } +@mixin ms-Icon--Health { content: "\E95E"; } +@mixin ms-Icon--ChevronUpSmall { content: "\E96D"; } +@mixin ms-Icon--ChevronDownSmall { content: "\E96E"; } +@mixin ms-Icon--ChevronLeftSmall { content: "\E96F"; } +@mixin ms-Icon--ChevronRightSmall { content: "\E970"; } +@mixin ms-Icon--ChevronUpMed { content: "\E971"; } +@mixin ms-Icon--ChevronDownMed { content: "\E972"; } +@mixin ms-Icon--ChevronLeftMed { content: "\E973"; } +@mixin ms-Icon--ChevronRightMed { content: "\E974"; } +@mixin ms-Icon--Dictionary { content: "\E82D"; } +@mixin ms-Icon--ChromeBack { content: "\E830"; } +@mixin ms-Icon--PC1 { content: "\E977"; } +@mixin ms-Icon--PresenceChickletVideo { content: "\E979"; } +@mixin ms-Icon--Reply { content: "\E97A"; } +@mixin ms-Icon--DoubleChevronLeftMed { content: "\E991"; } +@mixin ms-Icon--Volume0 { content: "\E992"; } +@mixin ms-Icon--Volume1 { content: "\E993"; } +@mixin ms-Icon--Volume2 { content: "\E994"; } +@mixin ms-Icon--Volume3 { content: "\E995"; } +@mixin ms-Icon--CaretHollow { content: "\E817"; } +@mixin ms-Icon--CaretSolid { content: "\E818"; } +@mixin ms-Icon--Pinned { content: "\E840"; } +@mixin ms-Icon--PinnedFill { content: "\E842"; } +@mixin ms-Icon--Chart { content: "\E999"; } +@mixin ms-Icon--BidiLtr { content: "\E9AA"; } +@mixin ms-Icon--BidiRtl { content: "\E9AB"; } +@mixin ms-Icon--RevToggleKey { content: "\E845"; } +@mixin ms-Icon--RightDoubleQuote { content: "\E9B1"; } +@mixin ms-Icon--Sunny { content: "\E9BD"; } +@mixin ms-Icon--CloudWeather { content: "\E9BE"; } +@mixin ms-Icon--Cloudy { content: "\E9BF"; } +@mixin ms-Icon--PartlyCloudyDay { content: "\E9C0"; } +@mixin ms-Icon--PartlyCloudyNight { content: "\E9C1"; } +@mixin ms-Icon--ClearNight { content: "\E9C2"; } +@mixin ms-Icon--RainShowersDay { content: "\E9C3"; } +@mixin ms-Icon--Rain { content: "\E9C4"; } +@mixin ms-Icon--Thunderstorms { content: "\E9C6"; } +@mixin ms-Icon--RainSnow { content: "\E9C7"; } +@mixin ms-Icon--Snow { content: "\E9C8"; } +@mixin ms-Icon--BlowingSnow { content: "\E9C9"; } +@mixin ms-Icon--Frigid { content: "\E9CA"; } +@mixin ms-Icon--Fog { content: "\E9CB"; } +@mixin ms-Icon--Squalls { content: "\E9CC"; } +@mixin ms-Icon--Duststorm { content: "\E9CD"; } +@mixin ms-Icon--Precipitation { content: "\E9CF"; } +@mixin ms-Icon--Ringer { content: "\EA8F"; } +@mixin ms-Icon--PDF { content: "\EA90"; } +@mixin ms-Icon--SortLines { content: "\E9D0"; } +@mixin ms-Icon--Ribbon { content: "\E9D1"; } +@mixin ms-Icon--CheckList { content: "\E9D5"; } +@mixin ms-Icon--Generate { content: "\E9DA"; } +@mixin ms-Icon--Equalizer { content: "\E9E9"; } +@mixin ms-Icon--BarChartHorizontal { content: "\E9EB"; } +@mixin ms-Icon--Freezing { content: "\E9EF"; } +@mixin ms-Icon--SnowShowerDay { content: "\E9FD"; } +@mixin ms-Icon--HailDay { content: "\EA00"; } +@mixin ms-Icon--WorkFlow { content: "\EA01"; } +@mixin ms-Icon--StoreLogoMed { content: "\EA04"; } +@mixin ms-Icon--RainShowersNight { content: "\EA0F"; } +@mixin ms-Icon--SnowShowerNight { content: "\EA11"; } +@mixin ms-Icon--HailNight { content: "\EA13"; } +@mixin ms-Icon--Info2 { content: "\EA1F"; } +@mixin ms-Icon--StoreLogo { content: "\EA96"; } +@mixin ms-Icon--MultiSelectMirrored { content: "\EA98"; } +@mixin ms-Icon--Broom { content: "\EA99"; } +@mixin ms-Icon--MusicInCollectionFill { content: "\EA36"; } +@mixin ms-Icon--List { content: "\EA37"; } +@mixin ms-Icon--Asterisk { content: "\EA38"; } +@mixin ms-Icon--ErrorBadge { content: "\EA39"; } +@mixin ms-Icon--CircleRing { content: "\EA3A"; } +@mixin ms-Icon--CircleFill { content: "\EA3B"; } +@mixin ms-Icon--BookmarksMirrored { content: "\EA41"; } +@mixin ms-Icon--BulletedListMirrored { content: "\EA42"; } +@mixin ms-Icon--CaretHollowMirrored { content: "\EA45"; } +@mixin ms-Icon--CaretSolidMirrored { content: "\EA46"; } +@mixin ms-Icon--ChromeBackMirrored { content: "\EA47"; } +@mixin ms-Icon--ClosePaneMirrored { content: "\EA49"; } +@mixin ms-Icon--DockLeftMirrored { content: "\EA4C"; } +@mixin ms-Icon--DoubleChevronLeftMedMirrored { content: "\EA4D"; } +@mixin ms-Icon--HelpMirrored { content: "\EA51"; } +@mixin ms-Icon--ListMirrored { content: "\EA55"; } +@mixin ms-Icon--MailForwardMirrored { content: "\EA56"; } +@mixin ms-Icon--MailReplyMirrored { content: "\EA57"; } +@mixin ms-Icon--MailReplyAllMirrored { content: "\EA58"; } +@mixin ms-Icon--OpenPaneMirrored { content: "\EA5B"; } +@mixin ms-Icon--SendMirrored { content: "\EA63"; } +@mixin ms-Icon--ShowResultsMirrored { content: "\EA65"; } +@mixin ms-Icon--ThumbnailViewMirrored { content: "\EA67"; } +@mixin ms-Icon--Lightbulb { content: "\EA80"; } +@mixin ms-Icon--StatusTriangle { content: "\EA82"; } +@mixin ms-Icon--VolumeDisabled { content: "\EA85"; } +@mixin ms-Icon--Puzzle { content: "\EA86"; } +@mixin ms-Icon--EmojiNeutral { content: "\EA87"; } +@mixin ms-Icon--EmojiDisappointed { content: "\EA88"; } +@mixin ms-Icon--HomeSolid { content: "\EA8A"; } +@mixin ms-Icon--Cocktails { content: "\EA9D"; } +@mixin ms-Icon--Articles { content: "\EAC1"; } +@mixin ms-Icon--Cycling { content: "\EAC7"; } +@mixin ms-Icon--DietPlanNotebook { content: "\EAC8"; } +@mixin ms-Icon--Pill { content: "\EACB"; } +@mixin ms-Icon--Running { content: "\EADA"; } +@mixin ms-Icon--Weights { content: "\EADB"; } +@mixin ms-Icon--BarChart4 { content: "\EAE7"; } +@mixin ms-Icon--CirclePlus { content: "\EAEE"; } +@mixin ms-Icon--Coffee { content: "\EAEF"; } +@mixin ms-Icon--Cotton { content: "\EAF3"; } +@mixin ms-Icon--Market { content: "\EAFC"; } +@mixin ms-Icon--Money { content: "\EAFD"; } +@mixin ms-Icon--PieDouble { content: "\EB04"; } +@mixin ms-Icon--RemoveFilter { content: "\EB08"; } +@mixin ms-Icon--StockDown { content: "\EB0F"; } +@mixin ms-Icon--StockUp { content: "\EB11"; } +@mixin ms-Icon--Cricket { content: "\EB1E"; } +@mixin ms-Icon--Golf { content: "\EB1F"; } +@mixin ms-Icon--Baseball { content: "\EB20"; } +@mixin ms-Icon--Soccer { content: "\EB21"; } +@mixin ms-Icon--MoreSports { content: "\EB22"; } +@mixin ms-Icon--AutoRacing { content: "\EB24"; } +@mixin ms-Icon--CollegeHoops { content: "\EB25"; } +@mixin ms-Icon--CollegeFootball { content: "\EB26"; } +@mixin ms-Icon--ProFootball { content: "\EB27"; } +@mixin ms-Icon--ProHockey { content: "\EB28"; } +@mixin ms-Icon--Rugby { content: "\EB2D"; } +@mixin ms-Icon--Tennis { content: "\EB33"; } +@mixin ms-Icon--Arrivals { content: "\EB34"; } +@mixin ms-Icon--Design { content: "\EB3C"; } +@mixin ms-Icon--Website { content: "\EB41"; } +@mixin ms-Icon--Drop { content: "\EB42"; } +@mixin ms-Icon--Snow { content: "\EB46"; } +@mixin ms-Icon--BusSolid { content: "\EB47"; } +@mixin ms-Icon--FerrySolid { content: "\EB48"; } +@mixin ms-Icon--TrainSolid { content: "\EB4D"; } +@mixin ms-Icon--Heart { content: "\EB51"; } +@mixin ms-Icon--HeartFill { content: "\EB52"; } +@mixin ms-Icon--Ticket { content: "\EB54"; } +@mixin ms-Icon--AzureLogo { content: "\EB6A"; } +@mixin ms-Icon--BingLogo { content: "\EB6B"; } +@mixin ms-Icon--MSNLogo { content: "\EB6C"; } +@mixin ms-Icon--OutlookLogo { content: "\EB6D"; } +@mixin ms-Icon--OfficeLogo { content: "\EB6E"; } +@mixin ms-Icon--SkypeLogo { content: "\EB6F"; } +@mixin ms-Icon--Door { content: "\EB75"; } +@mixin ms-Icon--EditMirrored { content: "\EB7E"; } +@mixin ms-Icon--GiftCard { content: "\EB8E"; } +@mixin ms-Icon--DoubleBookmark { content: "\EB8F"; } +@mixin ms-Icon--StatusErrorFull { content: "\EB90"; } +@mixin ms-Icon--Certificate { content: "\EB95"; } +@mixin ms-Icon--Photo2 { content: "\EB9F"; } +@mixin ms-Icon--CloudDownload { content: "\EBD3"; } +@mixin ms-Icon--WindDirection { content: "\EBE6"; } +@mixin ms-Icon--Family { content: "\EBDA"; } +@mixin ms-Icon--CSS { content: "\EBEF"; } +@mixin ms-Icon--JS { content: "\EBF0"; } +@mixin ms-Icon--ReminderGroup { content: "\EBF8"; } +@mixin ms-Icon--Section { content: "\EC0C"; } +@mixin ms-Icon--OneNoteLogo { content: "\EC0D"; } +@mixin ms-Icon--ToggleFilled { content: "\EC11"; } +@mixin ms-Icon--ToggleBorder { content: "\EC12"; } +@mixin ms-Icon--SliderThumb { content: "\EC13"; } +@mixin ms-Icon--ToggleThumb { content: "\EC14"; } +@mixin ms-Icon--Documentation { content: "\EC17"; } +@mixin ms-Icon--Badge { content: "\EC1B"; } +@mixin ms-Icon--Giftbox { content: "\EC1F"; } +@mixin ms-Icon--ExcelLogo { content: "\EC28"; } +@mixin ms-Icon--WordLogo { content: "\EC29"; } +@mixin ms-Icon--PowerPointLogo { content: "\EC2A"; } +@mixin ms-Icon--Cafe { content: "\EC32"; } +@mixin ms-Icon--SpeedHigh { content: "\EC4A"; } +@mixin ms-Icon--MusicNote { content: "\EC4F"; } +@mixin ms-Icon--EdgeLogo { content: "\EC60"; } +@mixin ms-Icon--CompletedSolid { content: "\EC61"; } +@mixin ms-Icon--AlbumRemove { content: "\EC62"; } +@mixin ms-Icon--MessageFill { content: "\EC70"; } +@mixin ms-Icon--TabletSelected { content: "\EC74"; } +@mixin ms-Icon--MobileSelected { content: "\EC75"; } +@mixin ms-Icon--LaptopSelected { content: "\EC76"; } +@mixin ms-Icon--TVMonitorSelected { content: "\EC77"; } +@mixin ms-Icon--DeveloperTools { content: "\EC7A"; } +@mixin ms-Icon--InsertTextBox { content: "\EC7D"; } +@mixin ms-Icon--LowerBrightness { content: "\EC8A"; } +@mixin ms-Icon--CloudUpload { content: "\EC8E"; } +@mixin ms-Icon--DateTime { content: "\EC92"; } +@mixin ms-Icon--Event { content: "\ECA3"; } +@mixin ms-Icon--Cake { content: "\ECA4"; } +@mixin ms-Icon--Tiles { content: "\ECA5"; } +@mixin ms-Icon--Org { content: "\ECA6"; } +@mixin ms-Icon--PartyLeader { content: "\ECA7"; } +@mixin ms-Icon--DRM { content: "\ECA8"; } +@mixin ms-Icon--CloudAdd { content: "\ECA9"; } +@mixin ms-Icon--AppIconDefault { content: "\ECAA"; } +@mixin ms-Icon--Photo2Add { content: "\ECAB"; } +@mixin ms-Icon--Photo2Remove { content: "\ECAC"; } +@mixin ms-Icon--POI { content: "\ECAF"; } +@mixin ms-Icon--FacebookLogo { content: "\ECB3"; } +@mixin ms-Icon--AddTo { content: "\ECC8"; } +@mixin ms-Icon--RadioBtnOn { content: "\ECCB"; } +@mixin ms-Icon--Embed { content: "\ECCE"; } +@mixin ms-Icon--VideoSolid { content: "\EA0C"; } +@mixin ms-Icon--Teamwork { content: "\EA12"; } +@mixin ms-Icon--PeopleAdd { content: "\EA15"; } +@mixin ms-Icon--Glasses { content: "\EA16"; } +@mixin ms-Icon--DateTime2 { content: "\EA17"; } +@mixin ms-Icon--Shield { content: "\EA18"; } +@mixin ms-Icon--Header1 { content: "\EA19"; } +@mixin ms-Icon--PageAdd { content: "\EA1A"; } +@mixin ms-Icon--NumberedList { content: "\EA1C"; } +@mixin ms-Icon--PowerBILogo { content: "\EA1E"; } +@mixin ms-Icon--Product { content: "\ECDC"; } +@mixin ms-Icon--Blocked2 { content: "\ECE4"; } +@mixin ms-Icon--FangBody { content: "\ECEB"; } +@mixin ms-Icon--Glimmer { content: "\ECF4"; } +@mixin ms-Icon--ChatInviteFriend { content: "\ECFE"; } +@mixin ms-Icon--SharepointLogo { content: "\ED18"; } +@mixin ms-Icon--YammerLogo { content: "\ED19"; } +@mixin ms-Icon--ReturnToSession { content: "\ED24"; } +@mixin ms-Icon--OpenFolderHorizontal { content: "\ED25"; } +@mixin ms-Icon--CalendarMirrored { content: "\ED28"; } +@mixin ms-Icon--SwayLogo { content: "\ED29"; } +@mixin ms-Icon--OutOfOffice { content: "\ED34"; } +@mixin ms-Icon--Trophy { content: "\ED3F"; } +@mixin ms-Icon--ReopenPages { content: "\ED50"; } +@mixin ms-Icon--AADLogo { content: "\ED68"; } +@mixin ms-Icon--AccessLogo { content: "\ED69"; } +@mixin ms-Icon--AdminALogo { content: "\ED6A"; } +@mixin ms-Icon--AdminCLogo { content: "\ED6B"; } +@mixin ms-Icon--AdminDLogo { content: "\ED6C"; } +@mixin ms-Icon--AdminELogo { content: "\ED6D"; } +@mixin ms-Icon--AdminLLogo { content: "\ED6E"; } +@mixin ms-Icon--AdminMLogo { content: "\ED6F"; } +@mixin ms-Icon--AdminOLogo { content: "\ED70"; } +@mixin ms-Icon--AdminPLogo { content: "\ED71"; } +@mixin ms-Icon--AdminSLogo { content: "\ED72"; } +@mixin ms-Icon--AdminYLogo { content: "\ED73"; } +@mixin ms-Icon--AlchemyLogo { content: "\ED74"; } +@mixin ms-Icon--BoxLogo { content: "\ED75"; } +@mixin ms-Icon--DelveLogo { content: "\ED76"; } +@mixin ms-Icon--DropboxLogo { content: "\ED77"; } +@mixin ms-Icon--ExchangeLogo { content: "\ED78"; } +@mixin ms-Icon--LyncLogo { content: "\ED79"; } +@mixin ms-Icon--OfficeVideoLogo { content: "\ED7A"; } +@mixin ms-Icon--ParatureLogo { content: "\ED7B"; } +@mixin ms-Icon--SocialListeningLogo { content: "\ED7C"; } +@mixin ms-Icon--VisioLogo { content: "\ED7D"; } +@mixin ms-Icon--Balloons { content: "\ED7E"; } +@mixin ms-Icon--Cat { content: "\ED7F"; } +@mixin ms-Icon--MailAlert { content: "\ED80"; } +@mixin ms-Icon--MailCheck { content: "\ED81"; } +@mixin ms-Icon--MailLowImportance { content: "\ED82"; } +@mixin ms-Icon--MailPause { content: "\ED83"; } +@mixin ms-Icon--MailRepeat { content: "\ED84"; } +@mixin ms-Icon--SecurityGroup { content: "\ED85"; } +@mixin ms-Icon--Table { content: "\ED86"; } +@mixin ms-Icon--VoicemailForward { content: "\ED87"; } +@mixin ms-Icon--VoicemailReply { content: "\ED88"; } +@mixin ms-Icon--Waffle { content: "\ED89"; } +@mixin ms-Icon--RemoveEvent { content: "\ED8A"; } +@mixin ms-Icon--EventInfo { content: "\ED8B"; } +@mixin ms-Icon--ForwardEvent { content: "\ED8C"; } +@mixin ms-Icon--WipePhone { content: "\ED8D"; } +@mixin ms-Icon--AddOnlineMeeting { content: "\ED8E"; } +@mixin ms-Icon--JoinOnlineMeeting { content: "\ED8F"; } +@mixin ms-Icon--RemoveLink { content: "\ED90"; } +@mixin ms-Icon--PeopleBlock { content: "\ED91"; } +@mixin ms-Icon--PeopleRepeat { content: "\ED92"; } +@mixin ms-Icon--PeopleAlert { content: "\ED93"; } +@mixin ms-Icon--PeoplePause { content: "\ED94"; } +@mixin ms-Icon--TransferCall { content: "\ED95"; } +@mixin ms-Icon--AddPhone { content: "\ED96"; } +@mixin ms-Icon--UnknownCall { content: "\ED97"; } +@mixin ms-Icon--NoteReply { content: "\ED98"; } +@mixin ms-Icon--NoteForward { content: "\ED99"; } +@mixin ms-Icon--NotePinned { content: "\ED9A"; } +@mixin ms-Icon--RemoveOccurrence { content: "\ED9B"; } +@mixin ms-Icon--Timeline { content: "\ED9C"; } +@mixin ms-Icon--EditNote { content: "\ED9D"; } +@mixin ms-Icon--CircleHalfFull { content: "\ED9E"; } +@mixin ms-Icon--Room { content: "\ED9F"; } +@mixin ms-Icon--Unsubscribe { content: "\EDA0"; } +@mixin ms-Icon--Subscribe { content: "\EDA1"; } +@mixin ms-Icon--RecurringTask { content: "\EDB2"; } +@mixin ms-Icon--TaskManager { content: "\EDB7"; } +@mixin ms-Icon--TaskManagerMirrored { content: "\EDB8"; } +@mixin ms-Icon--Combine { content: "\EDBB"; } +@mixin ms-Icon--Split { content: "\EDBC"; } +@mixin ms-Icon--DoubleChevronUp { content: "\EDBD"; } +@mixin ms-Icon--DoubleChevronLeft { content: "\EDBE"; } +@mixin ms-Icon--DoubleChevronRight { content: "\EDBF"; } +@mixin ms-Icon--Ascending { content: "\EDC0"; } +@mixin ms-Icon--Descending { content: "\EDC1"; } +@mixin ms-Icon--TextBox { content: "\EDC2"; } +@mixin ms-Icon--TextField { content: "\EDC3"; } +@mixin ms-Icon--NumberField { content: "\EDC4"; } +@mixin ms-Icon--Dropdown { content: "\EDC5"; } +@mixin ms-Icon--BookingsLogo { content: "\EDC7"; } +@mixin ms-Icon--ClassNotebookLogo { content: "\EDC8"; } +@mixin ms-Icon--CollabsDBLogo { content: "\EDC9"; } +@mixin ms-Icon--DelveAnalyticsLogo { content: "\EDCA"; } +@mixin ms-Icon--DocsLogo { content: "\EDCB"; } +@mixin ms-Icon--DynamicsCRMLogo { content: "\EDCC"; } +@mixin ms-Icon--DynamicSMBLogo { content: "\EDCD"; } +@mixin ms-Icon--OfficeAssistantLogo { content: "\EDCE"; } +@mixin ms-Icon--OfficeStoreLogo { content: "\EDCF"; } +@mixin ms-Icon--OneNoteEduLogo { content: "\EDD0"; } +@mixin ms-Icon--Planner { content: "\EDD1"; } +@mixin ms-Icon--PowerApps { content: "\EDD2"; } +@mixin ms-Icon--Suitcase { content: "\EDD3"; } +@mixin ms-Icon--ProjectLogo { content: "\EDD4"; } +@mixin ms-Icon--CaretLeft8 { content: "\EDD5"; } +@mixin ms-Icon--CaretRight8 { content: "\EDD6"; } +@mixin ms-Icon--CaretUp8 { content: "\EDD7"; } +@mixin ms-Icon--CaretDown8 { content: "\EDD8"; } +@mixin ms-Icon--CaretLeftSolid8 { content: "\EDD9"; } +@mixin ms-Icon--CarotRightSolid8 { content: "\EDDA"; } +@mixin ms-Icon--CaretUpSolid8 { content: "\EDDB"; } +@mixin ms-Icon--CaretDownSolid8 { content: "\EDDC"; } +@mixin ms-Icon--ClearFormatting { content: "\EDDD"; } +@mixin ms-Icon--Superscript { content: "\EDDE"; } +@mixin ms-Icon--Subscript { content: "\EDDF"; } +@mixin ms-Icon--Strikethrough { content: "\EDE0"; } +@mixin ms-Icon--SingleBookmark { content: "\EDFF"; } +@mixin ms-Icon--DoubleChevronDown { content: "\EE04"; } +@mixin ms-Icon--ReplyAll { content: "\EE0A"; } +@mixin ms-Icon--GoogleDriveLogo { content: "\EE0B"; } +@mixin ms-Icon--Questionnaire { content: "\EE19"; } +@mixin ms-Icon--ReplyMirrored { content: "\EE35"; } +@mixin ms-Icon--ReplyAllMirrored { content: "\EE36"; } +@mixin ms-Icon--AddGroup { content: "\EE3D"; } +@mixin ms-Icon--QuestionnaireMirrored { content: "\EE4B"; } +@mixin ms-Icon--TemporaryUser { content: "\EE58"; } +@mixin ms-Icon--GroupedDescending { content: "\EE66"; } +@mixin ms-Icon--GroupedAscending { content: "\EE67"; } +@mixin ms-Icon--SortUp { content: "\EE68"; } +@mixin ms-Icon--SortDown { content: "\EE69"; } +@mixin ms-Icon--AwayStatus { content: "\EE6A"; } +@mixin ms-Icon--SyncToPC { content: "\EE6E"; } +@mixin ms-Icon--AustralianRules { content: "\EE70"; } +@mixin ms-Icon--DateTimeMirrored { content: "\EE93"; } +@mixin ms-Icon--DoubleChevronUp12 { content: "\EE96"; } +@mixin ms-Icon--DoubleChevronDown12 { content: "\EE97"; } +@mixin ms-Icon--DoubleChevronLeft12 { content: "\EE98"; } +@mixin ms-Icon--DoubleChevronRight12 { content: "\EE99"; } +@mixin ms-Icon--CalendarAgenda { content: "\EE9A"; } +@mixin ms-Icon--AddEvent { content: "\EEB5"; } +@mixin ms-Icon--AssetLibrary { content: "\EEB6"; } +@mixin ms-Icon--DataConnectionLibrary { content: "\EEB7"; } +@mixin ms-Icon--DocLibrary { content: "\EEB8"; } +@mixin ms-Icon--FormLibrary { content: "\EEB9"; } +@mixin ms-Icon--FormLibraryMirrored { content: "\EEBA"; } +@mixin ms-Icon--ReportLibrary { content: "\EEBB"; } +@mixin ms-Icon--ReportLibraryMirrored { content: "\EEBC"; } +@mixin ms-Icon--ContactCard { content: "\EEBD"; } +@mixin ms-Icon--CustomList { content: "\EEBE"; } +@mixin ms-Icon--CustomListMirrored { content: "\EEBF"; } +@mixin ms-Icon--IssueTracking { content: "\EEC0"; } +@mixin ms-Icon--IssueTrackingMirrored { content: "\EEC1"; } +@mixin ms-Icon--PictureLibrary { content: "\EEC2"; } +@mixin ms-Icon--AppForOfficeLogo { content: "\EEC7"; } +@mixin ms-Icon--OfflineOneDriveParachute { content: "\EEC8"; } +@mixin ms-Icon--OfflineOneDriveParachuteDisabled { content: "\EEC9"; } +@mixin ms-Icon--LargeGrid { content: "\EECB"; } +@mixin ms-Icon--TriangleSolidUp12 { content: "\EECC"; } +@mixin ms-Icon--TriangleSolidDown12 { content: "\EECD"; } +@mixin ms-Icon--TriangleSolidLeft12 { content: "\EECE"; } +@mixin ms-Icon--TriangleSolidRight12 { content: "\EECF"; } +@mixin ms-Icon--TriangleUp12 { content: "\EED0"; } +@mixin ms-Icon--TriangleDown12 { content: "\EED1"; } +@mixin ms-Icon--TriangleLeft12 { content: "\EED2"; } +@mixin ms-Icon--TriangleRight12 { content: "\EED3"; } +@mixin ms-Icon--ArrowUpRight8 { content: "\EED4"; } +@mixin ms-Icon--ArrowDownRight8 { content: "\EED5"; } +@mixin ms-Icon--DocumentSet { content: "\EED6"; } +@mixin ms-Icon--DelveAnalytics { content: "\EEEE"; } +@mixin ms-Icon--ArrowUpRightMirrored8 { content: "\EEEF"; } +@mixin ms-Icon--ArrowDownRightMirrored8 { content: "\EEF0"; } +@mixin ms-Icon--OneDriveAdd { content: "\EF32"; } +@mixin ms-Icon--Header2 { content: "\EF36"; } +@mixin ms-Icon--Header3 { content: "\EF37"; } +@mixin ms-Icon--Header4 { content: "\EF38"; } +@mixin ms-Icon--MarketDown { content: "\EF42"; } +@mixin ms-Icon--CalendarWorkWeek { content: "\EF51"; } +@mixin ms-Icon--SidePanel { content: "\EF52"; } +@mixin ms-Icon--GlobeFavorite { content: "\EF53"; } +@mixin ms-Icon--CaretTopLeftSolid8 { content: "\EF54"; } +@mixin ms-Icon--CaretTopRightSolid8 { content: "\EF55"; } +@mixin ms-Icon--ViewAll2 { content: "\EF56"; } +@mixin ms-Icon--DocumentReply { content: "\EF57"; } +@mixin ms-Icon--PlayerSettings { content: "\EF58"; } +@mixin ms-Icon--ReceiptForward { content: "\EF59"; } +@mixin ms-Icon--ReceiptReply { content: "\EF5A"; } +@mixin ms-Icon--ReceiptCheck { content: "\EF5B"; } +@mixin ms-Icon--Fax { content: "\EF5C"; } +@mixin ms-Icon--RecurringEvent { content: "\EF5D"; } +@mixin ms-Icon--ReplyAlt { content: "\EF5E"; } +@mixin ms-Icon--ReplyAllAlt { content: "\EF5F"; } +@mixin ms-Icon--EditStyle { content: "\EF60"; } +@mixin ms-Icon--EditMail { content: "\EF61"; } +@mixin ms-Icon--Lifesaver { content: "\EF62"; } +@mixin ms-Icon--LifesaverLock { content: "\EF63"; } +@mixin ms-Icon--InboxCheck { content: "\EF64"; } +@mixin ms-Icon--FolderSearch { content: "\EF65"; } +@mixin ms-Icon--CollapseMenu { content: "\EF66"; } +@mixin ms-Icon--ExpandMenu { content: "\EF67"; } +@mixin ms-Icon--Boards { content: "\EF68"; } +@mixin ms-Icon--SunAdd { content: "\EF69"; } +@mixin ms-Icon--SunQuestionMark { content: "\EF6A"; } +@mixin ms-Icon--LandscapeOrientation { content: "\EF6B"; } +@mixin ms-Icon--DocumentSearch { content: "\EF6C"; } +@mixin ms-Icon--PublicCalendar { content: "\EF6D"; } +@mixin ms-Icon--PublicContactCard { content: "\EF6E"; } +@mixin ms-Icon--PublicEmail { content: "\EF6F"; } +@mixin ms-Icon--PublicFolder { content: "\EF70"; } +@mixin ms-Icon--WordDocument { content: "\EF71"; } +@mixin ms-Icon--PowerPointDocument { content: "\EF72"; } +@mixin ms-Icon--ExcelDocument { content: "\EF73"; } +@mixin ms-Icon--GroupedList { content: "\EF74"; } +@mixin ms-Icon--ClassroomLogo { content: "\EF75"; } +@mixin ms-Icon--Sections { content: "\EF76"; } +@mixin ms-Icon--EditPhoto { content: "\EF77"; } +@mixin ms-Icon--Starburst { content: "\EF78"; } +@mixin ms-Icon--ShareiOS { content: "\EF79"; } +@mixin ms-Icon--AirTickets { content: "\EF7A"; } +@mixin ms-Icon--PencilReply { content: "\EF7B"; } +@mixin ms-Icon--Tiles2 { content: "\EF7C"; } +@mixin ms-Icon--SkypeCircleCheck { content: "\EF7D"; } +@mixin ms-Icon--SkypeCircleClock { content: "\EF7E"; } +@mixin ms-Icon--SkypeCircleMinus { content: "\EF7F"; } +@mixin ms-Icon--SkypeCheck { content: "\EF80"; } +@mixin ms-Icon--SkypeClock { content: "\EF81"; } +@mixin ms-Icon--SkypeMinus { content: "\EF82"; } +@mixin ms-Icon--SkypeMessage { content: "\EF83"; } +@mixin ms-Icon--ClosedCaption { content: "\EF84"; } +@mixin ms-Icon--ATPLogo { content: "\EF85"; } +@mixin ms-Icon--OfficeFormLogo { content: "\EF86"; } +@mixin ms-Icon--RecycleBin { content: "\EF87"; } +@mixin ms-Icon--EmptyRecycleBin { content: "\EF88"; } +@mixin ms-Icon--Hide2 { content: "\EF89"; } +@mixin ms-Icon--iOSAppStoreLogo { content: "\EF8A"; } +@mixin ms-Icon--AndroidLogo { content: "\EF8B"; } +@mixin ms-Icon--Breadcrumb { content: "\EF8C"; } +@mixin ms-Icon--ClearFilter { content: "\EF8F"; } +@mixin ms-Icon--Flow { content: "\EF90"; } +@mixin ms-Icon--PowerAppsLogo { content: "\F091"; } +@mixin ms-Icon--PowerApps2Logo { content: "\F092"; } + + +// Modifier: Place the icon in a circle. +@mixin ms-Icon--circle { + position: relative; + display: inline-block; + font-size: 1rem; + width: 1em; + height: 1em; + margin: 0 0.5em 0 0; + padding: 0; + text-align: left; + -webkit-font-smoothing: antialiased; + + &::before, &::after { + line-height: 1; + font-size: inherit; + } + + &::before { + display: block; + width: 100%; + height: 100%; + margin: 0; + padding: 0; + vertical-align: top; + position: absolute; + } + + &::after { + content: '\e000'; + position: absolute; + top: 0; + left: 0; + transform: scale(2); + transform-origin: 50% 50%; + z-index: $ms-zIndex-back; + } +} + +// Icon size variables +$ms-icon-size-xs: 10px; +$ms-icon-size-s: 12px; +$ms-icon-size-m: 16px; +$ms-icon-size-l: 20px; + +// Icon size mixins +@mixin ms-Icon--xs { font-size: $ms-icon-size-xs; } +@mixin ms-Icon--s { font-size: $ms-icon-size-s; } +@mixin ms-Icon--m { font-size: $ms-icon-size-m; } +@mixin ms-Icon--l { font-size: $ms-icon-size-l; } diff --git a/dist/sass/_Fabric.Mixins.RTL.scss b/dist/sass/_Fabric.Mixins.RTL.scss new file mode 100644 index 000000000..daec15d09 --- /dev/null +++ b/dist/sass/_Fabric.Mixins.RTL.scss @@ -0,0 +1,325 @@ +// Copyright (c) Microsoft. All rights reserved. Licensed under the MIT license. See LICENSE in the project root for license information. + +// +// Office UI Fabric +// -------------------------------------------------- +// Internationalization mixins + + +// Base left-to-right mixin definition. +@mixin LTR { + [dir='ltr'] & { + @content; + } +} + +// Base right-to-left mixin definition. +@mixin RTL { + [dir='rtl'] & { + @content; + } +} + +// Use baseRTL on a root element (e.g. page or region) that needs RTL support. +@mixin baseRtl { + @include RTL { + direction: rtl; + unicode-bidi: bidi-override; + } +} + + +// Common CSS property mixins with support for RTL. +// Use to automatically create RTL versions of your properties. + +// Border styles. +@mixin border-color($top, $right, $bottom, $left) { + border-color: $top $right $bottom $left; + + @include RTL { + border-color: $top $left $bottom $right; + } +} + +@mixin border-left($width, $style, $color) { + @include LTR { + border-left: $width $style $color; + } + + @include RTL { + border-right: $width $style $color; + } +} + +@mixin border-left-color($color) { + @include LTR { + border-left-color: $color; + } + + @include RTL { + border-right-color: $color; + } +} + +@mixin border-left-style($style) { + @include LTR { + border-left-style: $style; + } + + @include RTL { + border-right-style: $style; + } +} + +@mixin border-left-width($width) { + @include LTR { + border-left-width: $width; + } + + @include RTL { + border-right-width: $width; + } +} + +@mixin border-radius($topLeft, $topRight, $bottomRight, $bottomLeft) { + border-radius: $topLeft $topRight $bottomRight $bottomLeft; + + @include RTL { + border-radius: $topRight $topLeft $bottomLeft $bottomRight; + } +} + +@mixin border-right($width, $style, $color) { + @include LTR { + border-right: $width $style $color; + } + + @include RTL { + border-left: $width $style $color; + } +} + +@mixin border-right-color($color) { + @include LTR { + border-right-color: $color; + } + + @include RTL { + border-left-color: $color; + } +} + +@mixin border-right-style($style) { + @include LTR { + border-right-style: $style; + } + + @include RTL { + border-left-style: $style; + } +} + +@mixin border-right-width($width) { + @include LTR { + border-right-width: $width; + } + + @include RTL { + border-left-width: $width; + } +} + +// Floats. +@mixin clear($side) { + @if $side == left { + @include LTR { + clear: $side; + } + + @include RTL { + clear: right; + } + } @else if $side == right { + @include LTR { + clear: $side; + } + + @include RTL { + clear: left; + } + } @else { + clear: $side; + } +} + +@mixin float($direction) { + @if $direction == left { + @include LTR { + float: left; + } + + @include RTL { + float: right; + } + } @else { + @include LTR { + float: right; + } + + @include RTL { + float: left; + } + } +} + +// Positioning. +@mixin left($distance) { + @include LTR { + left: $distance; + } + + @include RTL { + right: $distance; + } +} + +@mixin right($distance) { + @include LTR { + right: $distance; + } + + @include RTL { + left: $distance; + } +} + +// Margins. +@mixin margin($top, $right, $bottom, $left) { + margin: $top $right $bottom $left; + + @include RTL { + margin: $top $left $bottom $right; + } +} + +@mixin margin-left($distance) { + @include LTR { + margin-left: $distance; + } + + @include RTL { + margin-right: $distance; + } +} + +@mixin margin-right($distance) { + @include LTR { + margin-right: $distance; + } + @include RTL { + margin-left: $distance; + } +} + +// Padding. +@mixin padding($top, $right, $bottom, $left) { + padding: $top $right $bottom $left; + + @include RTL { + padding: $top $left $bottom $right; + } +} + +@mixin padding-left($distance) { + @include LTR { + padding-left: $distance; + } + + @include RTL { + padding-right: $distance; + } +} + +@mixin padding-right($distance) { + @include LTR { + padding-right: $distance; + } + + @include RTL { + padding-left: $distance; + } +} + +// Text-alignment. +@mixin text-align($direction) { + @if $direction == left { + @include LTR { + text-align: left; + } + + @include RTL { + text-align: right; + } + } @else { + @include LTR { + text-align: right; + } + + @include RTL { + text-align: left; + } + } +} + +// Box-shadow. +@mixin box-shadow($left, $etc) { + @include LTR { + box-shadow: $left $etc; + } + + @include RTL { + box-shadow: -$left $etc; + } +} + +// Transforms. +@mixin transform-scaleX($scaleX: 1) { + @include LTR { + transform: scaleX($scaleX); + } + + @include RTL { + transform: scaleX(-$scaleX); + } +} + +@mixin transform-translateX($distance) { + @include LTR { + transform: translateX($distance); + } + + @include RTL { + transform: translateX(-$distance); + } +} + +// Transitions. Only supported when ONLY left/right are declared +@mixin transition-property($direction) { + @if $direction == left { + @include LTR { + transition-property: left; + } + + @include RTL { + transition-property: right; + } + } @else { + @include LTR { + transition-property: right; + } + + @include RTL { + transition-property: left; + } + } +} \ No newline at end of file diff --git a/dist/sass/_Fabric.Mixins.scss b/dist/sass/_Fabric.Mixins.scss new file mode 100644 index 000000000..fa32804af --- /dev/null +++ b/dist/sass/_Fabric.Mixins.scss @@ -0,0 +1,282 @@ +// Copyright (c) Microsoft. All rights reserved. Licensed under the MIT license. See LICENSE in the project root for license information. + +// +// Office UI Fabric +// -------------------------------------------------- +// Vendor-prefixed mixins + + +// Border radius. +@mixin border-radius($ms-radius: 5px) { + border-radius: $ms-radius; + background-clip: padding-box; +} + +// Drop shadow. +@mixin drop-shadow($ms-x-offset: 0, $ms-y-offset: 0, $ms-blur: 5px, $ms-spread: 0, $ms-alpha: 0.4) { + box-shadow: $ms-x-offset $ms-y-offset $ms-blur $ms-spread rgba(0, 0, 0, $ms-alpha); +} + +// Background gradient. +@mixin background-gradient($ms-origin: left, $ms-start: #000, $ms-start-location: 0%, $ms-stop: #FFF, $ms-stop-location: 100%) { + background-color: $ms-start; + background-image: linear-gradient($ms-origin, $ms-start $ms-start-location, $ms-stop $ms-stop-location); +} + +// Rotation. +@mixin rotate($ms-deg) { + transform: rotate($ms-deg); +} + +// Reset button styles. +@mixin button-reset() { + background: none; + border: 0; + cursor: pointer; +} + +@mixin resetAnimation() { + -webkit-animation: none; + -moz-animation: none; + -ms-animation: none; + -o-animation: none; + animation: none; +} + +@mixin resetBackface() { + backface-visibility: visible; +} + +@mixin resetBackground() { + background: 0; + background-clip: border-box; + background-origin: padding-box; +} + +@mixin resetBorder() { + border: 0; + border-collapse: separate; + border-image: none; + border-radius: 0; + border-spacing: 0; +} + +@mixin resetBoxShadow() { + -webkit-box-shadow: none; + -moz-box-shadow: none; + box-shadow: none; +} + +@mixin resetBoxSizing() { + box-sizing: content-box; +} + +@mixin resetColumns() { + columns: auto; + column-count: auto; + column-fill: balance; + column-gap: normal; + column-rule: medium none currentColor; + column-rule-color: currentColor; + column-rule-style: none; + column-rule-width: none; + column-span: 1; + column-width: auto; +} + + +// Fonts and Typography Resets +@mixin resetFont() { + font: normal; + font-family: inherit; + font-size: normal; + font-style: normal; + font-variant: normal; + font-weight: normal; +} + +@mixin resetTextStyling() { + text-align: inherit; + text-align-last: auto; + text-decoration: none; + text-decoration-color: inherit; + text-decoration-line: none; + text-decoration-style: solid; + text-indent: 0; + text-shadow: none; + text-transform: none; + line-height: normal; + letter-spacing: normal; + word-spacing: normal; +} + + +// Box Model Resets +@mixin resetPadding() { + padding: 0; +} + +@mixin resetMargins() { + margin: 0; +} + +@mixin resetOverflow() { + overflow: visible; +} + +@mixin resetMax() { + max-height: none; + max-width: none; +} + +@mixin resetMin() { + min-height: 0; + min-width: 0; +} + +@mixin resetPositioning() { + bottom: auto; + left: auto; + top: auto; + left: auto; +} + +@mixin resetFloat() { + float: none; +} + +@mixin resetHeight($ms-useMaxMin: false) { + height: auto; + @if $ms-useMaxMin == true { + min-height: 0; + max-height: 0; + } +} + +@mixin resetWidth($ms-useMaxMin: false) { + width: auto; + @if $ms-useMaxMin == true { + min-width: 0; + max-width: 0; + } +} + +@mixin resetPosition() { + position: static; +} + +@mixin resetPerspective() { + -webkit-perspective: none; + -webkit-perspective-origin: 50% 50%; + perspective: none; + perspective-origin: 50% 50%; + +} + +@mixin resetTransition() { + -webkit-transition: none; + transition: none; +} + +@mixin resetListStyle() { + list-style: none; +} + +@mixin resetTransform() { + -ms-transform: none; + -webkit-transform: none; + -webkit-transform-style: flat; + transform: none; + transform-style: flat; +} + +@mixin resetOutline() { + outline: 0; +} + +@mixin resetPageBreak() { + page-break-after: auto; + page-break-before: auto; + page-break-inside: auto; +} + +@mixin resetDisplay() { + display: block; +} + +@mixin resetVerticalAlign() { + vertical-align: baseline; +} + +// Prevents user selection of text elements. +@mixin user-select ($val) { + -webkit-touch-callout: $val; + -webkit-user-select: $val; + -khtml-user-select: $val; + -moz-user-select: $val; + -ms-user-select: $val; + user-select: $val; +} + +// Prevents the text within a block element from wrapping to second line. +@mixin noWrap() { + display: block; + overflow: hidden; + text-overflow: ellipsis; + white-space: nowrap; +} + +// Input placehoder +@mixin input-placeholder { + &::-webkit-input-placeholder {@content} + &::-moz-placeholder {@content} + &:-moz-placeholder {@content} + &:-ms-input-placeholder {@content} +} + +// Animations +@mixin animationName($ms-name) { + -webkit-animation-name: $ms-name; + -moz-animation-name: $ms-name; + -ms-animation-name: $ms-name; + -o-animation-name: $ms-name; + animation-name: $ms-name; +} + +@mixin animationDuration($ms-duration) { + -webkit-animation-duration: $ms-duration; + -moz-animation-duration: $ms-duration; + -ms-animation-duration: $ms-duration; + -o-animation-duration: $ms-duration; +} + +@mixin animationTiming($ms-function) { + -webkit-animation-timing-function: $ms-function; + -moz-animation-timing-function: $ms-function; + -ms-animation-timing-function: $ms-function; + -o-animation-timing-function: $ms-function; + animation-timing-function: $ms-function; +} + +@mixin animationFillMode($ms-mode) { + -webkit-animation-fill-mode: $ms-mode; + -moz-animation-fill-mode: $ms-mode; + -ms-animation-fill-mode: $ms-mode; + -o-animation-fill-mode: $ms-mode; + animation-fill-mode: $ms-mode; +} + +// Flexbox +@mixin flexBox() { + display: -ms-flexbox; + display: -webkit-flex; + display: flex; +} + +@mixin alignItems($ms-mode) { + -webkit-box-align: $ms-mode; + -moz-box-align: $ms-mode; + -ms-flex-align: $ms-mode; + -webkit-align-items: $ms-mode; + align-items: $ms-mode; +} \ No newline at end of file diff --git a/dist/sass/_Fabric.Responsive.Utilities.Variables.scss b/dist/sass/_Fabric.Responsive.Utilities.Variables.scss new file mode 100644 index 000000000..ab234df8f --- /dev/null +++ b/dist/sass/_Fabric.Responsive.Utilities.Variables.scss @@ -0,0 +1,697 @@ +// Small Screens +@mixin ms-u-sm12 { + width: 100%; +} +@mixin ms-u-sm11 { + width: 91.66666666666666%; +} +@mixin ms-u-sm10 { + width: 83.33333333333334%; +} +@mixin ms-u-sm9 { + width: 75%; +} +@mixin ms-u-sm8 { + width: 66.66666666666666%; +} +@mixin ms-u-sm7 { + width: 58.333333333333336%; +} +@mixin ms-u-sm6 { + width: 50%; +} +@mixin ms-u-sm5 { + width: 41.66666666666667%; +} +@mixin ms-u-sm4 { + width: 33.33333333333333%; +} +@mixin ms-u-sm3 { + width: 25%; +} +@mixin ms-u-sm2 { + width: 16.666666666666664%; +} +@mixin ms-u-sm1 { + width: 8.333333333333332%; +} +@mixin ms-u-smPull12 { + right: 100%; +} +@mixin ms-u-smPull11 { + right: 91.66666666666666%; +} +@mixin ms-u-smPull10 { + right: 83.33333333333334%; +} +@mixin ms-u-smPull9 { + right: 75%; +} +@mixin ms-u-smPull8 { + right: 66.66666666666666%; +} +@mixin ms-u-smPull7 { + right: 58.333333333333336%; +} +@mixin ms-u-smPull6 { + right: 50%; +} +@mixin ms-u-smPull5 { + right: 41.66666666666667%; +} +@mixin ms-u-smPull4 { + right: 33.33333333333333%; +} +@mixin ms-u-smPull3 { + right: 25%; +} +@mixin ms-u-smPull2 { + right: 16.666666666666664%; +} +@mixin ms-u-smPull1 { + right: 8.333333333333332%; +} +@mixin ms-u-smPull0 { + right: auto; +} +@mixin ms-u-smPush12 { + left: 100%; +} +@mixin ms-u-smPush11 { + left: 91.66666666666666%; +} +@mixin ms-u-smPush10 { + left: 83.33333333333334%; +} +@mixin ms-u-smPush9 { + left: 75%; +} +@mixin ms-u-smPush8 { + left: 66.66666666666666%; +} +@mixin ms-u-smPush7 { + left: 58.333333333333336%; +} +@mixin ms-u-smPush6 { + left: 50%; +} +@mixin ms-u-smPush5 { + left: 41.66666666666667%; +} +@mixin ms-u-smPush4 { + left: 33.33333333333333%; +} +@mixin ms-u-smPush3 { + left: 25%; +} +@mixin ms-u-smPush2 { + left: 16.666666666666664%; +} +@mixin ms-u-smPush1 { + left: 8.333333333333332%; +} +@mixin ms-u-smPush0 { + left: auto; +} + +// Medium Screens +@mixin ms-u-md12 { +width: 100%; +} +@mixin ms-u-md11 { +width: 91.66666666666666%; +} +@mixin ms-u-md10 { +width: 83.33333333333334%; +} +@mixin ms-u-md9 { +width: 75%; +} +@mixin ms-u-md8 { +width: 66.66666666666666%; +} +@mixin ms-u-md7 { +width: 58.333333333333336%; +} +@mixin ms-u-md6 { +width: 50%; +} +@mixin ms-u-md5 { +width: 41.66666666666667%; +} +@mixin ms-u-md4 { +width: 33.33333333333333%; +} +@mixin ms-u-md3 { +width: 25%; +} +@mixin ms-u-md2 { +width: 16.666666666666664%; +} +@mixin ms-u-md1 { +width: 8.333333333333332%; +} +@mixin ms-u-mdPull12 { +right: 100%; +} +@mixin ms-u-mdPull11 { +right: 91.66666666666666%; +} +@mixin ms-u-mdPull10 { +right: 83.33333333333334%; +} +@mixin ms-u-mdPull9 { +right: 75%; +} +@mixin ms-u-mdPull8 { +right: 66.66666666666666%; +} +@mixin ms-u-mdPull7 { +right: 58.333333333333336%; +} +@mixin ms-u-mdPull6 { +right: 50%; +} +@mixin ms-u-mdPull5 { +right: 41.66666666666667%; +} +@mixin ms-u-mdPull4 { +right: 33.33333333333333%; +} +@mixin ms-u-mdPull3 { +right: 25%; +} +@mixin ms-u-mdPull2 { +right: 16.666666666666664%; +} +@mixin ms-u-mdPull1 { +right: 8.333333333333332%; +} +@mixin ms-u-mdPull0 { +right: auto; +} +@mixin ms-u-mdPush12 { +left: 100%; +} +@mixin ms-u-mdPush11 { +left: 91.66666666666666%; +} +@mixin ms-u-mdPush10 { +left: 83.33333333333334%; +} +@mixin ms-u-mdPush9 { +left: 75%; +} +@mixin ms-u-mdPush8 { +left: 66.66666666666666%; +} +@mixin ms-u-mdPush7 { +left: 58.333333333333336%; +} +@mixin ms-u-mdPush6 { +left: 50%; +} +@mixin ms-u-mdPush5 { +left: 41.66666666666667%; +} +@mixin ms-u-mdPush4 { +left: 33.33333333333333%; +} +@mixin ms-u-mdPush3 { +left: 25%; +} +@mixin ms-u-mdPush2 { +left: 16.666666666666664%; +} +@mixin ms-u-mdPush1 { +left: 8.333333333333332%; +} +@mixin ms-u-mdPush0 { +left: auto; +} + +// Large screens +@mixin ms-u-lg12 { +width: 100%; +} +@mixin ms-u-lg11 { +width: 91.66666666666666%; +} +@mixin ms-u-lg10 { +width: 83.33333333333334%; +} +@mixin ms-u-lg9 { +width: 75%; +} +@mixin ms-u-lg8 { +width: 66.66666666666666%; +} +@mixin ms-u-lg7 { +width: 58.333333333333336%; +} +@mixin ms-u-lg6 { +width: 50%; +} +@mixin ms-u-lg5 { +width: 41.66666666666667%; +} +@mixin ms-u-lg4 { +width: 33.33333333333333%; +} +@mixin ms-u-lg3 { +width: 25%; +} +@mixin ms-u-lg2 { +width: 16.666666666666664%; +} +@mixin ms-u-lg1 { +width: 8.333333333333332%; +} +@mixin ms-u-lgPull12 { +right: 100%; +} +@mixin ms-u-lgPull11 { +right: 91.66666666666666%; +} +@mixin ms-u-lgPull10 { +right: 83.33333333333334%; +} +@mixin ms-u-lgPull9 { +right: 75%; +} +@mixin ms-u-lgPull8 { +right: 66.66666666666666%; +} +@mixin ms-u-lgPull7 { +right: 58.333333333333336%; +} +@mixin ms-u-lgPull6 { +right: 50%; +} +@mixin ms-u-lgPull5 { +right: 41.66666666666667%; +} +@mixin ms-u-lgPull4 { +right: 33.33333333333333%; +} +@mixin ms-u-lgPull3 { +right: 25%; +} +@mixin ms-u-lgPull2 { +right: 16.666666666666664%; +} +@mixin ms-u-lgPull1 { +right: 8.333333333333332%; +} +@mixin ms-u-lgPull0 { +right: auto; +} +@mixin ms-u-lgPush12 { +left: 100%; +} +@mixin ms-u-lgPush11 { +left: 91.66666666666666%; +} +@mixin ms-u-lgPush10 { +left: 83.33333333333334%; +} +@mixin ms-u-lgPush9 { +left: 75%; +} +@mixin ms-u-lgPush8 { +left: 66.66666666666666%; +} +@mixin ms-u-lgPush7 { +left: 58.333333333333336%; +} +@mixin ms-u-lgPush6 { +left: 50%; +} +@mixin ms-u-lgPush5 { +left: 41.66666666666667%; +} +@mixin ms-u-lgPush4 { +left: 33.33333333333333%; +} +@mixin ms-u-lgPush3 { +left: 25%; +} +@mixin ms-u-lgPush2 { +left: 16.666666666666664%; +} +@mixin ms-u-lgPush1 { +left: 8.333333333333332%; +} +@mixin ms-u-lgPush0 { +left: auto; +} + +// Extra Large Screens +@mixin ms-u-xl12 { +width: 100%; +} +@mixin ms-u-xl11 { +width: 91.66666666666666%; +} +@mixin ms-u-xl10 { +width: 83.33333333333334%; +} +@mixin ms-u-xl9 { +width: 75%; +} +@mixin ms-u-xl8 { +width: 66.66666666666666%; +} +@mixin ms-u-xl7 { +width: 58.333333333333336%; +} +@mixin ms-u-xl6 { +width: 50%; +} +@mixin ms-u-xl5 { +width: 41.66666666666667%; +} +@mixin ms-u-xl4 { +width: 33.33333333333333%; +} +@mixin ms-u-xl3 { +width: 25%; +} +@mixin ms-u-xl2 { +width: 16.666666666666664%; +} +@mixin ms-u-xl1 { +width: 8.333333333333332%; +} +@mixin ms-u-xlPull12 { +right: 100%; +} +@mixin ms-u-xlPull11 { +right: 91.66666666666666%; +} +@mixin ms-u-xlPull10 { +right: 83.33333333333334%; +} +@mixin ms-u-xlPull9 { +right: 75%; +} +@mixin ms-u-xlPull8 { +right: 66.66666666666666%; +} +@mixin ms-u-xlPull7 { +right: 58.333333333333336%; +} +@mixin ms-u-xlPull6 { +right: 50%; +} +@mixin ms-u-xlPull5 { +right: 41.66666666666667%; +} +@mixin ms-u-xlPull4 { +right: 33.33333333333333%; +} +@mixin ms-u-xlPull3 { +right: 25%; +} +@mixin ms-u-xlPull2 { +right: 16.666666666666664%; +} +@mixin ms-u-xlPull1 { +right: 8.333333333333332%; +} +@mixin ms-u-xlPull0 { +right: auto; +} +@mixin ms-u-xlPush12 { +left: 100%; +} +@mixin ms-u-xlPush11 { +left: 91.66666666666666%; +} +@mixin ms-u-xlPush10 { +left: 83.33333333333334%; +} +@mixin ms-u-xlPush9 { +left: 75%; +} +@mixin ms-u-xlPush8 { +left: 66.66666666666666%; +} +@mixin ms-u-xlPush7 { +left: 58.333333333333336%; +} +@mixin ms-u-xlPush6 { +left: 50%; +} +@mixin ms-u-xlPush5 { +left: 41.66666666666667%; +} +@mixin ms-u-xlPush4 { +left: 33.33333333333333%; +} +@mixin ms-u-xlPush3 { +left: 25%; +} +@mixin ms-u-xlPush2 { +left: 16.666666666666664%; +} +@mixin ms-u-xlPush1 { +left: 8.333333333333332%; +} +@mixin ms-u-xlPush0 { +left: auto; +} + + +// XXL Screens +@mixin ms-u-xxl12 { +width: 100%; +} +@mixin ms-u-xxl11 { +width: 91.66666666666666%; +} +@mixin ms-u-xxl10 { +width: 83.33333333333334%; +} +@mixin ms-u-xxl9 { +width: 75%; +} +@mixin ms-u-xxl8 { +width: 66.66666666666666%; +} +@mixin ms-u-xxl7 { +width: 58.333333333333336%; +} +@mixin ms-u-xxl6 { +width: 50%; +} +@mixin ms-u-xxl5 { +width: 41.66666666666667%; +} +@mixin ms-u-xxl4 { +width: 33.33333333333333%; +} +@mixin ms-u-xxl3 { +width: 25%; +} +@mixin ms-u-xxl2 { +width: 16.666666666666664%; +} +@mixin ms-u-xxl1 { +width: 8.333333333333332%; +} +@mixin ms-u-xxlPull12 { +right: 100%; +} +@mixin ms-u-xxlPull11 { +right: 91.66666666666666%; +} +@mixin ms-u-xxlPull10 { +right: 83.33333333333334%; +} +@mixin ms-u-xxlPull9 { +right: 75%; +} +@mixin ms-u-xxlPull8 { +right: 66.66666666666666%; +} +@mixin ms-u-xxlPull7 { +right: 58.333333333333336%; +} +@mixin ms-u-xxlPull6 { +right: 50%; +} +@mixin ms-u-xxlPull5 { +right: 41.66666666666667%; +} +@mixin ms-u-xxlPull4 { +right: 33.33333333333333%; +} +@mixin ms-u-xxlPull3 { +right: 25%; +} +@mixin ms-u-xxlPull2 { +right: 16.666666666666664%; +} +@mixin ms-u-xxlPull1 { +right: 8.333333333333332%; +} +@mixin ms-u-xxlPull0 { +right: auto; +} +@mixin ms-u-xxlPush12 { +left: 100%; +} +@mixin ms-u-xxlPush11 { +left: 91.66666666666666%; +} +@mixin ms-u-xxlPush10 { +left: 83.33333333333334%; +} +@mixin ms-u-xxlPush9 { +left: 75%; +} +@mixin ms-u-xxlPush8 { +left: 66.66666666666666%; +} +@mixin ms-u-xxlPush7 { +left: 58.333333333333336%; +} +@mixin ms-u-xxlPush6 { +left: 50%; +} +@mixin ms-u-xxlPush5 { +left: 41.66666666666667%; +} +@mixin ms-u-xxlPush4 { +left: 33.33333333333333%; +} +@mixin ms-u-xxlPush3 { +left: 25%; +} +@mixin ms-u-xxlPush2 { +left: 16.666666666666664%; +} +@mixin ms-u-xxlPush1 { +left: 8.333333333333332%; +} +@mixin ms-u-xxlPush0 { +left: auto; +} + +// Extra extra extra large screens + +@mixin ms-u-xxxl12 { +width: 100%; +} +@mixin ms-u-xxxl11 { +width: 91.66666666666666%; +} +@mixin ms-u-xxxl10 { +width: 83.33333333333334%; +} +@mixin ms-u-xxxl9 { +width: 75%; +} +@mixin ms-u-xxxl8 { +width: 66.66666666666666%; +} +@mixin ms-u-xxxl7 { +width: 58.333333333333336%; +} +@mixin ms-u-xxxl6 { +width: 50%; +} +@mixin ms-u-xxxl5 { +width: 41.66666666666667%; +} +@mixin ms-u-xxxl4 { +width: 33.33333333333333%; +} +@mixin ms-u-xxxl3 { +width: 25%; +} +@mixin ms-u-xxxl2 { +width: 16.666666666666664%; +} +@mixin ms-u-xxxl1 { +width: 8.333333333333332%; +} +@mixin ms-u-xxxlPull12 { +right: 100%; +} +@mixin ms-u-xxxlPull11 { +right: 91.66666666666666%; +} +@mixin ms-u-xxxlPull10 { +right: 83.33333333333334%; +} +@mixin ms-u-xxxlPull9 { +right: 75%; +} +@mixin ms-u-xxxlPull8 { +right: 66.66666666666666%; +} +@mixin ms-u-xxxlPull7 { +right: 58.333333333333336%; +} +@mixin ms-u-xxxlPull6 { +right: 50%; +} +@mixin ms-u-xxxlPull5 { +right: 41.66666666666667%; +} +@mixin ms-u-xxxlPull4 { +right: 33.33333333333333%; +} +@mixin ms-u-xxxlPull3 { +right: 25%; +} +@mixin ms-u-xxxlPull2 { +right: 16.666666666666664%; +} +@mixin ms-u-xxxlPull1 { +right: 8.333333333333332%; +} +@mixin ms-u-xxxlPull0 { +right: auto; +} +@mixin ms-u-xxxlPush12 { +left: 100%; +} +@mixin ms-u-xxxlPush11 { +left: 91.66666666666666%; +} +@mixin ms-u-xxxlPush10 { +left: 83.33333333333334%; +} +@mixin ms-u-xxxlPush9 { +left: 75%; +} +@mixin ms-u-xxxlPush8 { +left: 66.66666666666666%; +} +@mixin ms-u-xxxlPush7 { +left: 58.333333333333336%; +} +@mixin ms-u-xxxlPush6 { +left: 50%; +} +@mixin ms-u-xxxlPush5 { +left: 41.66666666666667%; +} +@mixin ms-u-xxxlPush4 { +left: 33.33333333333333%; +} +@mixin ms-u-xxxlPush3 { +left: 25%; +} +@mixin ms-u-xxxlPush2 { +left: 16.666666666666664%; +} +@mixin ms-u-xxxlPush1 { +left: 8.333333333333332%; +} +@mixin ms-u-xxxlPush0 { +left: auto; +} \ No newline at end of file diff --git a/dist/sass/_Fabric.Responsive.Variables.scss b/dist/sass/_Fabric.Responsive.Variables.scss new file mode 100644 index 000000000..e553f6a8f --- /dev/null +++ b/dist/sass/_Fabric.Responsive.Variables.scss @@ -0,0 +1,35 @@ +// Copyright (c) Microsoft. All rights reserved. Licensed under the MIT license. See LICENSE in the project root for license information. + +// +// Office UI Fabric +// -------------------------------------------------- +// Fabric responsive variables + + +//== Variables for responsive breakpoints +// + +// Small screen / phone (320px - 479px) +$ms-screen-sm-min: 320px; + +// Medium screen / tablet (480px - 639px) +$ms-screen-md-min: 480px; + +// Large screen / tablet (640px - 1023px) +$ms-screen-lg-min: 640px; + +// Extra large screen / tablet (1024px - 1365px) +$ms-screen-xl-min: 1024px; + +// Extra extra large screen / desktop (1366px - 1919px) +$ms-screen-xxl-min: 1366px; + +// Extra extra extra large screen / desktop (1366px and up) +$ms-screen-xxxl-min: 1920px; + +// Set all maxes since order matters in SASS +$ms-screen-sm-max: ($ms-screen-md-min - 1); +$ms-screen-md-max: ($ms-screen-lg-min - 1); +$ms-screen-lg-max: ($ms-screen-xl-min - 1); +$ms-screen-xl-max: ($ms-screen-xxl-min - 1); +$ms-screen-xxl-max: ($ms-screen-xxxl-min - 1); \ No newline at end of file diff --git a/dist/sass/_Fabric.Typography.Fonts.scss b/dist/sass/_Fabric.Typography.Fonts.scss new file mode 100644 index 000000000..4794ff715 --- /dev/null +++ b/dist/sass/_Fabric.Typography.Fonts.scss @@ -0,0 +1,167 @@ +// Copyright (c) Microsoft. All rights reserved. Licensed under the MIT license. See LICENSE in the project root for license information. + +// +// Office UI Fabric +// -------------------------------------------------- +// Font definitions + + +// Font weights. +$ms-font-name: "Segoe UI"; + + +// Font paths. +$ms-font-directory: "https://appsforoffice.microsoft.com/fabric/fonts"; +$ms-font-path-arabic: "SegoeUI-Arabic"; +$ms-font-path-cyrillic: "SegoeUI-Cyrillic"; +$ms-font-path-easteuropean: "SegoeUI-EastEuropean"; +$ms-font-path-greek: "SegoeUI-Greek"; +$ms-font-path-hebrew: "SegoeUI-Hebrew"; +$ms-font-path-vietnamese: "SegoeUI-Vietnamese"; +$ms-font-path-westeuropean: "SegoeUI-WestEuropean"; + + +/* + Your use of the content in the files referenced here are subject to the terms of the license at http://aka.ms/fabric-font-license +*/ + +// Mixins to generate @font-face rules for unique languages. +@mixin SegoeUILight($ms-font-language, $ms-font-path) { + @font-face { + font-family: "#{$ms-font-name} #{$ms-font-language}"; + src: local("Segoe UI Light"), + url('#{$ms-font-directory}/#{$ms-font-path}/SegoeUI-Light.woff2') format('woff2'), + url('#{$ms-font-directory}/#{$ms-font-path}/SegoeUI-Light.woff') format('woff'), + url('#{$ms-font-directory}/#{$ms-font-path}/SegoeUI-Light.ttf') format('truetype'); + font-weight: 100; + font-style: normal; + } +} + +@mixin SegoeUISemilight($ms-font-language, $ms-font-path) { + @font-face { + font-family: "#{$ms-font-name} #{$ms-font-language}"; + src: local("Segoe UI Semilight"), + url('#{$ms-font-directory}/#{$ms-font-path}/SegoeUI-Semilight.woff2') format('woff2'), + url('#{$ms-font-directory}/#{$ms-font-path}/SegoeUI-Semilight.woff') format('woff'), + url('#{$ms-font-directory}/#{$ms-font-path}/SegoeUI-Semilight.ttf') format('truetype'); + font-weight: 200; + font-style: normal; + } +} + +@mixin SegoeUIRegular($ms-font-language, $ms-font-path) { + @font-face { + font-family: "#{$ms-font-name} #{$ms-font-language}"; + src: local("Segoe UI"), + url('#{$ms-font-directory}/#{$ms-font-path}/SegoeUI-Regular.woff2') format('woff2'), + url('#{$ms-font-directory}/#{$ms-font-path}/SegoeUI-Regular.woff') format('woff'), + url('#{$ms-font-directory}/#{$ms-font-path}/SegoeUI-Regular.ttf') format('truetype'); + font-weight: 400; + font-style: normal; + } +} + +@mixin SegoeUISemibold($ms-font-language, $ms-font-path) { + @font-face { + font-family: "#{$ms-font-name} #{$ms-font-language}"; + src: local("Segoe UI Semibold"), + url('#{$ms-font-directory}/#{$ms-font-path}/SegoeUI-Semibold.woff2') format('woff2'), + url('#{$ms-font-directory}/#{$ms-font-path}/SegoeUI-Semibold.woff') format('woff'), + url('#{$ms-font-directory}/#{$ms-font-path}/SegoeUI-Semibold.ttf') format('truetype'); + font-weight: 600; + font-style: normal; + } +} + +// Mixins to generate language-specific font faces. +@mixin SegoeUIArabicLight { + @include SegoeUILight("Arabic", $ms-font-path-arabic); +} +@mixin SegoeUIArabicRegular { + @include SegoeUIRegular("Arabic", $ms-font-path-arabic); +} +@mixin SegoeUIArabicSemibold { + @include SegoeUISemibold("Arabic", $ms-font-path-arabic); +} +@mixin SegoeUIArabicSemilight { + @include SegoeUISemilight("Arabic", $ms-font-path-arabic); +} + +@mixin SegoeUICyrillicLight { + @include SegoeUILight("Cyrillic", $ms-font-path-cyrillic); +} +@mixin SegoeUICyrillicRegular { + @include SegoeUIRegular("Cyrillic", $ms-font-path-cyrillic); +} +@mixin SegoeUICyrillicSemibold { + @include SegoeUISemibold("Cyrillic", $ms-font-path-cyrillic); +} +@mixin SegoeUICyrillicSemilight { + @include SegoeUISemilight("Cyrillic", $ms-font-path-cyrillic); +} + +@mixin SegoeUIEastEuropeanLight { + @include SegoeUILight("EastEuropean", $ms-font-path-easteuropean); +} +@mixin SegoeUIEastEuropeanRegular { + @include SegoeUIRegular("EastEuropean", $ms-font-path-easteuropean); +} +@mixin SegoeUIEastEuropeanSemibold { + @include SegoeUISemibold("EastEuropean", $ms-font-path-easteuropean); +} +@mixin SegoeUIEastEuropeanSemilight { + @include SegoeUISemilight("EastEuropean", $ms-font-path-easteuropean); +} + +@mixin SegoeUIGreekLight { + @include SegoeUILight("Greek", $ms-font-path-greek); +} +@mixin SegoeUIGreekRegular { + @include SegoeUIRegular("Greek", $ms-font-path-greek); +} +@mixin SegoeUIGreekSemibold { + @include SegoeUISemibold("Greek", $ms-font-path-greek); +} +@mixin SegoeUIGreekSemilight { + @include SegoeUISemilight("Greek", $ms-font-path-greek); +} + +@mixin SegoeUIHebrewLight { + @include SegoeUILight("Hebrew", $ms-font-path-hebrew); +} +@mixin SegoeUIHebrewRegular { + @include SegoeUIRegular("Hebrew", $ms-font-path-hebrew); +} +@mixin SegoeUIHebrewSemibold { + @include SegoeUISemibold("Hebrew", $ms-font-path-hebrew); +} +@mixin SegoeUIHebrewSemilight { + @include SegoeUISemilight("Hebrew", $ms-font-path-hebrew); +} + +@mixin SegoeUIVietnameseLight { + @include SegoeUILight("Vietnamese", $ms-font-path-vietnamese); +} +@mixin SegoeUIVietnameseRegular { + @include SegoeUIRegular("Vietnamese", $ms-font-path-vietnamese); +} +@mixin SegoeUIVietnameseSemibold { + @include SegoeUISemibold("Vietnamese", $ms-font-path-vietnamese); +} +@mixin SegoeUIVietnameseSemilight { + @include SegoeUISemilight("Vietnamese", $ms-font-path-vietnamese); +} + +@mixin SegoeUIWestEuropeanLight { + @include SegoeUILight("WestEuropean", $ms-font-path-westeuropean); +} +@mixin SegoeUIWestEuropeanRegular { + @include SegoeUIRegular("WestEuropean", $ms-font-path-westeuropean); +} +@mixin SegoeUIWestEuropeanSemibold { + @include SegoeUISemibold("WestEuropean", $ms-font-path-westeuropean); +} +@mixin SegoeUIWestEuropeanSemilight { + @include SegoeUISemilight("WestEuropean", $ms-font-path-westeuropean); +} diff --git a/dist/sass/_Fabric.Typography.Language.Overrides.scss b/dist/sass/_Fabric.Typography.Language.Overrides.scss new file mode 100644 index 000000000..332e91c14 --- /dev/null +++ b/dist/sass/_Fabric.Typography.Language.Overrides.scss @@ -0,0 +1,50 @@ +// Copyright (c) Microsoft. All rights reserved. Licensed under the MIT license. See LICENSE in the project root for license information. + +// +// Office UI Fabric +// -------------------------------------------------- +// Language override definitions + + +// A mixin that overrides all of the font classes for languages that +// use system fonts. A single font-family is used for all weights. +@mixin language-override-system-fonts($lang-code, $font-family) { + *[lang="#{$lang-code}"] { + .ms-font-mi, + .ms-font-xs, + .ms-font-s, + .ms-font-s-plus, + .ms-font-m, + .ms-font-m-plus, + .ms-font-l, + .ms-font-xl, + .ms-font-xxl, + .ms-font-su, + .ms-fontWeight-light, + .ms-fontWeight-light-hover:hover, + .ms-fontWeight-semilight, + .ms-fontWeight-semilight-hover:hover, + .ms-fontWeight-regular, + .ms-fontWeight-regular-hover:hover, + .ms-fontWeight-semibold, + .ms-fontWeight-semibold-hover:hover { + font-family: $font-family; + } + } +} + +// Variables for each of the non-distributed (native) font stacks. +$ms-font-stack-japanese: 'Yu Gothic', 'Meiryo UI', Meiryo, 'MS Pgothic', Osaka, $ms-font-system-base; +$ms-font-stack-korean: 'Malgun Gothic', Gulim, $ms-font-system-base; +$ms-font-stack-chinese-simplified: 'Microsoft Yahei', Verdana, Simsun, $ms-font-system-base; +$ms-font-stack-chinese-traditional: 'Microsoft Jhenghei', Pmingliu, $ms-font-system-base; +$ms-font-stack-hindi: 'Nirmala UI', $ms-font-system-base; + +// Variables for each of the web font stacks. +$ms-font-stack-arabic: 'Segoe UI Arabic', $ms-font-family-base; +$ms-font-stack-cyrillic: 'Segoe UI Cyrillic', $ms-font-family-base; +$ms-font-stack-eastEuropean: 'Segoe UI EastEuropean', $ms-font-family-base; +$ms-font-stack-greek: 'Segoe UI Greek', $ms-font-family-base; +$ms-font-stack-hebrew: 'Segoe UI Hebrew', $ms-font-family-base; +$ms-font-stack-vietnamese: 'Segoe UI Vietnamese', $ms-font-family-base; +$ms-font-stack-leelawadee: 'Leelawadee UI', 'Kmer UI', $ms-font-family-base; \ No newline at end of file diff --git a/dist/sass/_Fabric.Typography.Mixins.scss b/dist/sass/_Fabric.Typography.Mixins.scss new file mode 100644 index 000000000..a96566452 --- /dev/null +++ b/dist/sass/_Fabric.Typography.Mixins.scss @@ -0,0 +1,11 @@ +// Copyright (c) Microsoft. All rights reserved. Licensed under the MIT license. See LICENSE in the project root for license information. + +// +// Office UI Fabric +// -------------------------------------------------- +// Fabric Core Typography mixins + +@mixin ms-baseFont { + font-family: $ms-font-family-base; + -webkit-font-smoothing: antialiased; +} diff --git a/dist/sass/_Fabric.Typography.Variables.scss b/dist/sass/_Fabric.Typography.Variables.scss new file mode 100644 index 000000000..fa273adda --- /dev/null +++ b/dist/sass/_Fabric.Typography.Variables.scss @@ -0,0 +1,29 @@ +// Copyright (c) Microsoft. All rights reserved. Licensed under the MIT license. See LICENSE in the project root for license information. + +// +// Office UI Fabric +// -------------------------------------------------- +// Fabric Core Typography variables + +$ms-font-system-base: 'Segoe UI', -apple-system, BlinkMacSystemFont, 'Roboto', 'Helvetica Neue', sans-serif; +$ms-font-family-base: 'Segoe UI WestEuropean', $ms-font-system-base; + +$ms-font-weight-light: 100; +$ms-font-weight-regular: 400; +$ms-font-weight-semilight: 300; +$ms-font-weight-semibold: 600; + + +//== Type sizes +// + +$ms-font-size-su: 42px; +$ms-font-size-xxl: 28px; +$ms-font-size-xl: 21px; +$ms-font-size-l: 17px; +$ms-font-size-m-plus: 15px; +$ms-font-size-m: 14px; +$ms-font-size-s-plus: 13px; +$ms-font-size-s: 12px; +$ms-font-size-xs: 11px; +$ms-font-size-mi: 10px; diff --git a/dist/sass/_Fabric.Typography.scss b/dist/sass/_Fabric.Typography.scss new file mode 100644 index 000000000..28aadf7a6 --- /dev/null +++ b/dist/sass/_Fabric.Typography.scss @@ -0,0 +1,345 @@ +// Copyright (c) Microsoft. All rights reserved. Licensed under the MIT license. See LICENSE in the project root for license information. + +// +// Office UI Fabric +// -------------------------------------------------- +// Typographic mixins arranged with appropriate size and family combinations. +@import 'Fabric.Typography.Variables'; +@import 'Fabric.Typography.Mixins'; + +// Super Styles (LIMITED USE) +@mixin ms-font-su { + @include ms-baseFont; + font-size: $ms-font-size-su; + font-weight: $ms-font-weight-light; +} + +// Extra-Extra-Large +@mixin ms-font-xxl { + @include ms-baseFont; + font-size: $ms-font-size-xxl; + font-weight: $ms-font-weight-light; +} + +// Extra-Large Styles +@mixin ms-font-xl { + @include ms-baseFont; + font-size: $ms-font-size-xl; + font-weight: $ms-font-weight-light; +} + +// Large Styles +@mixin ms-font-l { + @include ms-baseFont; + font-size: $ms-font-size-l; + font-weight: $ms-font-weight-semilight; +} + +// Medium Plus Styles +@mixin ms-font-m-plus { + @include ms-baseFont; + font-size: $ms-font-size-m-plus; + font-weight: $ms-font-weight-regular; +} + +// Medium Styles +@mixin ms-font-m { + @include ms-baseFont; + font-size: $ms-font-size-m; + font-weight: $ms-font-weight-regular; +} + +// Small Plus Styles +@mixin ms-font-s-plus { + @include ms-baseFont; + font-size: $ms-font-size-s-plus; + font-weight: $ms-font-weight-regular; +} + +// Small Styles +@mixin ms-font-s { + @include ms-baseFont; + font-size: $ms-font-size-s; + font-weight: $ms-font-weight-regular; +} + +// XS Styles +@mixin ms-font-xs { + @include ms-baseFont; + font-size: $ms-font-size-xs; + font-weight: $ms-font-weight-regular; +} + +// Micro Styles (LIMITED USE) +@mixin ms-font-mi { + @include ms-baseFont; + font-size: $ms-font-size-mi; + font-weight: $ms-font-weight-semibold; +} + +//== Helper classes & mixins +// +// Helper mixins to override default type values + +// Font weights +@mixin ms-fontWeight-light { + font-weight: $ms-font-weight-light; +} + +@mixin ms-fontWeight-semilight { + font-weight: $ms-font-weight-semilight; +} + +@mixin ms-fontWeight-regular { + font-weight: $ms-font-weight-regular; +} + +@mixin ms-fontWeight-semibold { + font-weight: $ms-font-weight-semibold; +} + +// Font sizes +@mixin ms-fontSize-su { + font-size: $ms-font-size-su; +} + +@mixin ms-fontSize-xxl { + font-size: $ms-font-size-xxl; +} + +@mixin ms-fontSize-xl { + font-size: $ms-font-size-xl; +} + +@mixin ms-fontSize-l { + font-size: $ms-font-size-l; +} + +@mixin ms-fontSize-mPlus { + font-size: $ms-font-size-m-plus; +} + +@mixin ms-fontSize-m { + font-size: $ms-font-size-m; +} + +@mixin ms-fontSize-sPlus { + font-size: $ms-font-size-s-plus; +} + +@mixin ms-fontSize-s { + font-size: $ms-font-size-s; +} + +@mixin ms-fontSize-xs { + font-size: $ms-font-size-xs; +} + +@mixin ms-fontSize-mi { + font-size: $ms-font-size-mi; +} + +// Theme colors +@mixin ms-fontColor-themeDarker { + color: $ms-color-themeDarker; +} + +@mixin ms-fontColor-themeDark { + color: $ms-color-themeDark; +} + +@mixin ms-fontColor-themeDarkAlt { + color: $ms-color-themeDarkAlt; +} + +@mixin ms-fontColor-themePrimary { + color: $ms-color-themePrimary; +} + +@mixin ms-fontColor-themeSecondary { + color: $ms-color-themeSecondary; +} + +@mixin ms-fontColor-themeTertiary { + color: $ms-color-themeTertiary; +} + +@mixin ms-fontColor-themeLight { + color: $ms-color-themeLight; +} + +@mixin ms-fontColor-themeLighter { + color: $ms-color-themeLighter; +} + +@mixin ms-fontColor-themeLighterAlt { + color: $ms-color-themeLighterAlt; +} + + +// Neutral colors +@mixin ms-fontColor-black { + color: $ms-color-black; +} + +@mixin ms-fontColor-neutralDark { + color: $ms-color-neutralDark; +} + +@mixin ms-fontColor-neutralPrimary { + color: $ms-color-neutralPrimary; +} + +@mixin ms-fontColor-neutralPrimaryAlt { + color: $ms-color-neutralPrimaryAlt; +} + +@mixin ms-fontColor-neutralSecondary { + color: $ms-color-neutralSecondary; +} + +@mixin ms-fontColor-neutralSecondaryAlt { + color: $ms-color-neutralSecondaryAlt; +} + +@mixin ms-fontColor-neutralTertiary { + color: $ms-color-neutralTertiary; +} + +@mixin ms-fontColor-neutralTertiaryAlt { + color: $ms-color-neutralTertiaryAlt; +} + +@mixin ms-fontColor-neutralLight { + color: $ms-color-neutralLight; +} + +@mixin ms-fontColor-neutralLighter { + color: $ms-color-neutralLighter; +} + +@mixin ms-fontColor-neutralLighterAlt { + color: $ms-color-neutralLighterAlt; +} + +@mixin ms-fontColor-white { + color: $ms-color-white; +} + +// Brand and accent colors +@mixin ms-fontColor-yellow { + color: $ms-color-yellow; +} + +@mixin ms-fontColor-yellowLight { + color: $ms-color-yellowLight; +} + +@mixin ms-fontColor-orange { + color: $ms-color-orange; +} + +@mixin ms-fontColor-orangeLight { + color: $ms-color-orangeLight; +} + +@mixin ms-fontColor-orangeLighter { + color: $ms-color-orangeLighter; +} + +@mixin ms-fontColor-redDark { + color: $ms-color-redDark; +} + +@mixin ms-fontColor-red { + color: $ms-color-red; +} + +@mixin ms-fontColor-magentaDark { + color: $ms-color-magentaDark; +} + +@mixin ms-fontColor-magenta { + color: $ms-color-magenta; +} + +@mixin ms-fontColor-magentaLight { + color: $ms-color-magentaLight; +} + +@mixin ms-fontColor-purpleDark { + color: $ms-color-purpleDark; +} + +@mixin ms-fontColor-purple { + color: $ms-color-purple; +} + +@mixin ms-fontColor-purpleLight { + color: $ms-color-purpleLight; +} + +@mixin ms-fontColor-blueDark { + color: $ms-color-blueDark; +} + +@mixin ms-fontColor-blueMid { + color: $ms-color-blueMid; +} + +@mixin ms-fontColor-blue { + color: $ms-color-blue; +} + +@mixin ms-fontColor-blueLight { + color: $ms-color-blueLight; +} + +@mixin ms-fontColor-tealDark { + color: $ms-color-tealDark; +} + +@mixin ms-fontColor-teal { + color: $ms-color-teal; +} + +@mixin ms-fontColor-tealLight { + color: $ms-color-tealLight; +} + +@mixin ms-fontColor-greenDark { + color: $ms-color-greenDark; +} + +@mixin ms-fontColor-green { + color: $ms-color-green; +} + +@mixin ms-fontColor-greenLight { + color: $ms-color-greenLight; +} + +// Message colors +@mixin ms-fontColor-info { + color: $ms-color-info; +} + +@mixin ms-fontColor-success { + color: $ms-color-success; +} + +@mixin ms-fontColor-alert { // Deprecated: Use ms-fontColor-severeWarning + color: $ms-color-alert; +} + +@mixin ms-fontColor-warning { + color: $ms-color-warning; +} + +@mixin ms-fontColor-severeWarning { + color: $ms-color-severeWarning; +} + +@mixin ms-fontColor-error { + color: $ms-color-error; +} diff --git a/dist/sass/_Fabric.Utilities.scss b/dist/sass/_Fabric.Utilities.scss new file mode 100644 index 000000000..0717c48f0 --- /dev/null +++ b/dist/sass/_Fabric.Utilities.scss @@ -0,0 +1,76 @@ +// Copyright (c) Microsoft. All rights reserved. Licensed under the MIT license. See LICENSE in the project root for license information. + +// +// Office UI Fabric +// -------------------------------------------------- +// Utility classes and mixins used throughout Fabric. + +@import "Fabric.Mixins"; + +// The best box is a border box. +@mixin ms-u-borderBox { + box-sizing: border-box; +} + +// For setting the border base width +@mixin ms-u-borderBase { + border: 1px solid; +} + +// Ensures the block expands to the full height to enclose its floated childen. +@mixin ms-u-clearfix { + *zoom: 1; + &::before, + &::after { + display: table; + content: ""; + line-height: 0; + } + &::after { + clear: both; + } +} + +// Basic border-box, margin, and padding reset. +@mixin ms-u-normalize { + @include ms-u-borderBox; + @include resetMargins; + @include resetPadding; + @include resetBoxShadow; +} + +// To set various text alignment styles +// @param [variable list] $alignments +@mixin ms-u-textAlign($alignments...) { + @each $align in $alignments { + $alignStr: inspect($align); + .ms-u-textAlign#{to-upper-case(str-slice($alignStr, 1, 1)) + str-slice($alignStr, 2)} { + text-align: $align; + } + } +} + +// To hide content while still making it readable by screen readers (Accessibility) +@mixin ms-u-screenReaderOnly { + position: absolute; + width: 1px; + height: 1px; + padding: 0; + margin: -1px; + overflow: hidden; + clip: rect(0,0,0,0); + border: 0; +} + +// To add truncation with ellipsis +@mixin ms-u-textTruncate { + overflow: hidden; + text-overflow: ellipsis; + white-space: nowrap; + word-wrap: normal; // Fix for IE 8/9 in case 'word-wrap: break-word' is set on parent nodes +} + +// To disable text wrapping +@mixin ms-u-noWrap { + white-space: nowrap; +} \ No newline at end of file diff --git a/dist/sass/_Fabric.ZIndex.Variables.scss b/dist/sass/_Fabric.ZIndex.Variables.scss new file mode 100644 index 000000000..4855d7cd0 --- /dev/null +++ b/dist/sass/_Fabric.ZIndex.Variables.scss @@ -0,0 +1,32 @@ +// Copyright (c) Microsoft. All rights reserved. Licensed under the MIT license. See LICENSE in the project root for license information. + +// +// Office UI Fabric +// -------------------------------------------------- +// Z-Index Layeringz + + +// Base Layer Variables +$ms-zIndex-0: 0; +$ms-zIndex-1: 100; +$ms-zIndex-2: 200; +$ms-zIndex-3: 300; +$ms-zIndex-4: 400; +$ms-zIndex-5: 500; + +// Base Layer Modifier Variables +$ms-zIndex-back: 0; +$ms-zIndex-middle: 5; +$ms-zIndex-front: 10; + + +// Fabric Component Base Layer Assignments + +$ms-zIndex-Callout: $ms-zIndex-1; +$ms-zIndex-ContextualMenu: $ms-zIndex-1; +$ms-zIndex-Overlay: $ms-zIndex-2; +$ms-zIndex-Panel: $ms-zIndex-3; +$ms-zIndex-DatePicker: $ms-zIndex-3; +$ms-zIndex-Dialog: $ms-zIndex-3; +$ms-zIndex-PeoplePicker: $ms-zIndex-3; +$ms-zIndex-Dropdown: $ms-zIndex-4; diff --git a/dist/sass/_Fabric.i18n.scss b/dist/sass/_Fabric.i18n.scss new file mode 100644 index 000000000..65450cfab --- /dev/null +++ b/dist/sass/_Fabric.i18n.scss @@ -0,0 +1,316 @@ +// Copyright (c) Microsoft. All rights reserved. Licensed under the MIT license. See LICENSE in the project root for license information. + +// +// Office UI Fabric +// -------------------------------------------------- +// Internationalization mixins + + + +// Base left-to-right mixin definition. +@mixin LTR { + html[dir='ltr'] & { + @content; + } +} + +// Base right-to-left mixin definition. +@mixin RTL { + html[dir='rtl'] & { + @content; + } +} + +// Use baseRTL on a root element (e.g. page or region) that needs RTL support. +@mixin baseRtl { + @include RTL { + direction: rtl; + unicode-bidi: bidi-override; + } +} + + +// Common CSS property mixins with support for RTL. +// Use to automatically create RTL versions of your properties. + +// Border styles. +@mixin border-color($top, $right, $bottom, $left) { + border-color: $top $right $bottom $left; + + @include RTL { + border-color: $top $left $bottom $right; + } +} + +@mixin border-left($width, $style, $color) { + @include LTR { + border-left: $width $style $color; + } + + @include RTL { + border-right: $width $style $color; + } +} + +@mixin border-left-color($color) { + @include LTR { + border-left-color: $color; + } + + @include RTL { + border-right-color: $color; + } +} + +@mixin border-left-style($style) { + @include LTR { + border-left-style: $style; + } + + @include RTL { + border-right-style: $style; + } +} + +@mixin border-left-width($width) { + @include LTR { + border-left-width: $width; + } + + @include RTL { + border-right-width: $width; + } +} + +@mixin border-radius($topLeft, $topRight, $bottomRight, $bottomLeft) { + border-radius: $topLeft $topRight $bottomRight $bottomLeft; + + @include RTL { + border-radius: $topRight $topLeft $bottomLeft $bottomRight; + } +} + +@mixin border-right($width, $style, $color) { + @include LTR { + border-right: $width $style $color; + } + + @include RTL { + border-left: $width $style $color; + } +} + +@mixin border-right-color($color) { + @include LTR { + border-right-color: $color; + } + + @include RTL { + border-left-color: $color; + } +} + +@mixin border-right-style($style) { + @include LTR { + border-right-style: $style; + } + + @include RTL { + border-left-style: $style; + } +} + +@mixin border-right-width($width) { + @include LTR { + border-right-width: $width; + } + + @include RTL { + border-left-width: $width; + } +} + +// Floats. +@mixin clear($side) { + @if $side == left { + @include LTR { + clear: $side; + } + + @include RTL { + clear: right; + } + } @else if $side == right { + @include LTR { + clear: $side; + } + + @include RTL { + clear: left; + } + } @else { + clear: $side; + } +} + +@mixin float($direction) { + @if $direction == left { + @include LTR { + float: left; + } + + @include RTL { + float: right; + } + } @else { + @include LTR { + float: right; + } + + @include RTL { + float: left; + } + } +} + +// Positioning. +@mixin left($distance) { + @include LTR { + left: $distance; + } + + @include RTL { + right: $distance; + } +} + +@mixin right($distance) { + @include LTR { + right: $distance; + } + + @include RTL { + left: $distance; + } +} + +// Margins. +@mixin margin($top, $right, $bottom, $left) { + margin: $top $right $bottom $left; + + @include RTL { + margin: $top $left $bottom $right; + } +} + +@mixin margin-left($distance) { + @include LTR { + margin-left: $distance; + } + + @include RTL { + margin-right: $distance; + } +} + +@mixin margin-right($distance) { + @include LTR { + margin-right: $distance; + } + @include RTL { + margin-left: $distance; + } +} + +// Padding. +@mixin padding($top, $right, $bottom, $left) { + padding: $top $right $bottom $left; + + @include RTL { + padding: $top $left $bottom $right; + } +} + +@mixin padding-left($distance) { + @include LTR { + padding-left: $distance; + } + + @include RTL { + padding-right: $distance; + } +} + +@mixin padding-right($distance) { + @include LTR { + padding-right: $distance; + } + + @include RTL { + padding-left: $distance; + } +} + +// Text-alignment. +@mixin text-align($direction) { + @if $direction == left { + @include LTR { + text-align: left; + } + + @include RTL { + text-align: right; + } + } @else { + @include LTR { + text-align: right; + } + + @include RTL { + text-align: left; + } + } +} + +// Box-shadow. +@mixin box-shadow($left, $etc) { + @include LTR { + box-shadow: $left $etc; + } + + @include RTL { + box-shadow: -$left $etc; + } +} + +// Transforms. +@mixin transform-rtl() { + @include LTR { + transform: scaleX(1); + } + + @include RTL { + transform: scaleX(-1); + } +} + +// Transitions. Only supported when ONLY left/right are declared +@mixin transition-property($direction) { + @if $direction == left { + @include LTR { + transition-property: left; + } + + @include RTL { + transition-property: right; + } + } @else { + @include LTR { + transition-property: right; + } + + @include RTL { + transition-property: left; + } + } +} \ No newline at end of file