| /* Copyright (c) Microsoft Corporation. All Rights Reserved. Licensed under the MIT License. See License.txt in the project root for license information. */ |
| @keyframes WinJS-node-inserted { |
| from { |
| outline-color: #000; |
| } |
| to { |
| outline-color: #001; |
| } |
| } |
| @keyframes WinJS-opacity-in { |
| from { |
| opacity: 0; |
| } |
| to { |
| opacity: 1; |
| } |
| } |
| @keyframes WinJS-opacity-out { |
| from { |
| opacity: 1; |
| } |
| to { |
| opacity: 0; |
| } |
| } |
| @keyframes WinJS-scale-up { |
| from { |
| transform: scale(0.85); |
| } |
| to { |
| transform: scale(1); |
| } |
| } |
| @keyframes WinJS-scale-down { |
| from { |
| transform: scale(1); |
| } |
| to { |
| transform: scale(0.85); |
| } |
| } |
| @keyframes WinJS-default-remove { |
| from { |
| transform: translateX(11px); |
| } |
| to { |
| transform: none; |
| } |
| } |
| @keyframes WinJS-default-remove-rtl { |
| from { |
| transform: translateX(-11px); |
| } |
| to { |
| transform: none; |
| } |
| } |
| @keyframes WinJS-default-apply { |
| from { |
| transform: none; |
| } |
| to { |
| transform: translateX(11px); |
| } |
| } |
| @keyframes WinJS-default-apply-rtl { |
| from { |
| transform: none; |
| } |
| to { |
| transform: translateX(-11px); |
| } |
| } |
| @keyframes WinJS-showEdgeUI { |
| from { |
| transform: translateY(-70px); |
| } |
| to { |
| transform: none; |
| } |
| } |
| @keyframes WinJS-showPanel { |
| from { |
| transform: translateX(364px); |
| } |
| to { |
| transform: none; |
| } |
| } |
| @keyframes WinJS-showPanel-rtl { |
| from { |
| transform: translateX(-364px); |
| } |
| to { |
| transform: none; |
| } |
| } |
| @keyframes WinJS-hideEdgeUI { |
| from { |
| transform: none; |
| } |
| to { |
| transform: translateY(-70px); |
| } |
| } |
| @keyframes WinJS-hidePanel { |
| from { |
| transform: none; |
| } |
| to { |
| transform: translateX(364px); |
| } |
| } |
| @keyframes WinJS-hidePanel-rtl { |
| from { |
| transform: none; |
| } |
| to { |
| transform: translateX(-364px); |
| } |
| } |
| @keyframes WinJS-showPopup { |
| from { |
| transform: translateY(50px); |
| } |
| to { |
| transform: none; |
| } |
| } |
| @keyframes WinJS-dragSourceEnd { |
| from { |
| transform: translateX(11px) scale(1.05); |
| } |
| to { |
| transform: none; |
| } |
| } |
| @keyframes WinJS-dragSourceEnd-rtl { |
| from { |
| transform: translateX(-11px) scale(1.05); |
| } |
| to { |
| transform: none; |
| } |
| } |
| @keyframes WinJS-enterContent { |
| from { |
| transform: translateY(28px); |
| } |
| to { |
| transform: none; |
| } |
| } |
| @keyframes WinJS-exit { |
| from { |
| transform: none; |
| } |
| to { |
| transform: none; |
| } |
| } |
| @keyframes WinJS-enterPage { |
| from { |
| transform: translateY(28px); |
| } |
| to { |
| transform: none; |
| } |
| } |
| @keyframes WinJS-updateBadge { |
| from { |
| transform: translateY(24px); |
| } |
| to { |
| transform: none; |
| } |
| } |
| @-webkit-keyframes WinJS-node-inserted { |
| from { |
| outline-color: #000; |
| } |
| to { |
| outline-color: #001; |
| } |
| } |
| @-webkit-keyframes -webkit-WinJS-opacity-in { |
| from { |
| opacity: 0; |
| } |
| to { |
| opacity: 1; |
| } |
| } |
| @-webkit-keyframes -webkit-WinJS-opacity-out { |
| from { |
| opacity: 1; |
| } |
| to { |
| opacity: 0; |
| } |
| } |
| @-webkit-keyframes -webkit-WinJS-scale-up { |
| from { |
| -webkit-transform: scale(0.85); |
| } |
| to { |
| -webkit-transform: scale(1); |
| } |
| } |
| @-webkit-keyframes -webkit-WinJS-scale-down { |
| from { |
| -webkit-transform: scale(1); |
| } |
| to { |
| -webkit-transform: scale(0.85); |
| } |
| } |
| @-webkit-keyframes -webkit-WinJS-default-remove { |
| from { |
| -webkit-transform: translateX(11px); |
| } |
| to { |
| -webkit-transform: none; |
| } |
| } |
| @-webkit-keyframes -webkit-WinJS-default-remove-rtl { |
| from { |
| -webkit-transform: translateX(-11px); |
| } |
| to { |
| -webkit-transform: none; |
| } |
| } |
| @-webkit-keyframes -webkit-WinJS-default-apply { |
| from { |
| -webkit-transform: none; |
| } |
| to { |
| -webkit-transform: translateX(11px); |
| } |
| } |
| @-webkit-keyframes -webkit-WinJS-default-apply-rtl { |
| from { |
| -webkit-transform: none; |
| } |
| to { |
| -webkit-transform: translateX(-11px); |
| } |
| } |
| @-webkit-keyframes -webkit-WinJS-showEdgeUI { |
| from { |
| -webkit-transform: translateY(-70px); |
| } |
| to { |
| -webkit-transform: none; |
| } |
| } |
| @-webkit-keyframes -webkit-WinJS-showPanel { |
| from { |
| -webkit-transform: translateX(364px); |
| } |
| to { |
| -webkit-transform: none; |
| } |
| } |
| @-webkit-keyframes -webkit-WinJS-showPanel-rtl { |
| from { |
| -webkit-transform: translateX(-364px); |
| } |
| to { |
| -webkit-transform: none; |
| } |
| } |
| @-webkit-keyframes -webkit-WinJS-hideEdgeUI { |
| from { |
| -webkit-transform: none; |
| } |
| to { |
| -webkit-transform: translateY(-70px); |
| } |
| } |
| @-webkit-keyframes -webkit-WinJS-hidePanel { |
| from { |
| -webkit-transform: none; |
| } |
| to { |
| -webkit-transform: translateX(364px); |
| } |
| } |
| @-webkit-keyframes -webkit-WinJS-hidePanel-rtl { |
| from { |
| -webkit-transform: none; |
| } |
| to { |
| -webkit-transform: translateX(-364px); |
| } |
| } |
| @-webkit-keyframes -webkit-WinJS-showPopup { |
| from { |
| -webkit-transform: translateY(50px); |
| } |
| to { |
| -webkit-transform: none; |
| } |
| } |
| @-webkit-keyframes -webkit-WinJS-dragSourceEnd { |
| from { |
| -webkit-transform: translateX(11px) scale(1.05); |
| } |
| to { |
| -webkit-transform: none; |
| } |
| } |
| @-webkit-keyframes -webkit-WinJS-dragSourceEnd-rtl { |
| from { |
| -webkit-transform: translateX(-11px) scale(1.05); |
| } |
| to { |
| -webkit-transform: none; |
| } |
| } |
| @-webkit-keyframes -webkit-WinJS-enterContent { |
| from { |
| -webkit-transform: translateY(28px); |
| } |
| to { |
| -webkit-transform: none; |
| } |
| } |
| @-webkit-keyframes -webkit-WinJS-exit { |
| from { |
| -webkit-transform: none; |
| } |
| to { |
| -webkit-transform: none; |
| } |
| } |
| @-webkit-keyframes -webkit-WinJS-enterPage { |
| from { |
| -webkit-transform: translateY(28px); |
| } |
| to { |
| -webkit-transform: none; |
| } |
| } |
| @-webkit-keyframes -webkit-WinJS-updateBadge { |
| from { |
| -webkit-transform: translateY(24px); |
| } |
| to { |
| -webkit-transform: none; |
| } |
| } |
| @font-face { |
| font-family: "Segoe UI Command"; |
| src: local("Segoe MDL2 Assets"); |
| font-weight: normal; |
| font-style: normal; |
| } |
| @font-face { |
| font-family: "Symbols"; |
| src: url(../fonts/Symbols.ttf); |
| } |
| .win-type-header, |
| .win-h1 { |
| font-size: 46px; |
| font-weight: 200; |
| line-height: 1.216; |
| letter-spacing: 0px; |
| } |
| .win-type-subheader, |
| .win-h2 { |
| font-size: 34px; |
| font-weight: 200; |
| line-height: 1.176; |
| } |
| .win-type-title, |
| .win-h3 { |
| font-size: 24px; |
| font-weight: 300; |
| line-height: 1.167; |
| } |
| .win-type-subtitle, |
| .win-h4 { |
| font-size: 20px; |
| font-weight: 400; |
| line-height: 1.2; |
| } |
| .win-type-body, |
| .win-h6 { |
| font-size: 15px; |
| font-weight: 400; |
| line-height: 1.333; |
| } |
| .win-type-base, |
| .win-h5 { |
| font-size: 15px; |
| font-weight: 500; |
| line-height: 1.333; |
| } |
| .win-type-caption { |
| font-size: 12px; |
| font-weight: 400; |
| line-height: 1.167; |
| } |
| @font-face { |
| font-family: "Segoe UI"; |
| font-weight: 200; |
| src: local("Segoe UI Light"); |
| } |
| @font-face { |
| font-family: "Segoe UI"; |
| font-weight: 300; |
| src: local("Segoe UI Semilight"); |
| } |
| @font-face { |
| font-family: "Segoe UI"; |
| font-weight: 400; |
| src: local("Segoe UI"); |
| } |
| @font-face { |
| font-family: "Segoe UI"; |
| font-weight: 500; |
| src: local("Segoe UI Semibold"); |
| } |
| @font-face { |
| font-family: "Segoe UI"; |
| font-weight: 600; |
| src: local("Segoe UI Bold"); |
| } |
| @font-face { |
| font-family: "Segoe UI"; |
| font-style: italic; |
| font-weight: 400; |
| src: local("Segoe UI Italic"); |
| } |
| @font-face { |
| font-family: "Segoe UI"; |
| font-style: italic; |
| font-weight: 700; |
| src: local("Segoe UI Bold Italic"); |
| } |
| @font-face { |
| font-family: "Microsoft Yahei UI"; |
| font-weight: 200; |
| src: local("Microsoft Yahei UI Light"); |
| } |
| @font-face { |
| font-family: "Microsoft Yahei UI"; |
| font-weight: 300; |
| src: local("Microsoft Yahei UI"); |
| } |
| @font-face { |
| font-family: "Microsoft Yahei UI"; |
| font-weight: 500; |
| src: local("Microsoft Yahei UI"); |
| } |
| @font-face { |
| font-family: "Microsoft Yahei UI"; |
| font-weight: 600; |
| src: local("Microsoft Yahei UI Bold"); |
| } |
| @font-face { |
| font-family: "Microsoft JhengHei UI"; |
| font-weight: 200; |
| src: local("Microsoft JhengHei UI Light"); |
| } |
| @font-face { |
| font-family: "Microsoft JhengHei UI"; |
| font-weight: 300; |
| src: local("Microsoft JhengHei UI"); |
| } |
| @font-face { |
| font-family: "Microsoft JhengHei UI"; |
| font-weight: 500; |
| src: local("Microsoft JhengHei UI"); |
| } |
| @font-face { |
| font-family: "Microsoft JhengHei UI"; |
| font-weight: 600; |
| src: local("Microsoft JhengHei UI Bold"); |
| } |
| .win-type-header:-ms-lang(am, ti), |
| .win-type-subheader:-ms-lang(am, ti), |
| .win-type-title:-ms-lang(am, ti), |
| .win-type-subtitle:-ms-lang(am, ti), |
| .win-type-base:-ms-lang(am, ti), |
| .win-type-body:-ms-lang(am, ti), |
| .win-type-caption:-ms-lang(am, ti), |
| .win-h1:-ms-lang(am, ti), |
| .win-h2:-ms-lang(am, ti), |
| .win-h3:-ms-lang(am, ti), |
| .win-h4:-ms-lang(am, ti), |
| .win-h5:-ms-lang(am, ti), |
| .win-h6:-ms-lang(am, ti), |
| .win-button:-ms-lang(am, ti), |
| .win-dropdown:-ms-lang(am, ti), |
| .win-textbox:-ms-lang(am, ti), |
| .win-link:-ms-lang(am, ti), |
| .win-textarea:-ms-lang(am, ti) { |
| font-family: "Ebrima", "Ebrima", "Nirmala UI", "Gadugi", "Segoe UI Emoji", "Segoe MDL2 Assets", "Symbols", "Yu Gothic UI", "Yu Gothic", "Meiryo UI", "Leelawadee UI", "Microsoft YaHei UI", "Microsoft JhengHei UI", "Malgun Gothic", "Segoe UI Historic", "Estrangelo Edessa", "Microsoft Himalaya", "Microsoft New Tai Lue", "Microsoft PhagsPa", "Microsoft Tai Le", "Microsoft Yi Baiti", "Mongolian Baiti", "MV Boli", "Myanmar Text", "Javanese Text", "Cambria Math"; |
| } |
| .win-type-header:-ms-lang(as, bn, gu, hi, kn, kok, ml, mr, ne, or, pa, sat-Olck, si, srb-Sora, ta, te), |
| .win-type-subheader:-ms-lang(as, bn, gu, hi, kn, kok, ml, mr, ne, or, pa, sat-Olck, si, srb-Sora, ta, te), |
| .win-type-title:-ms-lang(as, bn, gu, hi, kn, kok, ml, mr, ne, or, pa, sat-Olck, si, srb-Sora, ta, te), |
| .win-type-subtitle:-ms-lang(as, bn, gu, hi, kn, kok, ml, mr, ne, or, pa, sat-Olck, si, srb-Sora, ta, te), |
| .win-type-base:-ms-lang(as, bn, gu, hi, kn, kok, ml, mr, ne, or, pa, sat-Olck, si, srb-Sora, ta, te), |
| .win-type-body:-ms-lang(as, bn, gu, hi, kn, kok, ml, mr, ne, or, pa, sat-Olck, si, srb-Sora, ta, te), |
| .win-type-caption:-ms-lang(as, bn, gu, hi, kn, kok, ml, mr, ne, or, pa, sat-Olck, si, srb-Sora, ta, te), |
| .win-h1:-ms-lang(as, bn, gu, hi, kn, kok, ml, mr, ne, or, pa, sat-Olck, si, srb-Sora, ta, te), |
| .win-h2:-ms-lang(as, bn, gu, hi, kn, kok, ml, mr, ne, or, pa, sat-Olck, si, srb-Sora, ta, te), |
| .win-h3:-ms-lang(as, bn, gu, hi, kn, kok, ml, mr, ne, or, pa, sat-Olck, si, srb-Sora, ta, te), |
| .win-h4:-ms-lang(as, bn, gu, hi, kn, kok, ml, mr, ne, or, pa, sat-Olck, si, srb-Sora, ta, te), |
| .win-h5:-ms-lang(as, bn, gu, hi, kn, kok, ml, mr, ne, or, pa, sat-Olck, si, srb-Sora, ta, te), |
| .win-h6:-ms-lang(as, bn, gu, hi, kn, kok, ml, mr, ne, or, pa, sat-Olck, si, srb-Sora, ta, te), |
| .win-button:-ms-lang(as, bn, gu, hi, kn, kok, ml, mr, ne, or, pa, sat-Olck, si, srb-Sora, ta, te), |
| .win-dropdown:-ms-lang(as, bn, gu, hi, kn, kok, ml, mr, ne, or, pa, sat-Olck, si, srb-Sora, ta, te), |
| .win-textbox:-ms-lang(as, bn, gu, hi, kn, kok, ml, mr, ne, or, pa, sat-Olck, si, srb-Sora, ta, te), |
| .win-link:-ms-lang(as, bn, gu, hi, kn, kok, ml, mr, ne, or, pa, sat-Olck, si, srb-Sora, ta, te), |
| .win-textarea:-ms-lang(as, bn, gu, hi, kn, kok, ml, mr, ne, or, pa, sat-Olck, si, srb-Sora, ta, te) { |
| font-family: "Nirmala UI", "Ebrima", "Nirmala UI", "Gadugi", "Segoe UI Emoji", "Segoe MDL2 Assets", "Symbols", "Yu Gothic UI", "Yu Gothic", "Meiryo UI", "Leelawadee UI", "Microsoft YaHei UI", "Microsoft JhengHei UI", "Malgun Gothic", "Segoe UI Historic", "Estrangelo Edessa", "Microsoft Himalaya", "Microsoft New Tai Lue", "Microsoft PhagsPa", "Microsoft Tai Le", "Microsoft Yi Baiti", "Mongolian Baiti", "MV Boli", "Myanmar Text", "Javanese Text", "Cambria Math"; |
| } |
| .win-type-header:-ms-lang(chr-CHER-US), |
| .win-type-subheader:-ms-lang(chr-CHER-US), |
| .win-type-title:-ms-lang(chr-CHER-US), |
| .win-type-subtitle:-ms-lang(chr-CHER-US), |
| .win-type-base:-ms-lang(chr-CHER-US), |
| .win-type-body:-ms-lang(chr-CHER-US), |
| .win-type-caption:-ms-lang(chr-CHER-US), |
| .win-h1:-ms-lang(chr-CHER-US), |
| .win-h2:-ms-lang(chr-CHER-US), |
| .win-h3:-ms-lang(chr-CHER-US), |
| .win-h4:-ms-lang(chr-CHER-US), |
| .win-h5:-ms-lang(chr-CHER-US), |
| .win-h6:-ms-lang(chr-CHER-US), |
| .win-button:-ms-lang(chr-CHER-US), |
| .win-dropdown:-ms-lang(chr-CHER-US), |
| .win-textbox:-ms-lang(chr-CHER-US), |
| .win-link:-ms-lang(chr-CHER-US), |
| .win-textarea:-ms-lang(chr-CHER-US) { |
| font-family: "Gadugi", "Ebrima", "Nirmala UI", "Gadugi", "Segoe UI Emoji", "Segoe MDL2 Assets", "Symbols", "Yu Gothic UI", "Yu Gothic", "Meiryo UI", "Leelawadee UI", "Microsoft YaHei UI", "Microsoft JhengHei UI", "Malgun Gothic", "Segoe UI Historic", "Estrangelo Edessa", "Microsoft Himalaya", "Microsoft New Tai Lue", "Microsoft PhagsPa", "Microsoft Tai Le", "Microsoft Yi Baiti", "Mongolian Baiti", "MV Boli", "Myanmar Text", "Javanese Text", "Cambria Math"; |
| } |
| .win-type-header:-ms-lang(ja), |
| .win-type-subheader:-ms-lang(ja), |
| .win-type-title:-ms-lang(ja), |
| .win-type-subtitle:-ms-lang(ja), |
| .win-type-base:-ms-lang(ja), |
| .win-type-body:-ms-lang(ja), |
| .win-type-caption:-ms-lang(ja), |
| .win-h1:-ms-lang(ja), |
| .win-h2:-ms-lang(ja), |
| .win-h3:-ms-lang(ja), |
| .win-h4:-ms-lang(ja), |
| .win-h5:-ms-lang(ja), |
| .win-h6:-ms-lang(ja), |
| .win-button:-ms-lang(ja), |
| .win-dropdown:-ms-lang(ja), |
| .win-textbox:-ms-lang(ja), |
| .win-link:-ms-lang(ja), |
| .win-textarea:-ms-lang(ja) { |
| font-family: "Yu Gothic UI", "Ebrima", "Nirmala UI", "Gadugi", "Segoe UI Emoji", "Segoe MDL2 Assets", "Symbols", "Yu Gothic UI", "Yu Gothic", "Meiryo UI", "Leelawadee UI", "Microsoft YaHei UI", "Microsoft JhengHei UI", "Malgun Gothic", "Segoe UI Historic", "Estrangelo Edessa", "Microsoft Himalaya", "Microsoft New Tai Lue", "Microsoft PhagsPa", "Microsoft Tai Le", "Microsoft Yi Baiti", "Mongolian Baiti", "MV Boli", "Myanmar Text", "Javanese Text", "Cambria Math"; |
| } |
| .win-type-header:-ms-lang(km, lo, th, bug-Bugi), |
| .win-type-subheader:-ms-lang(km, lo, th, bug-Bugi), |
| .win-type-title:-ms-lang(km, lo, th, bug-Bugi), |
| .win-type-subtitle:-ms-lang(km, lo, th, bug-Bugi), |
| .win-type-base:-ms-lang(km, lo, th, bug-Bugi), |
| .win-type-body:-ms-lang(km, lo, th, bug-Bugi), |
| .win-type-caption:-ms-lang(km, lo, th, bug-Bugi), |
| .win-h1:-ms-lang(km, lo, th, bug-Bugi), |
| .win-h2:-ms-lang(km, lo, th, bug-Bugi), |
| .win-h3:-ms-lang(km, lo, th, bug-Bugi), |
| .win-h4:-ms-lang(km, lo, th, bug-Bugi), |
| .win-h5:-ms-lang(km, lo, th, bug-Bugi), |
| .win-h6:-ms-lang(km, lo, th, bug-Bugi), |
| .win-button:-ms-lang(km, lo, th, bug-Bugi), |
| .win-dropdown:-ms-lang(km, lo, th, bug-Bugi), |
| .win-textbox:-ms-lang(km, lo, th, bug-Bugi), |
| .win-link:-ms-lang(km, lo, th, bug-Bugi), |
| .win-textarea:-ms-lang(km, lo, th, bug-Bugi) { |
| font-family: "Leelawadee UI", "Ebrima", "Nirmala UI", "Gadugi", "Segoe UI Emoji", "Segoe MDL2 Assets", "Symbols", "Yu Gothic UI", "Yu Gothic", "Meiryo UI", "Leelawadee UI", "Microsoft YaHei UI", "Microsoft JhengHei UI", "Malgun Gothic", "Segoe UI Historic", "Estrangelo Edessa", "Microsoft Himalaya", "Microsoft New Tai Lue", "Microsoft PhagsPa", "Microsoft Tai Le", "Microsoft Yi Baiti", "Mongolian Baiti", "MV Boli", "Myanmar Text", "Javanese Text", "Cambria Math"; |
| } |
| .win-type-header:-ms-lang(ko), |
| .win-type-subheader:-ms-lang(ko), |
| .win-type-title:-ms-lang(ko), |
| .win-type-subtitle:-ms-lang(ko), |
| .win-type-base:-ms-lang(ko), |
| .win-type-body:-ms-lang(ko), |
| .win-type-caption:-ms-lang(ko), |
| .win-h1:-ms-lang(ko), |
| .win-h2:-ms-lang(ko), |
| .win-h3:-ms-lang(ko), |
| .win-h4:-ms-lang(ko), |
| .win-h5:-ms-lang(ko), |
| .win-h6:-ms-lang(ko), |
| .win-button:-ms-lang(ko), |
| .win-dropdown:-ms-lang(ko), |
| .win-textbox:-ms-lang(ko), |
| .win-link:-ms-lang(ko), |
| .win-textarea:-ms-lang(ko) { |
| font-family: "Malgun Gothic", "Ebrima", "Nirmala UI", "Gadugi", "Segoe UI Emoji", "Segoe MDL2 Assets", "Symbols", "Yu Gothic UI", "Yu Gothic", "Meiryo UI", "Leelawadee UI", "Microsoft YaHei UI", "Microsoft JhengHei UI", "Malgun Gothic", "Segoe UI Historic", "Estrangelo Edessa", "Microsoft Himalaya", "Microsoft New Tai Lue", "Microsoft PhagsPa", "Microsoft Tai Le", "Microsoft Yi Baiti", "Mongolian Baiti", "MV Boli", "Myanmar Text", "Javanese Text", "Cambria Math"; |
| } |
| .win-type-header:-ms-lang(jv-Java), |
| .win-type-subheader:-ms-lang(jv-Java), |
| .win-type-title:-ms-lang(jv-Java), |
| .win-type-subtitle:-ms-lang(jv-Java), |
| .win-type-base:-ms-lang(jv-Java), |
| .win-type-body:-ms-lang(jv-Java), |
| .win-type-caption:-ms-lang(jv-Java), |
| .win-h1:-ms-lang(jv-Java), |
| .win-h2:-ms-lang(jv-Java), |
| .win-h3:-ms-lang(jv-Java), |
| .win-h4:-ms-lang(jv-Java), |
| .win-h5:-ms-lang(jv-Java), |
| .win-h6:-ms-lang(jv-Java), |
| .win-button:-ms-lang(jv-Java), |
| .win-dropdown:-ms-lang(jv-Java), |
| .win-textbox:-ms-lang(jv-Java), |
| .win-link:-ms-lang(jv-Java), |
| .win-textarea:-ms-lang(jv-Java) { |
| font-family: "Javanese Text", "Ebrima", "Nirmala UI", "Gadugi", "Segoe UI Emoji", "Segoe MDL2 Assets", "Symbols", "Yu Gothic UI", "Yu Gothic", "Meiryo UI", "Leelawadee UI", "Microsoft YaHei UI", "Microsoft JhengHei UI", "Malgun Gothic", "Segoe UI Historic", "Estrangelo Edessa", "Microsoft Himalaya", "Microsoft New Tai Lue", "Microsoft PhagsPa", "Microsoft Tai Le", "Microsoft Yi Baiti", "Mongolian Baiti", "MV Boli", "Myanmar Text", "Javanese Text", "Cambria Math"; |
| } |
| .win-type-header:-ms-lang(cop-Copt), |
| .win-type-subheader:-ms-lang(cop-Copt), |
| .win-type-title:-ms-lang(cop-Copt), |
| .win-type-subtitle:-ms-lang(cop-Copt), |
| .win-type-base:-ms-lang(cop-Copt), |
| .win-type-body:-ms-lang(cop-Copt), |
| .win-type-caption:-ms-lang(cop-Copt), |
| .win-h1:-ms-lang(cop-Copt), |
| .win-h2:-ms-lang(cop-Copt), |
| .win-h3:-ms-lang(cop-Copt), |
| .win-h4:-ms-lang(cop-Copt), |
| .win-h5:-ms-lang(cop-Copt), |
| .win-h6:-ms-lang(cop-Copt), |
| .win-button:-ms-lang(cop-Copt), |
| .win-dropdown:-ms-lang(cop-Copt), |
| .win-textbox:-ms-lang(cop-Copt), |
| .win-link:-ms-lang(cop-Copt), |
| .win-textarea:-ms-lang(cop-Copt) { |
| font-family: "Segoe MDL2 Assets", "Ebrima", "Nirmala UI", "Gadugi", "Segoe UI Emoji", "Segoe MDL2 Assets", "Symbols", "Yu Gothic UI", "Yu Gothic", "Meiryo UI", "Leelawadee UI", "Microsoft YaHei UI", "Microsoft JhengHei UI", "Malgun Gothic", "Segoe UI Historic", "Estrangelo Edessa", "Microsoft Himalaya", "Microsoft New Tai Lue", "Microsoft PhagsPa", "Microsoft Tai Le", "Microsoft Yi Baiti", "Mongolian Baiti", "MV Boli", "Myanmar Text", "Javanese Text", "Cambria Math"; |
| } |
| .win-type-header:-ms-lang(zh-CN, zh-Hans, zh-SG), |
| .win-type-subheader:-ms-lang(zh-CN, zh-Hans, zh-SG), |
| .win-type-title:-ms-lang(zh-CN, zh-Hans, zh-SG), |
| .win-type-subtitle:-ms-lang(zh-CN, zh-Hans, zh-SG), |
| .win-type-base:-ms-lang(zh-CN, zh-Hans, zh-SG), |
| .win-type-body:-ms-lang(zh-CN, zh-Hans, zh-SG), |
| .win-type-caption:-ms-lang(zh-CN, zh-Hans, zh-SG), |
| .win-h1:-ms-lang(zh-CN, zh-Hans, zh-SG), |
| .win-h2:-ms-lang(zh-CN, zh-Hans, zh-SG), |
| .win-h3:-ms-lang(zh-CN, zh-Hans, zh-SG), |
| .win-h4:-ms-lang(zh-CN, zh-Hans, zh-SG), |
| .win-h5:-ms-lang(zh-CN, zh-Hans, zh-SG), |
| .win-h6:-ms-lang(zh-CN, zh-Hans, zh-SG), |
| .win-button:-ms-lang(zh-CN, zh-Hans, zh-SG), |
| .win-dropdown:-ms-lang(zh-CN, zh-Hans, zh-SG), |
| .win-textbox:-ms-lang(zh-CN, zh-Hans, zh-SG), |
| .win-link:-ms-lang(zh-CN, zh-Hans, zh-SG), |
| .win-textarea:-ms-lang(zh-CN, zh-Hans, zh-SG) { |
| font-family: "Microsoft YaHei UI", "Ebrima", "Nirmala UI", "Gadugi", "Segoe UI Emoji", "Segoe MDL2 Assets", "Symbols", "Yu Gothic UI", "Yu Gothic", "Meiryo UI", "Leelawadee UI", "Microsoft YaHei UI", "Microsoft JhengHei UI", "Malgun Gothic", "Segoe UI Historic", "Estrangelo Edessa", "Microsoft Himalaya", "Microsoft New Tai Lue", "Microsoft PhagsPa", "Microsoft Tai Le", "Microsoft Yi Baiti", "Mongolian Baiti", "MV Boli", "Myanmar Text", "Javanese Text", "Cambria Math"; |
| } |
| .win-type-header:-ms-lang(zh-HK, zh-TW, zh-Hant, zh-MO), |
| .win-type-subheader:-ms-lang(zh-HK, zh-TW, zh-Hant, zh-MO), |
| .win-type-title:-ms-lang(zh-HK, zh-TW, zh-Hant, zh-MO), |
| .win-type-subtitle:-ms-lang(zh-HK, zh-TW, zh-Hant, zh-MO), |
| .win-type-base:-ms-lang(zh-HK, zh-TW, zh-Hant, zh-MO), |
| .win-type-body:-ms-lang(zh-HK, zh-TW, zh-Hant, zh-MO), |
| .win-type-caption:-ms-lang(zh-HK, zh-TW, zh-Hant, zh-MO), |
| .win-h1:-ms-lang(zh-HK, zh-TW, zh-Hant, zh-MO), |
| .win-h2:-ms-lang(zh-HK, zh-TW, zh-Hant, zh-MO), |
| .win-h3:-ms-lang(zh-HK, zh-TW, zh-Hant, zh-MO), |
| .win-h4:-ms-lang(zh-HK, zh-TW, zh-Hant, zh-MO), |
| .win-h5:-ms-lang(zh-HK, zh-TW, zh-Hant, zh-MO), |
| .win-h6:-ms-lang(zh-HK, zh-TW, zh-Hant, zh-MO), |
| .win-button:-ms-lang(zh-HK, zh-TW, zh-Hant, zh-MO), |
| .win-dropdown:-ms-lang(zh-HK, zh-TW, zh-Hant, zh-MO), |
| .win-textbox:-ms-lang(zh-HK, zh-TW, zh-Hant, zh-MO), |
| .win-link:-ms-lang(zh-HK, zh-TW, zh-Hant, zh-MO), |
| .win-textarea:-ms-lang(zh-HK, zh-TW, zh-Hant, zh-MO) { |
| font-family: "Microsoft JhengHei UI", "Ebrima", "Nirmala UI", "Gadugi", "Segoe UI Emoji", "Segoe MDL2 Assets", "Symbols", "Yu Gothic UI", "Yu Gothic", "Meiryo UI", "Leelawadee UI", "Microsoft YaHei UI", "Microsoft JhengHei UI", "Malgun Gothic", "Segoe UI Historic", "Estrangelo Edessa", "Microsoft Himalaya", "Microsoft New Tai Lue", "Microsoft PhagsPa", "Microsoft Tai Le", "Microsoft Yi Baiti", "Mongolian Baiti", "MV Boli", "Myanmar Text", "Javanese Text", "Cambria Math"; |
| } |
| html, |
| body { |
| width: 100%; |
| height: 100%; |
| margin: 0px; |
| cursor: default; |
| -webkit-touch-callout: none; |
| -ms-scroll-translation: vertical-to-horizontal; |
| -webkit-tap-highlight-color: rgba(0, 0, 0, 0); |
| } |
| html { |
| overflow: hidden; |
| direction: ltr; |
| } |
| html:lang(ar), |
| html:lang(dv), |
| html:lang(fa), |
| html:lang(he), |
| html:lang(ku-Arab), |
| html:lang(pa-Arab), |
| html:lang(prs), |
| html:lang(ps), |
| html:lang(sd-Arab), |
| html:lang(syr), |
| html:lang(ug), |
| html:lang(ur), |
| html:lang(qps-plocm) { |
| direction: rtl; |
| } |
| body { |
| -ms-content-zooming: none; |
| } |
| iframe { |
| border: 0; |
| } |
| .win-type-header, |
| .win-type-subheader, |
| .win-type-title, |
| .win-type-subtitle, |
| .win-type-base, |
| .win-type-body, |
| .win-type-caption, |
| .win-h1, |
| .win-h2, |
| .win-h3, |
| .win-h4, |
| .win-h5, |
| .win-h6, |
| .win-button, |
| .win-dropdown, |
| .win-textbox, |
| .win-link, |
| .win-textarea { |
| font-family: "Segoe UI", sans-serif, "Segoe MDL2 Assets", "Symbols"; |
| } |
| .win-textbox, |
| .win-textarea { |
| -ms-user-select: element; |
| border-style: solid; |
| border-width: 2px; |
| border-radius: 0; |
| margin: 8px 0px; |
| width: 296px; |
| min-width: 64px; |
| min-height: 28px; |
| background-clip: border-box; |
| box-sizing: border-box; |
| padding: 3px 6px 5px 10px; |
| outline: 0; |
| font-size: 15px; |
| font-weight: 400; |
| line-height: 1.333; |
| } |
| .win-textbox::-ms-value { |
| margin: 0; |
| padding: 0; |
| } |
| .win-textbox::-ms-clear, |
| .win-textbox::-ms-reveal { |
| padding-right: 2px; |
| margin-right: -8px; |
| margin-left: 2px; |
| margin-top: -8px; |
| margin-bottom: -8px; |
| width: 30px; |
| height: 32px; |
| } |
| .win-textbox:lang(ar)::-ms-clear, |
| .win-textbox:lang(dv)::-ms-clear, |
| .win-textbox:lang(fa)::-ms-clear, |
| .win-textbox:lang(he)::-ms-clear, |
| .win-textbox:lang(ku-Arab)::-ms-clear, |
| .win-textbox:lang(pa-Arab)::-ms-clear, |
| .win-textbox:lang(prs)::-ms-clear, |
| .win-textbox:lang(ps)::-ms-clear, |
| .win-textbox:lang(sd-Arab)::-ms-clear, |
| .win-textbox:lang(syr)::-ms-clear, |
| .win-textbox:lang(ug)::-ms-clear, |
| .win-textbox:lang(ur)::-ms-clear, |
| .win-textbox:lang(qps-plocm)::-ms-clear, |
| .win-textbox:lang(ar)::-ms-reveal, |
| .win-textbox:lang(dv)::-ms-reveal, |
| .win-textbox:lang(fa)::-ms-reveal, |
| .win-textbox:lang(he)::-ms-reveal, |
| .win-textbox:lang(ku-Arab)::-ms-reveal, |
| .win-textbox:lang(pa-Arab)::-ms-reveal, |
| .win-textbox:lang(prs)::-ms-reveal, |
| .win-textbox:lang(ps)::-ms-reveal, |
| .win-textbox:lang(sd-Arab)::-ms-reveal, |
| .win-textbox:lang(syr)::-ms-reveal, |
| .win-textbox:lang(ug)::-ms-reveal, |
| .win-textbox:lang(ur)::-ms-reveal, |
| .win-textbox:lang(qps-plocm)::-ms-reveal { |
| margin-left: -8px; |
| margin-right: 2px; |
| } |
| .win-textarea { |
| resize: none; |
| overflow-y: auto; |
| } |
| .win-radio, |
| .win-checkbox { |
| width: 20px; |
| height: 20px; |
| margin-right: 8px; |
| margin-top: 12px; |
| margin-bottom: 12px; |
| } |
| .win-radio:lang(ar), |
| .win-checkbox:lang(ar), |
| .win-radio:lang(dv), |
| .win-checkbox:lang(dv), |
| .win-radio:lang(fa), |
| .win-checkbox:lang(fa), |
| .win-radio:lang(he), |
| .win-checkbox:lang(he), |
| .win-radio:lang(ku-Arab), |
| .win-checkbox:lang(ku-Arab), |
| .win-radio:lang(pa-Arab), |
| .win-checkbox:lang(pa-Arab), |
| .win-radio:lang(prs), |
| .win-checkbox:lang(prs), |
| .win-radio:lang(ps), |
| .win-checkbox:lang(ps), |
| .win-radio:lang(sd-Arab), |
| .win-checkbox:lang(sd-Arab), |
| .win-radio:lang(syr), |
| .win-checkbox:lang(syr), |
| .win-radio:lang(ug), |
| .win-checkbox:lang(ug), |
| .win-radio:lang(ur), |
| .win-checkbox:lang(ur), |
| .win-radio:lang(qps-plocm), |
| .win-checkbox:lang(qps-plocm) { |
| margin-left: 8px; |
| margin-right: 0px; |
| } |
| .win-radio::-ms-check, |
| .win-checkbox::-ms-check { |
| border-style: solid; |
| display: inline-block; |
| border-width: 2px; |
| background-clip: border-box; |
| } |
| .win-button { |
| border-style: solid; |
| margin: 0px; |
| min-height: 32px; |
| min-width: 120px; |
| padding: 4px 8px; |
| border-width: 2px; |
| background-clip: border-box; |
| border-radius: 0; |
| touch-action: manipulation; |
| -webkit-appearance: none; |
| font-size: 15px; |
| font-weight: 400; |
| line-height: 1.333; |
| } |
| .win-button.win-button-file { |
| border: none; |
| min-width: 100px; |
| min-height: 20px; |
| width: 340px; |
| height: 32px; |
| padding: 0px; |
| margin: 7px 8px 21px 8px; |
| background-clip: padding-box; |
| } |
| .win-button.win-button-file::-ms-value { |
| margin: 0; |
| border-width: 2px; |
| border-style: solid; |
| border-right-style: none; |
| border-radius: 0; |
| background-clip: border-box; |
| font-size: 15px; |
| font-weight: 400; |
| line-height: 1.333; |
| } |
| .win-button.win-button-file:lang(ar)::-ms-value, |
| .win-button.win-button-file:lang(dv)::-ms-value, |
| .win-button.win-button-file:lang(fa)::-ms-value, |
| .win-button.win-button-file:lang(he)::-ms-value, |
| .win-button.win-button-file:lang(ku-Arab)::-ms-value, |
| .win-button.win-button-file:lang(pa-Arab)::-ms-value, |
| .win-button.win-button-file:lang(prs)::-ms-value, |
| .win-button.win-button-file:lang(ps)::-ms-value, |
| .win-button.win-button-file:lang(sd-Arab)::-ms-value, |
| .win-button.win-button-file:lang(syr)::-ms-value, |
| .win-button.win-button-file:lang(ug)::-ms-value, |
| .win-button.win-button-file:lang(ur)::-ms-value, |
| .win-button.win-button-file:lang(qps-plocm)::-ms-value { |
| border-left-style: none; |
| border-right-style: solid; |
| } |
| .win-button.win-button-file::-ms-browse { |
| margin: 0; |
| padding: 0 18px; |
| border-width: 2px; |
| border-style: solid; |
| background-clip: padding-box; |
| font-size: 15px; |
| font-weight: 400; |
| line-height: 1.333; |
| } |
| .win-dropdown { |
| min-width: 56px; |
| max-width: 368px; |
| min-height: 32px; |
| margin: 8px 0; |
| border-style: solid; |
| border-width: 2px; |
| background-clip: border-box; |
| background-image: none; |
| box-sizing: border-box; |
| border-radius: 0; |
| font-size: 15px; |
| font-weight: 400; |
| line-height: 1.333; |
| } |
| .win-dropdown::-ms-value { |
| padding: 5px 12px 7px 12px; |
| margin: 0; |
| } |
| .win-dropdown::-ms-expand { |
| border: none; |
| margin-right: 5px; |
| margin-left: 3px; |
| margin-bottom: -2px; |
| font-size: 20px; |
| } |
| select[multiple].win-dropdown { |
| padding: 0 0 0 12px; |
| vertical-align: bottom; |
| } |
| .win-dropdown option { |
| font-size: 15px; |
| font-weight: 400; |
| line-height: 1.333; |
| } |
| .win-progress-bar, |
| .win-progress-ring, |
| .win-ring { |
| width: 180px; |
| height: 4px; |
| -webkit-appearance: none; |
| } |
| .win-progress-bar:not(:indeterminate), |
| .win-progress-ring:not(:indeterminate), |
| .win-ring:not(:indeterminate) { |
| border-style: none; |
| } |
| .win-progress-bar::-ms-fill, |
| .win-progress-ring::-ms-fill, |
| .win-ring::-ms-fill { |
| border-style: none; |
| } |
| .win-progress-bar.win-medium, |
| .win-progress-ring.win-medium, |
| .win-ring.win-medium { |
| width: 296px; |
| } |
| .win-progress-bar.win-large, |
| .win-progress-ring.win-large, |
| .win-ring.win-large { |
| width: 100%; |
| } |
| .win-progress-bar:indeterminate::-webkit-progress-value, |
| .win-progress-ring:indeterminate::-webkit-progress-value, |
| .win-ring:indeterminate::-webkit-progress-value { |
| position: relative; |
| -webkit-animation: win-progress-indeterminate 3s linear infinite; |
| } |
| .win-progress-bar.win-paused:not(:indeterminate), |
| .win-progress-ring.win-paused:not(:indeterminate), |
| .win-ring.win-paused:not(:indeterminate) { |
| animation-name: win-progress-fade-out; |
| animation-duration: 3s; |
| animation-timing-function: cubic-bezier(0.03, 0.76, 0.31, 1); |
| opacity: 0.5; |
| } |
| .win-progress-bar.win-error::-ms-fill, |
| .win-progress-ring.win-error::-ms-fill, |
| .win-ring.win-error::-ms-fill { |
| opacity: 0; |
| } |
| .win-progress-ring, |
| .win-ring { |
| width: 20px; |
| height: 20px; |
| } |
| .win-progress-ring:indeterminate::-ms-fill, |
| .win-ring:indeterminate::-ms-fill { |
| animation-name: -ms-ring; |
| } |
| .win-progress-ring.win-medium, |
| .win-ring.win-medium { |
| width: 40px; |
| height: 40px; |
| } |
| .win-progress-ring.win-large, |
| .win-ring.win-large { |
| width: 60px; |
| height: 60px; |
| } |
| @-webkit-keyframes win-progress-indeterminate { |
| 0% { |
| left: 0; |
| width: 25%; |
| } |
| 50% { |
| left: calc(75%); |
| width: 25%; |
| } |
| 75% { |
| left: calc(100%); |
| width: 0%; |
| } |
| 75.1% { |
| left: 0; |
| width: 0%; |
| } |
| 100% { |
| left: 0; |
| width: 25%; |
| } |
| } |
| @keyframes win-progress-fade-out { |
| from { |
| opacity: 1.0; |
| } |
| to { |
| opacity: 0.5; |
| } |
| } |
| .win-slider { |
| -webkit-appearance: none; |
| width: 280px; |
| height: 44px; |
| } |
| .win-slider::-ms-track { |
| height: 2px; |
| border-style: none; |
| } |
| .win-slider::-webkit-slider-runnable-track { |
| height: 2px; |
| border-style: none; |
| } |
| .win-slider::-moz-range-track { |
| height: 2px; |
| border-style: none; |
| } |
| .win-slider::-moz-range-thumb { |
| width: 8px; |
| height: 24px; |
| border-radius: 4px; |
| border-style: none; |
| } |
| .win-slider::-webkit-slider-thumb { |
| -webkit-appearance: none; |
| margin-top: -11px; |
| width: 8px; |
| height: 24px; |
| border-radius: 4px; |
| border-style: none; |
| } |
| .win-slider::-ms-thumb { |
| margin-top: inherit; |
| width: 8px; |
| height: 24px; |
| border-radius: 4px; |
| border-style: none; |
| } |
| .win-slider.win-vertical { |
| writing-mode: bt-lr; |
| width: 44px; |
| height: 280px; |
| } |
| .win-slider.win-vertical::-ms-track { |
| width: 2px; |
| height: auto; |
| } |
| .win-slider.win-vertical::-ms-thumb { |
| width: 24px; |
| height: 8px; |
| } |
| .win-slider.win-vertical:lang(ar), |
| .win-slider.win-vertical:lang(dv), |
| .win-slider.win-vertical:lang(fa), |
| .win-slider.win-vertical:lang(he), |
| .win-slider.win-vertical:lang(ku-Arab), |
| .win-slider.win-vertical:lang(pa-Arab), |
| .win-slider.win-vertical:lang(prs), |
| .win-slider.win-vertical:lang(ps), |
| .win-slider.win-vertical:lang(sd-Arab), |
| .win-slider.win-vertical:lang(syr), |
| .win-slider.win-vertical:lang(ug), |
| .win-slider.win-vertical:lang(ur), |
| .win-slider.win-vertical:lang(qps-plocm) { |
| writing-mode: bt-rl; |
| } |
| .win-link { |
| text-decoration: underline; |
| cursor: pointer; |
| touch-action: manipulation; |
| } |
| .win-code { |
| font-family: "Consolas", "Menlo", "Monaco", "Courier New", monospace; |
| font-size: 15px; |
| font-weight: 400; |
| line-height: 1.333; |
| } |
| .win-type-ellipsis { |
| overflow: hidden; |
| text-overflow: ellipsis; |
| white-space: nowrap; |
| } |
| h1.win-type-ellipsis, |
| .win-type-header.win-type-ellipsis, |
| .win-h1.win-type-ellipsis { |
| line-height: 1.4286; |
| } |
| h2.win-type-ellipsis, |
| .win-type-subheader.win-type-ellipsis, |
| .win-h2.win-type-ellipsis { |
| line-height: 1.5; |
| } |
| .win-scrollview { |
| overflow-x: auto; |
| overflow-y: hidden; |
| height: 400px; |
| width: 100%; |
| } |
| h1.win-type-header, |
| h2.win-type-subheader, |
| h3.win-type-title, |
| h4.win-type-subtitle, |
| h5.win-type-base, |
| h6.win-type-body, |
| h1.win-h1, |
| h2.win-h2, |
| h3.win-h3, |
| h4.win-h4, |
| h5.win-h5, |
| h6.win-h6 { |
| margin-top: 0px; |
| margin-bottom: 0px; |
| } |
| .win-type-body p, |
| p.win-type-body { |
| font-weight: 300; |
| } |
| .win-listview { |
| overflow: hidden; |
| height: 400px; |
| } |
| .win-listview .win-surface { |
| overflow: visible; |
| } |
| .win-listview > .win-viewport.win-horizontal .win-surface { |
| height: 100%; |
| } |
| .win-listview > .win-viewport.win-vertical .win-surface { |
| width: 100%; |
| } |
| .win-listview > .win-viewport { |
| position: relative; |
| width: 100%; |
| height: 100%; |
| z-index: 0; |
| -ms-overflow-style: -ms-autohiding-scrollbar; |
| -webkit-overflow-scrolling: touch; |
| white-space: nowrap; |
| } |
| .win-listview > .win-viewport.win-horizontal { |
| overflow-x: auto; |
| overflow-y: hidden; |
| } |
| .win-listview > .win-viewport.win-vertical { |
| overflow-x: hidden; |
| overflow-y: auto; |
| } |
| .win-listview .win-itemscontainer { |
| overflow: hidden; |
| } |
| .win-listview .win-itemscontainer-padder { |
| width: 0; |
| height: 0; |
| margin: 0; |
| padding: 0; |
| border: 0; |
| overflow: hidden; |
| } |
| .win-listview > .win-horizontal .win-container { |
| margin: 10px 5px 0px 5px; |
| } |
| .win-listview > .win-vertical .win-container { |
| margin: 10px 24px 0px 7px; |
| } |
| .win-listview.win-rtl > .win-vertical .win-container { |
| margin: 10px 7px 0px 24px; |
| } |
| .win-listview .win-container, |
| .win-listview .win-itembox, |
| .win-itemcontainer.win-container, |
| .win-itemcontainer .win-itembox { |
| cursor: default; |
| z-index: 0; |
| } |
| .win-listview .win-container { |
| touch-action: pan-x pan-y pinch-zoom; |
| } |
| .win-semanticzoom .win-listview > .win-viewport * { |
| touch-action: auto; |
| } |
| .win-semanticzoom .win-listview > .win-viewport.win-zooming-x { |
| overflow-x: visible; |
| } |
| .win-semanticzoom .win-listview > .win-viewport.win-zooming-y { |
| overflow-y: visible; |
| } |
| .win-listview .win-itembox, |
| .win-itemcontainer .win-itembox { |
| width: 100%; |
| height: 100%; |
| } |
| .win-listview .win-item, |
| .win-itemcontainer .win-item { |
| z-index: 1; |
| } |
| .win-listview .win-item, |
| .win-itemcontainer .win-item { |
| overflow: hidden; |
| position: relative; |
| } |
| .win-listview > .win-vertical .win-item { |
| width: 100%; |
| } |
| .win-listview .win-item:focus, |
| .win-itemcontainer .win-item:focus { |
| outline-style: none; |
| } |
| .win-listview .win-focusedoutline, |
| .win-itemcontainer .win-focusedoutline { |
| width: calc(100% - 4px); |
| height: calc(100% - 4px); |
| left: 2px; |
| top: 2px; |
| position: absolute; |
| z-index: 5; |
| pointer-events: none; |
| } |
| .win-container.win-selected .win-selectionborder { |
| border-width: 2px; |
| border-style: solid; |
| } |
| html.win-hoverable .win-container.win-selected:hover .win-selectionborder { |
| border-width: 2px; |
| border-style: solid; |
| } |
| html.win-hoverable .win-listview .win-itembox:hover::before, |
| html.win-hoverable .win-itemcontainer .win-itembox:hover::before { |
| position: absolute; |
| left: 0px; |
| top: 0px; |
| content: ""; |
| width: calc(100% - 4px); |
| height: calc(100% - 4px); |
| pointer-events: none; |
| border-style: solid; |
| border-width: 2px; |
| z-index: 3; |
| } |
| html.win-hoverable .win-listview.win-selectionstylefilled .win-itembox:hover::before, |
| html.win-hoverable .win-itemcontainer.win-selectionstylefilled .win-itembox:hover::before, |
| html.win-hoverable .win-listview .win-itembox.win-selected:hover::before, |
| html.win-hoverable .win-itemcontainer.win-itembox.win-selected:hover::before, |
| html.win-hoverable .win-itemcontainer.win-itembox.win-selected:hover::before { |
| display: none; |
| } |
| .win-listview .win-groupheader { |
| padding: 10px 10px 10px 2px; |
| overflow: hidden; |
| outline-width: 0.01px; |
| outline-style: none; |
| float: left; |
| font-size: 34px; |
| font-weight: 200; |
| line-height: 1.176; |
| } |
| .win-listview .win-groupheadercontainer { |
| z-index: 1; |
| touch-action: pan-x pan-y pinch-zoom; |
| overflow: hidden; |
| } |
| .win-listview .win-horizontal .win-headercontainer, |
| .win-listview .win-horizontal .win-footercontainer { |
| height: 100%; |
| display: inline-block; |
| overflow: hidden; |
| white-space: normal; |
| } |
| .win-listview .win-vertical .win-headercontainer, |
| .win-listview .win-vertical .win-footercontainer { |
| width: 100%; |
| display: block; |
| overflow: hidden; |
| white-space: normal; |
| } |
| .win-listview .win-groupheader.win-focused { |
| outline-style: dotted; |
| } |
| .win-listview.win-rtl .win-groupheader { |
| padding-left: 10px; |
| padding-right: 2px; |
| float: right; |
| } |
| .win-listview.win-groups .win-horizontal .win-groupleader { |
| margin-left: 70px; |
| } |
| .win-listview.win-groups.win-rtl .win-horizontal .win-groupleader { |
| margin-left: 0; |
| margin-right: 70px; |
| } |
| .win-listview.win-groups .win-vertical .win-listlayout .win-groupleader, |
| .win-listview.win-groups .win-vertical .win-gridlayout .win-groupleader { |
| margin-top: 70px; |
| } |
| .win-listview.win-groups > .win-vertical .win-surface.win-listlayout, |
| .win-listview.win-groups > .win-vertical .win-surface.win-gridlayout { |
| margin-top: -65px; |
| } |
| .win-listview.win-groups > .win-horizontal .win-surface { |
| margin-left: -70px; |
| } |
| .win-listview.win-groups.win-rtl > .win-horizontal .win-surface { |
| margin-left: 0; |
| margin-right: -70px; |
| } |
| .win-listview .win-surface { |
| -webkit-margin-collapse: separate; |
| white-space: normal; |
| } |
| .win-surface ._win-proxy { |
| position: relative; |
| overflow: hidden; |
| width: 0; |
| height: 0; |
| touch-action: none; |
| } |
| .win-selectionborder { |
| position: absolute; |
| opacity: inherit; |
| z-index: 2; |
| pointer-events: none; |
| } |
| .win-container.win-selected .win-selectionborder { |
| top: 0; |
| left: 0; |
| right: 0; |
| bottom: 0; |
| } |
| .win-selectionbackground { |
| position: absolute; |
| top: 0; |
| left: 0; |
| right: 0; |
| bottom: 0; |
| z-index: 0; |
| } |
| .win-selectioncheckmarkbackground { |
| position: absolute; |
| top: 2px; |
| right: 2px; |
| width: 14px; |
| height: 11px; |
| margin: 0; |
| padding: 0; |
| border-left-width: 2px; |
| border-right-width: 2px; |
| border-top-width: 4px; |
| border-bottom-width: 3px; |
| border-style: solid; |
| z-index: 3; |
| display: none; |
| } |
| .win-listview.win-rtl .win-selectioncheckmarkbackground, |
| .win-itemcontainer.win-rtl .win-selectioncheckmarkbackground { |
| left: 2px; |
| right: auto; |
| } |
| .win-selectionmode.win-itemcontainer .win-selectioncheckmarkbackground, |
| .win-selectionmode.win-itemcontainer.win-selectionmode .win-selectioncheckmark, |
| .win-selectionmode .win-itemcontainer .win-selectioncheckmarkbackground, |
| .win-selectionmode .win-itemcontainer.win-selectionmode .win-selectioncheckmark, |
| .win-listview .win-selectionmode .win-selectioncheckmarkbackground, |
| .win-listview .win-selectionmode .win-selectioncheckmark { |
| display: block; |
| } |
| .win-selectioncheckmark { |
| position: absolute; |
| margin: 0; |
| padding: 2px; |
| right: 1px; |
| top: 1px; |
| font-family: "Segoe MDL2 Assets", "Symbols"; |
| font-size: 14px; |
| z-index: 4; |
| line-height: 1; |
| display: none; |
| } |
| .win-rtl .win-selectioncheckmark { |
| right: auto; |
| left: 0px; |
| } |
| .win-selectionstylefilled.win-container, |
| .win-selectionstylefilled .win-container { |
| overflow: hidden; |
| } |
| .win-selectionmode .win-itemcontainer.win-container .win-itembox::after, |
| .win-selectionmode.win-itemcontainer.win-container .win-itembox::after, |
| .win-listview .win-surface.win-selectionmode .win-itembox::after { |
| content: ""; |
| position: absolute; |
| width: 18px; |
| height: 18px; |
| pointer-events: none; |
| right: 2px; |
| top: 2px; |
| z-index: 3; |
| } |
| .win-rtl .win-selectionmode .win-itemcontainer.win-container .win-itembox::after, |
| .win-itemcontainer.win-rtl.win-selectionmode.win-container .win-itembox::after, |
| .win-listview.win-rtl .win-surface.win-selectionmode .win-itembox::after { |
| right: auto; |
| left: 2px; |
| } |
| .win-listview.win-selectionstylefilled .win-surface.win-selectionmode .win-item { |
| transition: transform 250ms cubic-bezier(0.17, 0.79, 0.215, 1.0025); |
| -webkit-transition: -webkit-transform 250ms cubic-bezier(0.17, 0.79, 0.215, 1.0025); |
| transform: translate(40px, 0px); |
| -webkit-transform: translate(40px, 0px); |
| } |
| .win-listview.win-rtl.win-selectionstylefilled .win-surface.win-selectionmode .win-item { |
| transition: transform 250ms cubic-bezier(0.17, 0.79, 0.215, 1.0025); |
| -webkit-transition: -webkit-transform 250ms cubic-bezier(0.17, 0.79, 0.215, 1.0025); |
| transform: translate(-40px, 0px); |
| -webkit-transform: translate(-40px, 0px); |
| } |
| .win-listview.win-selectionstylefilled .win-surface.win-hidingselectionmode .win-item { |
| transition: transform 250ms cubic-bezier(0.17, 0.79, 0.215, 1.0025); |
| -webkit-transition: -webkit-transform 250ms cubic-bezier(0.17, 0.79, 0.215, 1.0025); |
| transform: none; |
| -webkit-transform: none; |
| } |
| .win-listview.win-rtl.win-selectionstylefilled .win-surface.win-hideselectionmode .win-item { |
| transition: transform 250ms cubic-bezier(0.17, 0.79, 0.215, 1.0025); |
| -webkit-transition: -webkit-transform 250ms cubic-bezier(0.17, 0.79, 0.215, 1.0025); |
| transform: none; |
| -webkit-transform: none; |
| } |
| .win-listview.win-selectionstylefilled .win-surface.win-selectionmode .win-itembox::after { |
| left: 12px; |
| right: auto; |
| top: 50%; |
| margin-top: -9px; |
| display: block; |
| border: 2px solid; |
| width: 16px; |
| height: 16px; |
| } |
| .win-listview.win-selectionstylefilled.win-rtl .win-surface.win-selectionmode .win-itembox::after { |
| left: auto; |
| right: 12px; |
| } |
| .win-listview.win-selectionstylefilled .win-surface.win-selectionmode .win-selectioncheckmarkbackground { |
| left: 12px; |
| top: 50%; |
| margin-top: -9px; |
| display: block; |
| border: 2px solid; |
| width: 16px; |
| height: 16px; |
| } |
| .win-listview.win-selectionstylefilled.win-rtl .win-surface.win-selectionmode .win-selectioncheckmarkbackground { |
| left: auto; |
| right: 12px; |
| } |
| .win-listview.win-selectionstylefilled .win-surface.win-selectionmode .win-selectioncheckmark { |
| left: 13px; |
| top: 50%; |
| margin-top: -8px; |
| display: block; |
| width: 14px; |
| height: 14px; |
| } |
| .win-listview.win-selectionstylefilled.win-rtl .win-surface.win-selectionmode .win-selectioncheckmark { |
| left: 0; |
| right: 10px; |
| } |
| .win-selectionmode .win-itemcontainer.win-selectionstylefilled.win-container .win-itembox.win-selected::after, |
| .win-itemcontainer.win-selectionmode.win-selectionstylefilled.win-container .win-itembox.win-selected::after, |
| .win-listview.win-selectionstylefilled .win-surface.win-selectionmode .win-itembox.win-nonselectable::after, |
| .win-listview .win-surface.win-selectionmode .win-itembox.win-selected::after { |
| display: none; |
| } |
| .win-listview .win-progress { |
| left: 50%; |
| top: 50%; |
| width: 60px; |
| height: 60px; |
| margin-left: -30px; |
| margin-top: -30px; |
| z-index: 1; |
| position: absolute; |
| } |
| .win-listview .win-progress::-ms-fill { |
| animation-name: -ms-ring; |
| } |
| .win-listview .win-itemsblock { |
| overflow: hidden; |
| } |
| .win-listview .win-surface.win-nocssgrid.win-gridlayout, |
| .win-listview .win-horizontal .win-nocssgrid.win-listlayout, |
| .win-listview .win-vertical .win-nocssgrid.win-listlayout.win-headerpositionleft { |
| display: -ms-inline-flexbox; |
| display: -webkit-inline-flex; |
| display: inline-flex; |
| vertical-align: top; |
| } |
| .win-listview .win-horizontal .win-surface.win-nocssgrid { |
| -ms-flex-direction: column; |
| -webkit-flex-direction: column; |
| flex-direction: column; |
| -ms-flex-wrap: wrap; |
| -webkit-flex-wrap: wrap; |
| flex-wrap: wrap; |
| -ms-flex-line-pack: start; |
| -webkit-align-content: flex-start; |
| align-content: flex-start; |
| } |
| .win-listview .win-vertical .win-surface.win-nocssgrid { |
| -ms-flex-direction: row; |
| -webkit-flex-direction: row; |
| flex-direction: row; |
| -ms-flex-wrap: wrap; |
| -webkit-flex-wrap: wrap; |
| flex-wrap: wrap; |
| -ms-flex-line-pack: start; |
| -webkit-align-content: flex-start; |
| align-content: flex-start; |
| } |
| .win-listview .win-vertical .win-structuralnodes.win-single-itemsblock.win-listlayout .win-itemscontainer.win-laidout, |
| .win-listview .win-horizontal .win-structuralnodes.win-single-itemsblock.win-listlayout .win-itemscontainer.win-laidout, |
| .win-listview .win-vertical .win-structuralnodes.win-single-itemsblock.win-gridlayout .win-uniformgridlayout.win-itemscontainer.win-laidout, |
| .win-listview .win-horizontal .win-structuralnodes.win-single-itemsblock.win-gridlayout .win-uniformgridlayout.win-itemscontainer.win-laidout { |
| display: block; |
| } |
| .win-listview .win-vertical .win-structuralnodes.win-single-itemsblock.win-listlayout .win-itemscontainer.win-laidout .win-itemscontainer-padder, |
| .win-listview .win-horizontal .win-structuralnodes.win-single-itemsblock.win-listlayout .win-itemscontainer.win-laidout .win-itemscontainer-padder, |
| .win-listview .win-vertical .win-structuralnodes.win-single-itemsblock.win-gridlayout .win-uniformgridlayout.win-itemscontainer.win-laidout .win-itemscontainer-padder, |
| .win-listview .win-horizontal .win-structuralnodes.win-single-itemsblock.win-gridlayout .win-uniformgridlayout.win-itemscontainer.win-laidout .win-itemscontainer-padder { |
| height: 0; |
| width: 0; |
| } |
| .win-listview.win-groups .win-vertical .win-listlayout.win-headerpositionleft .win-itemscontainer, |
| .win-listview.win-groups .win-vertical .win-listlayout.win-headerpositionleft .win-groupheadercontainer, |
| .win-listview.win-groups .win-horizontal .win-listlayout .win-itemscontainer, |
| .win-listview.win-groups .win-horizontal .win-listlayout .win-groupheadercontainer { |
| display: none; |
| } |
| .win-listview.win-groups .win-vertical .win-listlayout.win-headerpositionleft .win-itemscontainer.win-laidout, |
| .win-listview.win-groups .win-vertical .win-listlayout.win-headerpositionleft .win-groupheadercontainer.win-laidout, |
| .win-listview.win-groups .win-horizontal .win-listlayout .win-groupheadercontainer.win-laidout { |
| display: block; |
| } |
| .win-listview .win-listlayout .win-itemscontainer { |
| overflow: visible; |
| } |
| .win-listview .win-listlayout .win-itemsblock { |
| padding-bottom: 4px; |
| margin-bottom: -4px; |
| } |
| .win-listview > .win-vertical .win-listlayout.win-headerpositiontop .win-groupheader { |
| float: none; |
| } |
| .win-listview > .win-vertical .win-surface.win-listlayout { |
| margin-bottom: 5px; |
| } |
| .win-listview .win-vertical .win-listlayout.win-headerpositionleft.win-surface { |
| display: -ms-inline-grid; |
| -ms-grid-columns: auto 1fr; |
| -ms-grid-rows: auto; |
| } |
| .win-listview .win-vertical .win-listlayout.win-headerpositionleft .win-groupheadercontainer { |
| -ms-grid-column: 1; |
| } |
| .win-listview .win-vertical .win-listlayout.win-headerpositionleft .win-itemscontainer { |
| -ms-grid-column: 2; |
| } |
| .win-listview > .win-horizontal .win-surface.win-listlayout { |
| display: -ms-inline-grid; |
| -ms-grid-columns: auto; |
| -ms-grid-rows: auto; |
| vertical-align: top; |
| } |
| .win-listview .win-horizontal .win-listlayout .win-itemsblock { |
| height: 100%; |
| } |
| .win-listview .win-horizontal .win-listlayout .win-itemscontainer { |
| margin-bottom: 24px; |
| } |
| .win-listview .win-horizontal .win-listlayout .win-container { |
| height: calc(100% - 10px); |
| } |
| .win-listview > .win-horizontal .win-surface.win-listlayout.win-headerpositiontop { |
| -ms-grid-rows: auto 1fr; |
| } |
| .win-listview .win-horizontal .win-listlayout.win-headerpositiontop .win-groupheadercontainer { |
| -ms-grid-row: 1; |
| } |
| .win-listview .win-horizontal .win-listlayout.win-headerpositiontop .win-itemscontainer { |
| -ms-grid-row: 2; |
| } |
| .win-listview .win-gridlayout.win-surface { |
| display: -ms-inline-grid; |
| vertical-align: top; |
| } |
| .win-listview .win-gridlayout .win-container { |
| margin: 5px; |
| } |
| .win-listview .win-vertical .win-gridlayout.win-headerpositionleft .win-groupheadercontainer, |
| .win-listview .win-vertical .win-gridlayout.win-headerpositiontop .win-groupheadercontainer { |
| -ms-grid-column: 1; |
| } |
| .win-listview.win-groups .win-gridlayout .win-itemscontainer, |
| .win-listview.win-groups .win-gridlayout .win-groupheadercontainer { |
| display: none; |
| } |
| .win-listview.win-groups .win-gridlayout .win-groupheadercontainer.win-laidout { |
| display: block; |
| } |
| .win-listview .win-horizontal .win-gridlayout.win-headerpositiontop.win-surface { |
| -ms-grid-columns: auto; |
| -ms-grid-rows: auto 1fr; |
| } |
| .win-listview .win-horizontal .win-gridlayout.win-headerpositiontop .win-groupheadercontainer { |
| -ms-grid-row: 1; |
| } |
| .win-listview .win-horizontal .win-gridlayout.win-headerpositiontop .win-itemscontainer { |
| -ms-grid-row: 2; |
| } |
| .win-listview .win-horizontal .win-gridlayout.win-headerpositionleft.win-surface { |
| -ms-grid-columns: auto; |
| -ms-grid-rows: auto; |
| } |
| .win-listview .win-horizontal .win-gridlayout.win-headerpositionleft .win-groupheadercontainer { |
| -ms-grid-row: 1; |
| } |
| .win-listview .win-horizontal .win-gridlayout.win-headerpositionleft .win-itemscontainer { |
| -ms-grid-row: 1; |
| } |
| .win-listview .win-vertical .win-gridlayout.win-headerpositiontop.win-surface { |
| -ms-grid-columns: auto; |
| -ms-grid-rows: auto; |
| } |
| .win-listview .win-vertical .win-gridlayout.win-headerpositiontop .win-itemscontainer { |
| -ms-grid-column: 1; |
| } |
| .win-listview .win-vertical .win-gridlayout.win-headerpositionleft.win-surface { |
| -ms-grid-columns: auto 1fr; |
| -ms-grid-rows: auto; |
| } |
| .win-listview .win-vertical .win-gridlayout.win-headerpositionleft .win-itemscontainer { |
| -ms-grid-column: 2; |
| } |
| .win-listview .win-gridlayout.win-structuralnodes .win-uniformgridlayout.win-itemscontainer.win-laidout { |
| display: -ms-flexbox; |
| display: -webkit-flex; |
| display: flex; |
| -ms-flex-direction: row; |
| -webkit-flex-direction: row; |
| flex-direction: row; |
| } |
| .win-listview .win-horizontal .win-listlayout .win-itemscontainer, |
| .win-listview.win-groups .win-horizontal .win-listlayout .win-itemscontainer.win-laidout, |
| .win-listview .win-horizontal .win-listlayout .win-itemsblock, |
| .win-listview .win-horizontal .win-gridlayout .win-uniformgridlayout.win-itemscontainer.win-laidout, |
| .win-listview .win-horizontal .win-gridlayout .win-uniformgridlayout .win-itemsblock { |
| display: -ms-flexbox; |
| display: -webkit-flex; |
| display: flex; |
| -ms-flex-direction: column; |
| -webkit-flex-direction: column; |
| flex-direction: column; |
| -ms-flex-wrap: wrap; |
| -webkit-flex-wrap: wrap; |
| flex-wrap: wrap; |
| -ms-flex-line-pack: start; |
| -webkit-align-content: flex-start; |
| align-content: flex-start; |
| } |
| .win-listview .win-horizontal .win-itemscontainer-padder { |
| height: 100%; |
| } |
| .win-listview .win-horizontal .win-gridlayout .win-uniformgridlayout .win-itemsblock { |
| height: 100%; |
| } |
| .win-listview .win-horizontal .win-gridlayout .win-cellspanninggridlayout.win-itemscontainer.win-laidout { |
| display: -ms-grid; |
| } |
| .win-listview .win-vertical .win-gridlayout.win-structuralnodes .win-uniformgridlayout.win-itemscontainer.win-laidout { |
| display: -ms-flexbox; |
| display: -webkit-flex; |
| display: flex; |
| -ms-flex-direction: column; |
| -webkit-flex-direction: column; |
| flex-direction: column; |
| } |
| .win-listview .win-vertical .win-gridlayout .win-uniformgridlayout.win-itemscontainer.win-laidout, |
| .win-listview .win-vertical .win-gridlayout .win-uniformgridlayout .win-itemsblock { |
| display: -ms-flexbox; |
| display: -webkit-flex; |
| display: flex; |
| -ms-flex-direction: row; |
| -webkit-flex-direction: row; |
| flex-direction: row; |
| -ms-flex-wrap: wrap; |
| -webkit-flex-wrap: wrap; |
| flex-wrap: wrap; |
| -ms-flex-line-pack: start; |
| -webkit-align-content: flex-start; |
| align-content: flex-start; |
| } |
| .win-listview .win-vertical .win-gridlayout .win-uniformgridlayout .win-itemsblock { |
| width: 100%; |
| } |
| .win-listview .win-cellspanninggridlayout .win-container.win-laidout { |
| display: block; |
| } |
| .win-listview .win-cellspanninggridlayout .win-container { |
| display: none; |
| } |
| .win-listview .win-itembox { |
| position: relative; |
| } |
| .win-listview.win-dragover .win-itembox { |
| transform: scale(0.86); |
| -webkit-transform: scale(0.86); |
| } |
| .win-listview .win-itembox.win-dragsource, |
| .win-itemcontainer .win-itembox.win-dragsource { |
| opacity: 0.5; |
| transition: opacity cubic-bezier(0.1, 0.9, 0.2, 1) 167ms, transform cubic-bezier(0.1, 0.9, 0.2, 1) 220ms; |
| -webkit-transition: opacity cubic-bezier(0.1, 0.9, 0.2, 1) 167ms, transform cubic-bezier(0.1, 0.9, 0.2, 1) 220ms; |
| } |
| .win-listview.win-dragover .win-itembox.win-dragsource { |
| opacity: 0; |
| transition: none; |
| -webkit-transition: none; |
| } |
| html.win-hoverable .win-listview.win-dragover .win-container:hover { |
| outline: none; |
| } |
| .win-listview .win-itembox { |
| transition: transform cubic-bezier(0.1, 0.9, 0.2, 1) 220ms; |
| -webkit-transition: -webkit-transform cubic-bezier(0.1, 0.9, 0.2, 1) 220ms; |
| } |
| .win-listview.win-groups > .win-vertical .win-surface.win-listlayout.win-headerpositionleft { |
| margin-left: 70px; |
| } |
| .win-listview.win-groups.win-rtl > .win-vertical .win-surface.win-listlayout.win-headerpositionleft { |
| margin-left: 0px; |
| margin-right: 70px; |
| } |
| .win-listview > .win-horizontal .win-surface.win-listlayout { |
| margin-left: 70px; |
| } |
| .win-listview.win-rtl > .win-horizontal .win-surface.win-listlayout { |
| margin-left: 0px; |
| margin-right: 70px; |
| } |
| .win-listview .win-vertical .win-gridlayout.win-surface { |
| margin-left: 20px; |
| } |
| .win-listview.win-rtl .win-vertical .win-gridlayout.win-surface { |
| margin-left: 0px; |
| margin-right: 20px; |
| } |
| .win-itemcontainer .win-itembox, |
| .win-itemcontainer.win-container { |
| position: relative; |
| } |
| .win-itemcontainer { |
| touch-action: pan-x pan-y pinch-zoom; |
| } |
| html.win-hoverable .win-listview .win-itembox:hover::before, |
| html.win-hoverable .win-itemcontainer .win-itembox:hover::before { |
| opacity: 0.4; |
| } |
| html.win-hoverable .win-listview .win-pressed .win-itembox:hover::before, |
| html.win-hoverable .win-listview .win-pressed.win-itembox:hover::before, |
| html.win-hoverable .win-itemcontainer.win-pressed .win-itembox:hover::before { |
| opacity: 0.6; |
| } |
| html.win-hoverable .win-listview.win-selectionstylefilled .win-container:hover, |
| html.win-hoverable .win-itemcontainer.win-selectionstylefilled.win-container:hover, |
| html.win-hoverable .win-selectionstylefilled .win-itemcontainer.win-container:hover { |
| outline: none; |
| } |
| .win-selectionstylefilled.win-itemcontainer .win-itembox, |
| .win-selectionstylefilled .win-itemcontainer .win-itembox, |
| .win-listview.win-selectionstylefilled .win-itembox { |
| background-color: transparent; |
| } |
| .win-listview.win-selectionstylefilled .win-container.win-selected .win-selectionborder, |
| .win-itemcontainer.win-selectionstylefilled.win-container.win-selected .win-selectionborder { |
| border-color: transparent; |
| } |
| .win-listview.win-selectionstylefilled .win-surface.win-selectionmode .win-itembox::after { |
| background-color: transparent; |
| } |
| .win-listview.win-selectionstylefilled .win-selectioncheckmarkbackground, |
| .win-itemcontainer.win-selectionstylefilled .win-selectioncheckmarkbackground { |
| border-color: transparent; |
| } |
| .win-listview.win-selectionstylefilled .win-selected a, |
| .win-listview.win-selectionstylefilled .win-selected progress, |
| .win-listview.win-selectionstylefilled .win-selected .win-rating .win-star.win-full, |
| .win-itemcontainer.win-selectionstylefilled.win-selected a, |
| .win-itemcontainer.win-selectionstylefilled.win-selected progress, |
| .win-itemcontainer.win-selectionstylefilled.win-selected .win-rating .win-star.win-full { |
| color: #ffffff; |
| } |
| .win-listview.win-selectionstylefilled .win-selected.win-selected a:hover:active, |
| .win-itemcontainer.win-selectionstylefilled.win-selected.win-selected a:hover:active { |
| color: rgba(255, 255, 255, 0.6); |
| } |
| html.win-hoverable .win-listview.win-selectionstylefilled .win-selected a:hover, |
| html.win-hoverable .win-itemcontainer.win-selectionstylefilled.win-selected a:hover { |
| color: rgba(255, 255, 255, 0.8); |
| } |
| .win-listview.win-selectionstylefilled .win-selected button, |
| .win-listview.win-selectionstylefilled .win-selected input[type=button], |
| .win-listview.win-selectionstylefilled .win-selected input[type=reset], |
| .win-listview.win-selectionstylefilled .win-selected input[type=text], |
| .win-listview.win-selectionstylefilled .win-selected input[type=password], |
| .win-listview.win-selectionstylefilled .win-selected input[type=email], |
| .win-listview.win-selectionstylefilled .win-selected input[type=number], |
| .win-listview.win-selectionstylefilled .win-selected input[type=tel], |
| .win-listview.win-selectionstylefilled .win-selected input[type=url], |
| .win-listview.win-selectionstylefilled .win-selected input[type=search], |
| .win-listview.win-selectionstylefilled .win-selected input::-ms-check, |
| .win-listview.win-selectionstylefilled .win-selected textarea, |
| .win-listview.win-selectionstylefilled .win-selected .win-textarea, |
| .win-listview.win-selectionstylefilled .win-selected select, |
| .win-itemcontainer.win-selectionstylefilled.win-selected button, |
| .win-itemcontainer.win-selectionstylefilled.win-selected input[type=button], |
| .win-itemcontainer.win-selectionstylefilled.win-selected input[type=reset], |
| .win-itemcontainer.win-selectionstylefilled.win-selected input[type=text], |
| .win-itemcontainer.win-selectionstylefilled.win-selected input[type=password], |
| .win-itemcontainer.win-selectionstylefilled.win-selected input[type=email], |
| .win-itemcontainer.win-selectionstylefilled.win-selected input[type=number], |
| .win-itemcontainer.win-selectionstylefilled.win-selected input[type=tel], |
| .win-itemcontainer.win-selectionstylefilled.win-selected input[type=url], |
| .win-itemcontainer.win-selectionstylefilled.win-selected input[type=search], |
| .win-itemcontainer.win-selectionstylefilled.win-selected input::-ms-check, |
| .win-itemcontainer.win-selectionstylefilled.win-selected textarea, |
| .win-itemcontainer.win-selectionstylefilled.win-selected .win-textarea, |
| .win-itemcontainer.win-selectionstylefilled.win-selected select { |
| background-clip: border-box; |
| background-color: rgba(255, 255, 255, 0.8); |
| border-color: transparent; |
| color: #000000; |
| } |
| .win-listview.win-selectionstylefilled .win-selected button[type=submit], |
| .win-listview.win-selectionstylefilled .win-selected input[type=submit], |
| .win-itemcontainer.win-selectionstylefilled.win-selected button[type=submit], |
| .win-itemcontainer.win-selectionstylefilled.win-selected input[type=submit] { |
| border-color: #ffffff; |
| } |
| .win-listview.win-selectionstylefilled .win-selected input[type=range]::-ms-fill-lower, |
| .win-itemcontainer.win-selectionstylefilled.win-selected input[type=range]::-ms-fill-lower { |
| background-color: #ffffff; |
| } |
| .win-listview.win-selectionstylefilled .win-selected input[type=range]::-ms-thumb, |
| .win-itemcontainer.win-selectionstylefilled.win-selected input[type=range]::-ms-thumb { |
| background-color: #000000; |
| } |
| .win-listview.win-selectionstylefilled .win-selected input[type=range]::-ms-fill-upper, |
| .win-listview.win-selectionstylefilled .win-selected progress, |
| .win-itemcontainer.win-selectionstylefilled.win-selected input[type=range]::-ms-fill-upper, |
| .win-itemcontainer.win-selectionstylefilled.win-selected progress { |
| background-color: rgba(255, 255, 255, 0.16); |
| } |
| .win-listview.win-selectionstylefilled .win-selected progress:indeterminate, |
| .win-itemcontainer.win-selectionstylefilled.win-selected progress:indeterminate { |
| background-color: transparent; |
| } |
| .win-listview.win-selectionstylefilled .win-selected .win-rating .win-star.win-empty, |
| .win-itemcontainer.win-selectionstylefilled.win-selected .win-rating .win-star.win-empty { |
| color: rgba(255, 255, 255, 0.16); |
| } |
| .win-listview .win-viewport { |
| outline: none; |
| } |
| @media (-ms-high-contrast) { |
| .win-listview .win-groupheader { |
| color: WindowText; |
| } |
| .win-selectioncheckmark { |
| color: HighlightText; |
| } |
| .win-listview .win-focusedoutline, |
| .win-listview .win-groupheader, |
| .win-itemcontainer .win-focusedoutline { |
| outline-color: WindowText; |
| } |
| .win-listview.win-selectionstylefilled .win-itembox, |
| .win-itemcontainer.win-selectionstylefilled .win-itembox { |
| background-color: Window; |
| color: WindowText; |
| } |
| html.win-hoverable .win-listview.win-selectionstylefilled .win-container:hover .win-itembox, |
| html.win-hoverable .win-itemcontainer.win-selectionstylefilled.win-container:hover .win-itembox { |
| background-color: Highlight; |
| color: HighlightText; |
| } |
| .win-listview.win-selectionstylefilled .win-container.win-selected .win-itembox, |
| html.win-hoverable .win-listview.win-selectionstylefilled .win-container.win-selected:hover .win-itembox, |
| .win-itemcontainer.win-selectionstylefilled.win-container.win-selected .win-itembox, |
| html.win-hoverable .win-itemcontainer.win-selectionstylefilled.win-container.win-selected:hover .win-itembox { |
| background-color: Highlight; |
| color: HighlightText; |
| } |
| .win-listview:not(.win-selectionstylefilled) .win-container.win-selected .win-selectionborder, |
| .win-itemcontainer:not(.win-selectionstylefilled).win-container.win-selected .win-selectionborder { |
| border-color: Highlight; |
| } |
| .win-listview.win-selectionstylefilled .win-container.win-selected .win-selectionborder, |
| .win-itemcontainer.win-selectionstylefilled.win-container.win-selected .win-selectionborder { |
| border-color: transparent; |
| } |
| html.win-hoverable .win-listview:not(.win-selectionstylefilled) .win-container.win-selected:hover .win-selectionborder, |
| html.win-hoverable .win-itemcontainer:not(.win-selectionstylefilled).win-container.win-selected:hover .win-selectionborder { |
| border-color: Highlight; |
| } |
| .win-listview.win-selectionstylefilled .win-selected .win-selectionbackground, |
| html.win-hoverable .win-listview.win-selectionstylefilled .win-selected:hover .win-selectionbackground, |
| .win-itemcontainer.win-selectionstylefilled.win-selected .win-selectionbackground, |
| html.win-hoverable .win-itemcontainer.win-selectionstylefilled.win-selected:hover .win-selectionbackground { |
| background-color: Highlight; |
| color: HighlightText; |
| } |
| .win-listview.win-selectionstylefilled .win-selectioncheckmarkbackground, |
| .win-itemcontainer.win-selectionstylefilled .win-selectioncheckmarkbackground { |
| border-color: transparent; |
| } |
| .win-listview.win-selectionstylefilled .win-selected a, |
| html.win-hoverable .win-listview.win-selectionstylefilled .win-container:hover a, |
| .win-listview.win-selectionstylefilled .win-selected progress, |
| html.win-hoverable .win-listview.win-selectionstylefilled .win-container:hover progress, |
| .win-listview.win-selectionstylefilled .win-selected .win-rating .win-star:after, |
| html.win-hoverable .win-listview.win-selectionstylefilled .win-container:hover .win-rating .win-star:after, |
| .win-itemcontainer.win-selectionstylefilled.win-selected a, |
| html.win-hoverable .win-itemcontainer.win-selectionstylefilled.win-container:hover a, |
| .win-itemcontainer.win-selectionstylefilled.win-selected progress, |
| html.win-hoverable .win-itemcontainer.win-selectionstylefilled.win-container:hover progress, |
| .win-itemcontainer.win-selectionstylefilled.win-selected .win-rating .win-star:after, |
| html.win-hoverable .win-itemcontainer.win-selectionstylefilled.win-container:hover .win-rating .win-star:after { |
| color: HighlightText; |
| } |
| .win-listview.win-selectionstylefilled .win-selected input, |
| html.win-hoverable .win-listview.win-selectionstylefilled .win-container:hover input, |
| .win-listview.win-selectionstylefilled .win-selected input::-ms-check, |
| html.win-hoverable .win-listview.win-selectionstylefilled .win-container:hover input::-ms-check, |
| .win-listview.win-selectionstylefilled .win-selected input::-ms-value, |
| html.win-hoverable .win-listview.win-selectionstylefilled .win-container:hover input::-ms-value, |
| .win-listview.win-selectionstylefilled .win-selected input::-ms-track, |
| html.win-hoverable .win-listview.win-selectionstylefilled .win-container:hover input::-ms-track, |
| .win-listview.win-selectionstylefilled .win-selected button, |
| html.win-hoverable .win-listview.win-selectionstylefilled .win-container:hover button, |
| .win-listview.win-selectionstylefilled .win-selected progress, |
| html.win-hoverable .win-listview.win-selectionstylefilled .win-container:hover progress, |
| .win-listview.win-selectionstylefilled .win-selected progress::-ms-fill, |
| html.win-hoverable .win-listview.win-selectionstylefilled .win-container:hover progress::-ms-fill, |
| .win-listview.win-selectionstylefilled .win-selected select, |
| html.win-hoverable .win-listview.win-selectionstylefilled .win-container:hover select, |
| .win-listview.win-selectionstylefilled .win-selected textarea, |
| html.win-hoverable .win-listview.win-selectionstylefilled .win-container:hover textarea, |
| .win-listview.win-selectionstylefilled.win-selected input, |
| html.win-hoverable .win-itemcontainer.win-selectionstylefilled.win-container:hover input, |
| .win-itemcontainer.win-selectionstylefilled.win-selected input::-ms-check, |
| html.win-hoverable .win-itemcontainer.win-selectionstylefilled.win-container:hover input::-ms-check, |
| .win-itemcontainer.win-selectionstylefilled.win-selected input::-ms-value, |
| html.win-hoverable .win-itemcontainer.win-selectionstylefilled.win-container:hover input::-ms-value, |
| .win-itemcontainer.win-selectionstylefilled.win-selected input::-ms-track, |
| html.win-hoverable .win-itemcontainer.win-selectionstylefilled.win-container:hover input::-ms-track, |
| .win-itemcontainer.win-selectionstylefilled.win-selected button, |
| html.win-hoverable .win-itemcontainer.win-selectionstylefilled.win-container:hover button, |
| .win-itemcontainer.win-selectionstylefilled.win-selected progress, |
| html.win-hoverable .win-itemcontainer.win-selectionstylefilled.win-container:hover progress, |
| .win-itemcontainer.win-selectionstylefilled.win-selected progress::-ms-fill, |
| html.win-hoverable .win-itemcontainer.win-selectionstylefilled.win-container:hover progress::-ms-fill, |
| .win-itemcontainer.win-selectionstylefilled.win-selected select, |
| html.win-hoverable .win-itemcontainer.win-selectionstylefilled.win-container:hover select, |
| .win-itemcontainer.win-selectionstylefilled.win-selected textarea, |
| html.win-hoverable .win-itemcontainer.win-selectionstylefilled.win-container:hover textarea { |
| border-color: HighlightText; |
| } |
| .win-listview.win-selectionstylefilled .win-selected input[type=range]::-ms-fill-lower, |
| html.win-hoverable .win-listview.win-selectionstylefilled .win-container:hover input[type=range]::-ms-fill-lower, |
| .win-listview.win-selectionstylefilled .win-selected progress::-ms-fill, |
| html.win-hoverable .win-listview.win-selectionstylefilled .win-container:hover progress::-ms-fill, |
| .win-itemcontainer.win-selectionstylefilled.win-selected input[type=range]::-ms-fill-lower, |
| html.win-hoverable .win-itemcontainer.win-selectionstylefilled.win-container:hover input[type=range]::-ms-fill-lower, |
| .win-itemcontainer.win-selectionstylefilled.win-selected progress::-ms-fill, |
| html.win-hoverable .win-itemcontainer.win-selectionstylefilled.win-container:hover progress::-ms-fill { |
| background-color: HighlightText; |
| } |
| .win-listview.win-selectionstylefilled .win-selected input[type=range]::-ms-fill-upper, |
| html.win-hoverable .win-listview.win-selectionstylefilled .win-container:hover input[type=range]::-ms-fill-upper, |
| .win-listview.win-selectionstylefilled .win-selected progress, |
| html.win-hoverable .win-listview.win-selectionstylefilled .win-container:hover progress, |
| .win-itemcontainer.win-selectionstylefilled.win-selected input[type=range]::-ms-fill-upper, |
| html.win-hoverable .win-itemcontainer.win-selectionstylefilled.win-container:hover input[type=range]::-ms-fill-upper, |
| .win-itemcontainer.win-selectionstylefilled.win-selected progress, |
| html.win-hoverable .win-itemcontainer.win-selectionstylefilled.win-container:hover progress { |
| background-color: Highlight; |
| } |
| .win-listview.win-selectionstylefilled .win-selected .win-rating .win-star.win-full:before, |
| html.win-hoverable .win-listview.win-selectionstylefilled .win-container:hover .win-rating .win-star.win-full:before, |
| .win-itemcontainer.win-selectionstylefilled.win-selected .win-rating .win-star.win-full:before, |
| html.win-hoverable .win-itemcontainer.win-selectionstylefilled.win-container:hover .win-rating .win-star.win-full:before { |
| color: ButtonFace; |
| } |
| .win-listview.win-selectionstylefilled .win-selected .win-rating .win-star.win-empty:before, |
| html.win-hoverable .win-listview.win-selectionstylefilled .win-container:hover .win-rating .win-star.win-empty:before, |
| .win-itemcontainer.win-selectionstylefilled.win-selected .win-rating .win-star.win-empty:before, |
| html.win-hoverable .win-itemcontainer.win-selectionstylefilled.win-container:hover .win-rating .win-star.win-empty:before { |
| color: Highlight; |
| } |
| html.win-hoverable .win-listview .win-container:hover, |
| html.win-hoverable .win-itemcontainer.win-container:hover { |
| outline: Highlight solid 3px; |
| } |
| } |
| .win-flipview { |
| overflow: hidden; |
| height: 400px; |
| /* Necessary for detecting element resize */ |
| position: relative; |
| } |
| .win-flipview .win-surface { |
| -ms-scroll-chaining: none; |
| } |
| .win-flipview .win-navleft { |
| left: 0%; |
| top: 50%; |
| margin-top: -19px; |
| } |
| .win-flipview .win-navright { |
| left: 100%; |
| top: 50%; |
| margin-left: -20px; |
| margin-top: -19px; |
| } |
| .win-flipview .win-navtop { |
| left: 50%; |
| top: 0%; |
| margin-left: -35px; |
| } |
| .win-flipview .win-navbottom { |
| left: 50%; |
| top: 100%; |
| margin-left: -35px; |
| margin-top: -36px; |
| } |
| .win-flipview .win-navbutton { |
| touch-action: manipulation; |
| border: none; |
| width: 20px; |
| height: 36px; |
| z-index: 1; |
| position: absolute; |
| font-family: "Segoe MDL2 Assets", "Symbols"; |
| font-size: 16px; |
| padding: 0; |
| min-width: 0; |
| } |
| .win-flipview .win-item, |
| .win-flipview .win-item > .win-template { |
| height: 100%; |
| width: 100%; |
| display: -ms-flexbox; |
| display: -webkit-flex; |
| display: flex; |
| -ms-flex-align: center; |
| -webkit-align-items: center; |
| align-items: center; |
| -ms-flex-pack: center; |
| -webkit-justify-content: center; |
| justify-content: center; |
| } |
| @media (-ms-high-contrast) { |
| .win-flipview .win-navbottom { |
| left: 50%; |
| top: 100%; |
| margin-left: -35px; |
| margin-top: -35px; |
| } |
| .win-flipview .win-navbutton { |
| background-color: ButtonFace; |
| color: ButtonText; |
| border: 2px solid ButtonText; |
| width: 65px; |
| height: 35px; |
| } |
| .win-flipview .win-navbutton.win-navbutton:hover:active, |
| .win-flipview .win-navbutton.win-navbutton:active { |
| background-color: ButtonText; |
| color: ButtonFace; |
| } |
| .win-flipview .win-navright { |
| margin-left: -65px; |
| } |
| html.win-hoverable .win-flipview .win-navbutton:hover { |
| background-color: Highlight; |
| color: HighlightText; |
| } |
| } |
| .win-datepicker { |
| display: -ms-inline-flexbox; |
| display: -webkit-inline-flex; |
| display: inline-flex; |
| height: auto; |
| width: auto; |
| } |
| .win-datepicker select { |
| min-width: 80px; |
| margin-top: 4px; |
| margin-bottom: 4px; |
| } |
| .win-datepicker .win-datepicker-month { |
| margin-right: 20px; |
| } |
| .win-datepicker .win-datepicker-date.win-order0, |
| .win-datepicker .win-datepicker-date.win-order1 { |
| margin-right: 20px; |
| } |
| .win-datepicker .win-datepicker-year.win-order0 { |
| margin-right: 20px; |
| } |
| .win-datepicker .win-datepicker-month:lang(ar), |
| .win-datepicker .win-datepicker-month:lang(dv), |
| .win-datepicker .win-datepicker-month:lang(fa), |
| .win-datepicker .win-datepicker-month:lang(he), |
| .win-datepicker .win-datepicker-month:lang(ku-Arab), |
| .win-datepicker .win-datepicker-month:lang(pa-Arab), |
| .win-datepicker .win-datepicker-month:lang(prs), |
| .win-datepicker .win-datepicker-month:lang(ps), |
| .win-datepicker .win-datepicker-month:lang(sd-Arab), |
| .win-datepicker .win-datepicker-month:lang(syr), |
| .win-datepicker .win-datepicker-month:lang(ug), |
| .win-datepicker .win-datepicker-month:lang(ur), |
| .win-datepicker .win-datepicker-month:lang(qps-plocm), |
| .win-datepicker .win-datepicker-date.win-order0:lang(ar), |
| .win-datepicker .win-datepicker-date.win-order0:lang(dv), |
| .win-datepicker .win-datepicker-date.win-order0:lang(fa), |
| .win-datepicker .win-datepicker-date.win-order0:lang(he), |
| .win-datepicker .win-datepicker-date.win-order0:lang(ku-Arab), |
| .win-datepicker .win-datepicker-date.win-order0:lang(pa-Arab), |
| .win-datepicker .win-datepicker-date.win-order0:lang(prs), |
| .win-datepicker .win-datepicker-date.win-order0:lang(ps), |
| .win-datepicker .win-datepicker-date.win-order0:lang(sd-Arab), |
| .win-datepicker .win-datepicker-date.win-order0:lang(syr), |
| .win-datepicker .win-datepicker-date.win-order0:lang(ug), |
| .win-datepicker .win-datepicker-date.win-order0:lang(ur), |
| .win-datepicker .win-datepicker-date.win-order0:lang(qps-plocm), |
| .win-datepicker .win-datepicker-date.win-order1:lang(ar), |
| .win-datepicker .win-datepicker-date.win-order1:lang(dv), |
| .win-datepicker .win-datepicker-date.win-order1:lang(fa), |
| .win-datepicker .win-datepicker-date.win-order1:lang(he), |
| .win-datepicker .win-datepicker-date.win-order1:lang(ku-Arab), |
| .win-datepicker .win-datepicker-date.win-order1:lang(pa-Arab), |
| .win-datepicker .win-datepicker-date.win-order1:lang(prs), |
| .win-datepicker .win-datepicker-date.win-order1:lang(ps), |
| .win-datepicker .win-datepicker-date.win-order1:lang(sd-Arab), |
| .win-datepicker .win-datepicker-date.win-order1:lang(syr), |
| .win-datepicker .win-datepicker-date.win-order1:lang(ug), |
| .win-datepicker .win-datepicker-date.win-order1:lang(ur), |
| .win-datepicker .win-datepicker-date.win-order1:lang(qps-plocm), |
| .win-datepicker .win-datepicker-year.win-order0:lang(ar), |
| .win-datepicker .win-datepicker-year.win-order0:lang(dv), |
| .win-datepicker .win-datepicker-year.win-order0:lang(fa), |
| .win-datepicker .win-datepicker-year.win-order0:lang(he), |
| .win-datepicker .win-datepicker-year.win-order0:lang(ku-Arab), |
| .win-datepicker .win-datepicker-year.win-order0:lang(pa-Arab), |
| .win-datepicker .win-datepicker-year.win-order0:lang(prs), |
| .win-datepicker .win-datepicker-year.win-order0:lang(ps), |
| .win-datepicker .win-datepicker-year.win-order0:lang(sd-Arab), |
| .win-datepicker .win-datepicker-year.win-order0:lang(syr), |
| .win-datepicker .win-datepicker-year.win-order0:lang(ug), |
| .win-datepicker .win-datepicker-year.win-order0:lang(ur), |
| .win-datepicker .win-datepicker-year.win-order0:lang(qps-plocm) { |
| margin-right: 0; |
| margin-left: 20px; |
| } |
| .win-timepicker { |
| display: -ms-inline-flexbox; |
| display: -webkit-inline-flex; |
| display: inline-flex; |
| height: auto; |
| width: auto; |
| } |
| .win-timepicker select { |
| min-width: 80px; |
| margin-top: 4px; |
| margin-bottom: 4px; |
| } |
| .win-timepicker .win-timepicker-hour { |
| margin-right: 20px; |
| } |
| .win-timepicker .win-timepicker-period.win-order0 { |
| margin-right: 20px; |
| } |
| .win-timepicker .win-timepicker-minute.win-order1 { |
| margin-right: 20px; |
| } |
| .win-timepicker .win-timepicker-period.win-order0:lang(ar), |
| .win-timepicker .win-timepicker-period.win-order0:lang(dv), |
| .win-timepicker .win-timepicker-period.win-order0:lang(fa), |
| .win-timepicker .win-timepicker-period.win-order0:lang(he), |
| .win-timepicker .win-timepicker-period.win-order0:lang(ku-Arab), |
| .win-timepicker .win-timepicker-period.win-order0:lang(pa-Arab), |
| .win-timepicker .win-timepicker-period.win-order0:lang(prs), |
| .win-timepicker .win-timepicker-period.win-order0:lang(ps), |
| .win-timepicker .win-timepicker-period.win-order0:lang(sd-Arab), |
| .win-timepicker .win-timepicker-period.win-order0:lang(syr), |
| .win-timepicker .win-timepicker-period.win-order0:lang(ug), |
| .win-timepicker .win-timepicker-period.win-order0:lang(ur), |
| .win-timepicker .win-timepicker-period.win-order0:lang(qps-plocm), |
| .win-timepicker .win-timepicker-hour:lang(ar), |
| .win-timepicker .win-timepicker-hour:lang(dv), |
| .win-timepicker .win-timepicker-hour:lang(fa), |
| .win-timepicker .win-timepicker-hour:lang(he), |
| .win-timepicker .win-timepicker-hour:lang(ku-Arab), |
| .win-timepicker .win-timepicker-hour:lang(pa-Arab), |
| .win-timepicker .win-timepicker-hour:lang(prs), |
| .win-timepicker .win-timepicker-hour:lang(ps), |
| .win-timepicker .win-timepicker-hour:lang(sd-Arab), |
| .win-timepicker .win-timepicker-hour:lang(syr), |
| .win-timepicker .win-timepicker-hour:lang(ug), |
| .win-timepicker .win-timepicker-hour:lang(ur), |
| .win-timepicker .win-timepicker-hour:lang(qps-plocm) { |
| margin-right: 0; |
| margin-left: 20px; |
| } |
| .win-timepicker .win-timepicker-minute.win-order1:lang(ar), |
| .win-timepicker .win-timepicker-minute.win-order1:lang(dv), |
| .win-timepicker .win-timepicker-minute.win-order1:lang(fa), |
| .win-timepicker .win-timepicker-minute.win-order1:lang(he), |
| .win-timepicker .win-timepicker-minute.win-order1:lang(ku-Arab), |
| .win-timepicker .win-timepicker-minute.win-order1:lang(pa-Arab), |
| .win-timepicker .win-timepicker-minute.win-order1:lang(prs), |
| .win-timepicker .win-timepicker-minute.win-order1:lang(ps), |
| .win-timepicker .win-timepicker-minute.win-order1:lang(sd-Arab), |
| .win-timepicker .win-timepicker-minute.win-order1:lang(syr), |
| .win-timepicker .win-timepicker-minute.win-order1:lang(ug), |
| .win-timepicker .win-timepicker-minute.win-order1:lang(ur), |
| .win-timepicker .win-timepicker-minute.win-order1:lang(qps-plocm), |
| .win-timepicker .win-timepicker-minute.win-order0:lang(ar), |
| .win-timepicker .win-timepicker-minute.win-order0:lang(dv), |
| .win-timepicker .win-timepicker-minute.win-order0:lang(fa), |
| .win-timepicker .win-timepicker-minute.win-order0:lang(he), |
| .win-timepicker .win-timepicker-minute.win-order0:lang(ku-Arab), |
| .win-timepicker .win-timepicker-minute.win-order0:lang(pa-Arab), |
| .win-timepicker .win-timepicker-minute.win-order0:lang(prs), |
| .win-timepicker .win-timepicker-minute.win-order0:lang(ps), |
| .win-timepicker .win-timepicker-minute.win-order0:lang(sd-Arab), |
| .win-timepicker .win-timepicker-minute.win-order0:lang(syr), |
| .win-timepicker .win-timepicker-minute.win-order0:lang(ug), |
| .win-timepicker .win-timepicker-minute.win-order0:lang(ur), |
| .win-timepicker .win-timepicker-minute.win-order0:lang(qps-plocm) { |
| margin-left: 20px; |
| margin-right: 0; |
| } |
| body > .win-navigation-backbutton { |
| position: absolute; |
| top: 50px; |
| left: 20px; |
| } |
| .win-backbutton, |
| .win-navigation-backbutton, |
| .win-back { |
| touch-action: manipulation; |
| display: inline-block; |
| min-width: 0; |
| min-height: 0; |
| padding: 0; |
| text-align: center; |
| width: 41px; |
| height: 41px; |
| font-size: 24px; |
| line-height: 41px; |
| vertical-align: baseline; |
| } |
| .win-backbutton::before, |
| .win-back::before { |
| font-family: "Segoe MDL2 Assets", "Symbols"; |
| font-weight: normal; |
| content: "\E0D5"; |
| vertical-align: 50%; |
| } |
| .win-backbutton:lang(ar)::before, |
| .win-backbutton:lang(dv)::before, |
| .win-backbutton:lang(fa)::before, |
| .win-backbutton:lang(he)::before, |
| .win-backbutton:lang(ku-Arab)::before, |
| .win-backbutton:lang(pa-Arab)::before, |
| .win-backbutton:lang(prs)::before, |
| .win-backbutton:lang(ps)::before, |
| .win-backbutton:lang(sd-Arab)::before, |
| .win-backbutton:lang(syr)::before, |
| .win-backbutton:lang(ug)::before, |
| .win-backbutton:lang(ur)::before, |
| .win-backbutton:lang(qps-plocm)::before, |
| .win-back:lang(ar)::before, |
| .win-back:lang(dv)::before, |
| .win-back:lang(fa)::before, |
| .win-back:lang(he)::before, |
| .win-back:lang(ku-Arab)::before, |
| .win-back:lang(pa-Arab)::before, |
| .win-back:lang(prs)::before, |
| .win-back:lang(ps)::before, |
| .win-back:lang(sd-Arab)::before, |
| .win-back:lang(syr)::before, |
| .win-back:lang(ug)::before, |
| .win-back:lang(ur)::before, |
| .win-back:lang(qps-plocm)::before { |
| content: "\E0AE"; |
| } |
| button.win-navigation-backbutton, |
| button.win-navigation-backbutton:active, |
| html.win-hoverable button.win-navigation-backbutton:enabled:hover, |
| button.win-navigation-backbutton:enabled:hover:active { |
| background-color: transparent; |
| border: none; |
| } |
| @media (-ms-high-contrast) { |
| button.win-navigation-backbutton, |
| button.win-navigation-backbutton:active, |
| html.win-hoverable button.win-navigation-backbutton:enabled:hover, |
| button.win-navigation-backbutton:enabled:hover:active { |
| /* Overwrite default background and border styles from BackButton control's <button> element */ |
| background-color: transparent; |
| border: none; |
| } |
| .win-backbutton, |
| .win-back { |
| background-color: ButtonFace; |
| border-color: ButtonText; |
| color: ButtonText; |
| } |
| .win-backbutton.win-backbutton:enabled:hover:active, |
| .win-navigation-backbutton.win-navigation-backbutton:enabled:hover:active .win-back { |
| background-clip: border-box; |
| background-color: ButtonText; |
| border-color: transparent; |
| color: ButtonFace; |
| } |
| .win-backbutton:disabled, |
| .win-navigation-backbutton:disabled .win-back, |
| .win-backbutton:disabled:active, |
| .win-navigation-backbutton:disabled:active .win-back { |
| background-color: ButtonFace; |
| border-color: GrayText; |
| color: GrayText; |
| } |
| .win-backbutton:-ms-keyboard-active, |
| .win-navigation-backbutton:-ms-keyboard-active .win-back { |
| background-clip: border-box; |
| background-color: ButtonText; |
| border-color: transparent; |
| color: ButtonFace; |
| } |
| html.win-hoverable .win-backbutton:enabled:hover, |
| html.win-hoverable .win-navigation-backbutton:enabled:hover .win-back { |
| background-color: Highlight; |
| border-color: ButtonText; |
| color: HighlightText; |
| } |
| } |
| .win-tooltip { |
| display: block; |
| position: fixed; |
| top: 30px; |
| left: 30px; |
| max-width: 320px; |
| box-sizing: border-box; |
| margin: 0; |
| padding: 4px 7px 6px 7px; |
| border-style: solid; |
| border-width: 1px; |
| z-index: 9999; |
| word-wrap: break-word; |
| animation-fill-mode: both; |
| font-size: 12px; |
| font-weight: 400; |
| line-height: 1.167; |
| } |
| .win-tooltip-phantom { |
| display: block; |
| position: fixed; |
| top: 30px; |
| left: 30px; |
| background-color: transparent; |
| border-width: 0; |
| margin: 0; |
| padding: 0; |
| } |
| @media (-ms-high-contrast) { |
| .win-tooltip { |
| background-color: Window; |
| border-color: WindowText; |
| color: WindowText; |
| } |
| } |
| .win-rating { |
| display: -ms-inline-flexbox; |
| display: -webkit-inline-flex; |
| display: inline-flex; |
| -ms-flex-pack: self; |
| -webkit-justify-content: self; |
| justify-content: self; |
| -ms-flex-align: stretch; |
| -webkit-align-items: stretch; |
| align-items: stretch; |
| height: auto; |
| width: auto; |
| white-space: normal; |
| outline: 0; |
| } |
| .win-rating .win-star { |
| -ms-flex: 1 1 auto; |
| -webkit-flex: 1 1 auto; |
| flex: 1 1 auto; |
| height: 24px; |
| width: 24px; |
| padding: 9px 10px 11px 10px; |
| font-family: "Segoe MDL2 Assets", "Symbols"; |
| font-size: 24px; |
| overflow: hidden; |
| text-indent: 0; |
| line-height: 1; |
| cursor: default; |
| position: relative; |
| letter-spacing: 0; |
| -ms-touch-action: none; |
| touch-action: none; |
| } |
| .win-rating.win-small .win-star { |
| width: 12px; |
| height: 12px; |
| font-size: 12px; |
| padding: 3px 4px 5px 4px; |
| } |
| .win-rating .win-star:before { |
| content: "\E082"; |
| } |
| .win-rating .win-star.win-disabled { |
| cursor: default; |
| -ms-touch-action: auto; |
| touch-action: auto; |
| } |
| @media (-ms-high-contrast) { |
| .win-rating .win-star:before { |
| content: "\E082" !important; |
| } |
| .win-rating .win-star.win-full { |
| color: HighLight; |
| } |
| .win-rating .win-star.win-tentative.win-full { |
| color: ButtonText; |
| } |
| .win-rating .win-star.win-empty { |
| color: ButtonFace; |
| } |
| .win-rating .win-star:after { |
| content: "\E224" !important; |
| position: relative; |
| top: -100%; |
| color: ButtonText; |
| } |
| } |
| .win-toggleswitch { |
| outline: 0; |
| } |
| .win-toggleswitch .win-toggleswitch-header { |
| max-width: 470px; |
| margin-bottom: 14px; |
| margin-top: 22px; |
| font-size: 15px; |
| font-weight: 400; |
| line-height: 1.333; |
| } |
| .win-toggleswitch .win-toggleswitch-values { |
| display: inline-block; |
| vertical-align: top; |
| } |
| .win-toggleswitch .win-toggleswitch-value { |
| margin-left: 12px; |
| height: 20px; |
| vertical-align: top; |
| font-size: 15px; |
| font-weight: 400; |
| line-height: 20px; |
| } |
| .win-toggleswitch .win-toggleswitch-description { |
| font-size: 12px; |
| width: 22em; |
| margin-top: 28px; |
| display: none; |
| } |
| .win-toggleswitch .win-toggleswitch-clickregion { |
| display: inline-block; |
| touch-action: none; |
| -ms-user-select: none; |
| -webkit-user-select: none; |
| -moz-user-select: none; |
| user-select: none; |
| padding-top: 5px; |
| } |
| .win-toggleswitch .win-toggleswitch-track { |
| position: relative; |
| display: inline-block; |
| width: 44px; |
| height: 20px; |
| border-style: solid; |
| border-width: 2px; |
| border-radius: 10px; |
| box-sizing: border-box; |
| } |
| .win-toggleswitch .win-toggleswitch-thumb { |
| position: absolute; |
| top: 3px; |
| display: inline-block; |
| width: 10px; |
| height: 10px; |
| border-radius: 5px; |
| -webkit-transition: left 0.1s; |
| transition: left 0.1s; |
| } |
| .win-toggleswitch:focus .win-toggleswitch-clickregion { |
| outline-width: 1px; |
| outline-style: dotted; |
| } |
| .win-toggleswitch.win-toggleswitch-dragging .win-toggleswitch-thumb { |
| -webkit-transition: none; |
| transition: none; |
| } |
| .win-toggleswitch.win-toggleswitch-off .win-toggleswitch-value-on { |
| visibility: hidden; |
| height: 0; |
| font-size: 0; |
| line-height: 0; |
| } |
| .win-toggleswitch.win-toggleswitch-on .win-toggleswitch-value-off { |
| visibility: hidden; |
| height: 0; |
| font-size: 0; |
| line-height: 0; |
| } |
| .win-toggleswitch.win-toggleswitch-on .win-toggleswitch-thumb { |
| left: 27px; |
| } |
| .win-toggleswitch.win-toggleswitch-off .win-toggleswitch-thumb { |
| left: 3px; |
| } |
| .win-toggleswitch:lang(ar), |
| .win-toggleswitch:lang(dv), |
| .win-toggleswitch:lang(fa), |
| .win-toggleswitch:lang(he), |
| .win-toggleswitch:lang(ku-Arab), |
| .win-toggleswitch:lang(pa-Arab), |
| .win-toggleswitch:lang(prs), |
| .win-toggleswitch:lang(ps), |
| .win-toggleswitch:lang(sd-Arab), |
| .win-toggleswitch:lang(syr), |
| .win-toggleswitch:lang(ug), |
| .win-toggleswitch:lang(ur), |
| .win-toggleswitch:lang(qps-plocm) { |
| direction: rtl; |
| } |
| .win-toggleswitch:lang(ar).win-toggleswitch-on .win-toggleswitch-thumb, |
| .win-toggleswitch:lang(dv).win-toggleswitch-on .win-toggleswitch-thumb, |
| .win-toggleswitch:lang(fa).win-toggleswitch-on .win-toggleswitch-thumb, |
| .win-toggleswitch:lang(he).win-toggleswitch-on .win-toggleswitch-thumb, |
| .win-toggleswitch:lang(ku-Arab).win-toggleswitch-on .win-toggleswitch-thumb, |
| .win-toggleswitch:lang(pa-Arab).win-toggleswitch-on .win-toggleswitch-thumb, |
| .win-toggleswitch:lang(prs).win-toggleswitch-on .win-toggleswitch-thumb, |
| .win-toggleswitch:lang(ps).win-toggleswitch-on .win-toggleswitch-thumb, |
| .win-toggleswitch:lang(sd-Arab).win-toggleswitch-on .win-toggleswitch-thumb, |
| .win-toggleswitch:lang(syr).win-toggleswitch-on .win-toggleswitch-thumb, |
| .win-toggleswitch:lang(ug).win-toggleswitch-on .win-toggleswitch-thumb, |
| .win-toggleswitch:lang(ur).win-toggleswitch-on .win-toggleswitch-thumb, |
| .win-toggleswitch:lang(qps-plocm).win-toggleswitch-on .win-toggleswitch-thumb { |
| left: 3px; |
| } |
| .win-toggleswitch:lang(ar).win-toggleswitch-off .win-toggleswitch-thumb, |
| .win-toggleswitch:lang(dv).win-toggleswitch-off .win-toggleswitch-thumb, |
| .win-toggleswitch:lang(fa).win-toggleswitch-off .win-toggleswitch-thumb, |
| .win-toggleswitch:lang(he).win-toggleswitch-off .win-toggleswitch-thumb, |
| .win-toggleswitch:lang(ku-Arab).win-toggleswitch-off .win-toggleswitch-thumb, |
| .win-toggleswitch:lang(pa-Arab).win-toggleswitch-off .win-toggleswitch-thumb, |
| .win-toggleswitch:lang(prs).win-toggleswitch-off .win-toggleswitch-thumb, |
| .win-toggleswitch:lang(ps).win-toggleswitch-off .win-toggleswitch-thumb, |
| .win-toggleswitch:lang(sd-Arab).win-toggleswitch-off .win-toggleswitch-thumb, |
| .win-toggleswitch:lang(syr).win-toggleswitch-off .win-toggleswitch-thumb, |
| .win-toggleswitch:lang(ug).win-toggleswitch-off .win-toggleswitch-thumb, |
| .win-toggleswitch:lang(ur).win-toggleswitch-off .win-toggleswitch-thumb, |
| .win-toggleswitch:lang(qps-plocm).win-toggleswitch-off .win-toggleswitch-thumb { |
| left: 27px; |
| } |
| .win-semanticzoom { |
| touch-action: pan-x pan-y double-tap-zoom; |
| height: 400px; |
| /* Necessary to detect element resize */ |
| position: relative; |
| } |
| .win-semanticzoom .win-listview > .win-viewport * { |
| touch-action: auto; |
| } |
| .win-semanticzoom * { |
| touch-action: inherit; |
| } |
| .win-semanticzoom-button { |
| z-index: 100; |
| position: absolute; |
| min-width: 25px; |
| min-height: 25px; |
| width: 25px; |
| height: 25px; |
| padding: 0px; |
| bottom: 21px; |
| touch-action: none; |
| } |
| .win-semanticzoom-button::before { |
| font-family: "Segoe MDL2 Assets", "Symbols"; |
| font-weight: normal; |
| font-size: 11px; |
| content: "\E0B8"; |
| /* minus sign */ |
| } |
| .win-semanticzoom-button-location { |
| left: auto; |
| right: 4px; |
| } |
| .win-semanticzoom-button-location:lang(ar), |
| .win-semanticzoom-button-location:lang(dv), |
| .win-semanticzoom-button-location:lang(fa), |
| .win-semanticzoom-button-location:lang(he), |
| .win-semanticzoom-button-location:lang(ku-Arab), |
| .win-semanticzoom-button-location:lang(pa-Arab), |
| .win-semanticzoom-button-location:lang(prs), |
| .win-semanticzoom-button-location:lang(ps), |
| .win-semanticzoom-button-location:lang(sd-Arab), |
| .win-semanticzoom-button-location:lang(syr), |
| .win-semanticzoom-button-location:lang(ug), |
| .win-semanticzoom-button-location:lang(ur), |
| .win-semanticzoom-button-location:lang(qps-plocm) { |
| left: 4px; |
| right: auto; |
| } |
| @media (-ms-high-contrast) { |
| .win-semanticzoom-button { |
| background-color: ButtonFace; |
| border-color: ButtonText; |
| color: ButtonText; |
| } |
| .win-semanticzoom-button.win-semanticzoom-button:hover:active { |
| background-clip: border-box; |
| background-color: ButtonText; |
| border-color: transparent; |
| color: ButtonFace; |
| } |
| .win-semanticzoom-button:-ms-keyboard-active { |
| background-clip: border-box; |
| background-color: ButtonText; |
| border-color: transparent; |
| color: ButtonFace; |
| } |
| html.win-hoverable win-semanticzoom-button:hover { |
| background-color: Highlight; |
| border-color: ButtonText; |
| color: HighlightText; |
| } |
| } |
| .win-pivot { |
| display: -ms-flexbox; |
| display: -webkit-flex; |
| display: flex; |
| -ms-flex-direction: column; |
| -webkit-flex-direction: column; |
| flex-direction: column; |
| -ms-flex-wrap: none; |
| -webkit-flex-wrap: nowrap; |
| flex-wrap: nowrap; |
| height: 100%; |
| width: 100%; |
| overflow: hidden; |
| -ms-scroll-limit-x-max: 0px; |
| touch-action: manipulation; |
| /* Necessary for detecting when this element has resized */ |
| position: relative; |
| } |
| .win-pivot .win-pivot-navbutton { |
| touch-action: manipulation; |
| position: absolute; |
| width: 20px; |
| height: 36px; |
| padding: 0px; |
| margin: 0px; |
| top: 10px; |
| min-width: 0px; |
| border-width: 0px; |
| cursor: pointer; |
| opacity: 0; |
| font-family: "Segoe MDL2 Assets", "Symbols"; |
| } |
| .win-pivot .win-pivot-headers.win-pivot-shownavbuttons .win-pivot-navbutton { |
| opacity: 1; |
| } |
| .win-pivot .win-pivot-headers .win-pivot-navbutton-prev:before { |
| content: "\E096"; |
| } |
| .win-pivot .win-pivot-headers .win-pivot-navbutton-next:before { |
| content: "\E09B"; |
| } |
| .win-pivot .win-pivot-title { |
| -ms-flex: 0 0 auto; |
| -webkit-flex: 0 0 auto; |
| flex: 0 0 auto; |
| font-family: "Segoe UI", sans-serif, "Segoe MDL2 Assets", "Symbols"; |
| font-size: 15px; |
| font-weight: bold; |
| white-space: nowrap; |
| margin: 14px 0 13px 24px; |
| } |
| .win-pivot .win-pivot-title:lang(ar), |
| .win-pivot .win-pivot-title:lang(dv), |
| .win-pivot .win-pivot-title:lang(fa), |
| .win-pivot .win-pivot-title:lang(he), |
| .win-pivot .win-pivot-title:lang(ku-Arab), |
| .win-pivot .win-pivot-title:lang(pa-Arab), |
| .win-pivot .win-pivot-title:lang(prs), |
| .win-pivot .win-pivot-title:lang(ps), |
| .win-pivot .win-pivot-title:lang(sd-Arab), |
| .win-pivot .win-pivot-title:lang(syr), |
| .win-pivot .win-pivot-title:lang(ug), |
| .win-pivot .win-pivot-title:lang(ur), |
| .win-pivot .win-pivot-title:lang(qps-plocm) { |
| margin: 14px 24px 13px 0; |
| } |
| .win-pivot > .win-pivot-item { |
| /* |
| Hide the pivot items defined declaratively until we reparent them to ensure correct |
| measuring and to avoid showing unprocessed content in the wrong location. |
| */ |
| display: none; |
| } |
| .win-pivot .win-pivot-header-area { |
| -ms-flex: 0 0 auto; |
| -webkit-flex: 0 0 auto; |
| flex: 0 0 auto; |
| display: -ms-flexbox; |
| display: -webkit-flex; |
| display: flex; |
| -ms-flex-direction: row; |
| -webkit-flex-direction: row; |
| flex-direction: row; |
| } |
| .win-pivot .win-pivot-header-leftcustom, |
| .win-pivot .win-pivot-header-rightcustom { |
| -ms-flex: 0 0 auto; |
| -webkit-flex: 0 0 auto; |
| flex: 0 0 auto; |
| margin-top: 13px; |
| } |
| .win-pivot .win-pivot-header-items { |
| -ms-flex: 1 1 0%; |
| -webkit-flex: 1 1 0%; |
| flex: 1 1 0%; |
| overflow-x: hidden; |
| padding: 1px; |
| } |
| .win-pivot .win-pivot-headers { |
| white-space: nowrap; |
| position: relative; |
| overflow-y: visible; |
| height: 48px; |
| touch-action: none; |
| -ms-touch-action: none; |
| outline: 0; |
| } |
| .win-pivot .win-pivot-headers.win-keyboard:focus { |
| outline-style: dotted; |
| outline-width: 1px; |
| } |
| .win-pivot .win-pivot-header, |
| .win-pivot .win-pivot-header.win-pivot-header:hover:active { |
| touch-action: manipulation; |
| font-size: 24px; |
| font-weight: 300; |
| line-height: 1.167; |
| display: inline-block; |
| transition: opacity linear 167ms; |
| -webkit-transition: opacity linear 167ms; |
| overflow: hidden; |
| height: 30px; |
| border: 0; |
| padding: 0; |
| outline: 0; |
| margin: 12px 12px 0px 12px; |
| min-height: 0; |
| min-width: 0; |
| } |
| .win-pivot.win-pivot-locked .win-pivot-header { |
| opacity: 0; |
| visibility: hidden; |
| } |
| .win-pivot .win-pivot-header.win-pivot-header-selected, |
| .win-pivot.win-pivot-locked .win-pivot-header.win-pivot-header-selected { |
| opacity: 1.0; |
| visibility: inherit; |
| } |
| .win-pivot .win-pivot-viewport { |
| /* Overlap the headers but not the title */ |
| height: 100%; |
| overflow-x: auto; |
| overflow-y: hidden; |
| -ms-scroll-snap-type: mandatory; |
| -ms-scroll-snap-points-x: snapInterval(0%, 100%); |
| -ms-overflow-style: none; |
| /* The following 3 styles take advantage of a Trident bug to make the viewport pannable on the header track. The viewport is extended over the |
| header track space, and position: relative allows interacting with it as if the viewport was drawn over the header track. |
| */ |
| position: relative; |
| padding-top: 48px; |
| margin-top: -48px; |
| } |
| .win-pivot.win-pivot-customheaders .win-pivot-viewport { |
| padding-top: inherit; |
| margin-top: inherit; |
| } |
| .win-pivot.win-pivot-mouse .win-pivot-viewport { |
| padding-top: 0px; |
| margin-top: 0px; |
| } |
| .win-pivot.win-pivot-locked .win-pivot-viewport { |
| overflow: hidden; |
| } |
| .win-pivot .win-pivot-surface { |
| /* Surface is 3x of viewport to allow panning. */ |
| width: 300%; |
| height: 100%; |
| position: relative; |
| } |
| html.win-hoverable .win-pivot button.win-pivot-header:hover { |
| background-color: transparent; |
| border: 0; |
| padding: 0; |
| letter-spacing: 0px; |
| margin: 12px 12px 0px 12px; |
| min-height: 0; |
| min-width: 0; |
| } |
| html.win-hoverable .win-pivot .win-pivot-navbutton:hover { |
| margin: 0px; |
| padding: 0px; |
| border-width: 0px; |
| cursor: pointer; |
| font-family: "Segoe MDL2 Assets", "Symbols"; |
| } |
| /* |
| PivotItem |
| */ |
| .win-pivot-item { |
| position: absolute; |
| top: 0; |
| bottom: 0; |
| /* Since the surface is 3x in width, 33.3% here means the size of the viewport. */ |
| width: 33.3%; |
| left: 33.3%; |
| } |
| .win-pivot-item:lang(ar), |
| .win-pivot-item:lang(dv), |
| .win-pivot-item:lang(fa), |
| .win-pivot-item:lang(he), |
| .win-pivot-item:lang(ku-Arab), |
| .win-pivot-item:lang(pa-Arab), |
| .win-pivot-item:lang(prs), |
| .win-pivot-item:lang(ps), |
| .win-pivot-item:lang(sd-Arab), |
| .win-pivot-item:lang(syr), |
| .win-pivot-item:lang(ug), |
| .win-pivot-item:lang(ur), |
| .win-pivot-item:lang(qps-plocm) { |
| left: auto; |
| right: 33.3%; |
| } |
| .win-pivot-item .win-pivot-item-content { |
| height: 100%; |
| overflow-y: auto; |
| -ms-overflow-style: -ms-autohiding-scrollbar; |
| padding: 0px 24px; |
| } |
| /* |
| Modified styles for when the Pivot is in nosnap mode |
| */ |
| .win-pivot.win-pivot-nosnap .win-pivot-viewport { |
| padding-top: 0px; |
| margin-top: 0px; |
| overflow: hidden; |
| } |
| .win-pivot.win-pivot-nosnap .win-pivot-surface, |
| .win-pivot.win-pivot-nosnap .win-pivot-item { |
| width: 100%; |
| position: static; |
| } |
| .win-hub { |
| height: 100%; |
| width: 100%; |
| /* Necessary for detecting when this element has resized */ |
| position: relative; |
| } |
| .win-hub-progress { |
| position: absolute; |
| top: 10px; |
| width: 100%; |
| z-index: 1; |
| } |
| .win-hub-viewport { |
| height: 100%; |
| width: 100%; |
| -ms-scroll-snap-type: proximity; |
| -webkit-overflow-scrolling: touch; |
| } |
| .win-hub-horizontal .win-hub-viewport { |
| overflow-x: auto; |
| overflow-y: hidden; |
| white-space: nowrap; |
| } |
| .win-hub-vertical .win-hub-viewport { |
| position: relative; |
| overflow-y: auto; |
| overflow-x: hidden; |
| } |
| .win-hub-surface { |
| display: inline-block; |
| } |
| .win-hub-vertical .win-hub-surface { |
| width: calc(100% - 24px); |
| padding: 0px 12px 8px 12px; |
| margin-top: -24px; |
| /* Keep in sync w/ hub-section padding-top */ |
| } |
| .win-hub-horizontal .win-hub-surface { |
| height: 100%; |
| padding-left: 12px; |
| } |
| .win-hub-horizontal .win-hub-surface:lang(ar), |
| .win-hub-horizontal .win-hub-surface:lang(dv), |
| .win-hub-horizontal .win-hub-surface:lang(fa), |
| .win-hub-horizontal .win-hub-surface:lang(he), |
| .win-hub-horizontal .win-hub-surface:lang(ku-Arab), |
| .win-hub-horizontal .win-hub-surface:lang(pa-Arab), |
| .win-hub-horizontal .win-hub-surface:lang(prs), |
| .win-hub-horizontal .win-hub-surface:lang(ps), |
| .win-hub-horizontal .win-hub-surface:lang(sd-Arab), |
| .win-hub-horizontal .win-hub-surface:lang(syr), |
| .win-hub-horizontal .win-hub-surface:lang(ug), |
| .win-hub-horizontal .win-hub-surface:lang(ur), |
| .win-hub-horizontal .win-hub-surface:lang(qps-plocm) { |
| padding-left: 0; |
| padding-right: 12px; |
| } |
| .win-hub-section { |
| display: inline-block; |
| vertical-align: top; |
| white-space: normal; |
| } |
| .win-hub-horizontal .win-hub-section { |
| height: 100%; |
| padding-right: 24px; |
| } |
| .win-hub-horizontal .win-hub-section:lang(ar), |
| .win-hub-horizontal .win-hub-section:lang(dv), |
| .win-hub-horizontal .win-hub-section:lang(fa), |
| .win-hub-horizontal .win-hub-section:lang(he), |
| .win-hub-horizontal .win-hub-section:lang(ku-Arab), |
| .win-hub-horizontal .win-hub-section:lang(pa-Arab), |
| .win-hub-horizontal .win-hub-section:lang(prs), |
| .win-hub-horizontal .win-hub-section:lang(ps), |
| .win-hub-horizontal .win-hub-section:lang(sd-Arab), |
| .win-hub-horizontal .win-hub-section:lang(syr), |
| .win-hub-horizontal .win-hub-section:lang(ug), |
| .win-hub-horizontal .win-hub-section:lang(ur), |
| .win-hub-horizontal .win-hub-section:lang(qps-plocm) { |
| padding-right: 0; |
| padding-left: 24px; |
| } |
| .win-hub-horizontal .win-hub-section-header { |
| margin-top: 62px; |
| } |
| .win-hub-vertical .win-hub-section { |
| width: 100%; |
| padding-top: 24px; |
| /* Keep in sync w/ hub-surface margin-top */ |
| } |
| .win-hub-section-header { |
| margin-bottom: 9px; |
| height: 28px; |
| } |
| button.win-hub-section-header-tabstop, |
| html.win-hoverable button.win-hub-section-header-tabstop:hover, |
| button.win-hub-section-header-tabstop:hover:active { |
| touch-action: manipulation; |
| width: 100%; |
| background-color: transparent; |
| border: 0; |
| min-height: 0; |
| min-width: 0; |
| max-width: 100%; |
| padding: 0; |
| } |
| button.win-hub-section-header-tabstop:focus { |
| outline: none; |
| } |
| button.win-hub-section-header-tabstop:-ms-keyboard-active { |
| background-color: transparent; |
| } |
| .win-hub-section-header-wrapper { |
| display: -ms-inline-flexbox; |
| display: -webkit-inline-flex; |
| display: inline-flex; |
| -ms-flex-direction: row; |
| -webkit-flex-direction: row; |
| flex-direction: row; |
| -ms-flex-align: stretch; |
| -webkit-align-items: stretch; |
| align-items: stretch; |
| width: 100%; |
| outline: none; |
| } |
| .win-hub-section-header-content { |
| font-size: 20px; |
| font-weight: 400; |
| line-height: 1.5; |
| -ms-flex: 1 1 auto; |
| -webkit-flex: 1 1 auto; |
| flex: 1 1 auto; |
| text-align: left; |
| vertical-align: bottom; |
| overflow: hidden; |
| text-overflow: clip; |
| white-space: nowrap; |
| } |
| .win-hub-section-header-content:lang(ar), |
| .win-hub-section-header-content:lang(dv), |
| .win-hub-section-header-content:lang(fa), |
| .win-hub-section-header-content:lang(he), |
| .win-hub-section-header-content:lang(ku-Arab), |
| .win-hub-section-header-content:lang(pa-Arab), |
| .win-hub-section-header-content:lang(prs), |
| .win-hub-section-header-content:lang(ps), |
| .win-hub-section-header-content:lang(sd-Arab), |
| .win-hub-section-header-content:lang(syr), |
| .win-hub-section-header-content:lang(ug), |
| .win-hub-section-header-content:lang(ur), |
| .win-hub-section-header-content:lang(qps-plocm) { |
| text-align: right; |
| } |
| .win-hub-section-header-chevron { |
| display: none; |
| } |
| .win-hub-section-header-interactive .win-hub-section-header-chevron { |
| -ms-flex: 0 0 auto; |
| -webkit-flex: 0 0 auto; |
| flex: 0 0 auto; |
| display: inline-block; |
| margin-left: 24px; |
| line-height: 1.5; |
| padding-top: 7px; |
| text-align: right; |
| vertical-align: bottom; |
| } |
| .win-hub-section-header-interactive .win-hub-section-header-chevron:lang(ar), |
| .win-hub-section-header-interactive .win-hub-section-header-chevron:lang(dv), |
| .win-hub-section-header-interactive .win-hub-section-header-chevron:lang(fa), |
| .win-hub-section-header-interactive .win-hub-section-header-chevron:lang(he), |
| .win-hub-section-header-interactive .win-hub-section-header-chevron:lang(ku-Arab), |
| .win-hub-section-header-interactive .win-hub-section-header-chevron:lang(pa-Arab), |
| .win-hub-section-header-interactive .win-hub-section-header-chevron:lang(prs), |
| .win-hub-section-header-interactive .win-hub-section-header-chevron:lang(ps), |
| .win-hub-section-header-interactive .win-hub-section-header-chevron:lang(sd-Arab), |
| .win-hub-section-header-interactive .win-hub-section-header-chevron:lang(syr), |
| .win-hub-section-header-interactive .win-hub-section-header-chevron:lang(ug), |
| .win-hub-section-header-interactive .win-hub-section-header-chevron:lang(ur), |
| .win-hub-section-header-interactive .win-hub-section-header-chevron:lang(qps-plocm) { |
| text-align: left; |
| margin-left: 0; |
| margin-right: 24px; |
| } |
| .win-hub-horizontal .win-hub-section-content { |
| height: calc(100% - 99px); |
| } |
| .win-hub-vertical .win-hub-section-content { |
| width: 100%; |
| } |
| @media (-ms-high-contrast) { |
| button.win-hub-section-header-tabstop, |
| html.win-hoverable button.win-hub-section-header-tabstop:hover, |
| button.win-hub-section-header-tabstop:hover:active { |
| background-color: transparent; |
| color: WindowText; |
| } |
| button.win-hub-section-header-tabstop:-ms-keyboard-active { |
| color: WindowText; |
| } |
| html.win-hoverable button.win-hub-section-header-tabstop.win-hub-section-header-interactive:hover, |
| button.win-hub-section-header-tabstop.win-hub-section-header-interactive:hover:active { |
| color: -ms-hotlight; |
| } |
| button.win-hub-section-header-tabstop.win-hub-section-header-interactive:-ms-keyboard-active { |
| color: -ms-hotlight; |
| } |
| } |
| .win-clickeater { |
| background-color: transparent; |
| width: 110%; |
| height: 110%; |
| left: -5%; |
| top: -5%; |
| position: fixed; |
| touch-action: none; |
| outline: 1px solid Purple; |
| /*Necessary to block passthrough over webviews*/ |
| -ms-high-contrast-adjust: none; |
| } |
| /* |
| Command buttons. |
| */ |
| button.win-command { |
| touch-action: manipulation; |
| background: none; |
| background-clip: border-box; |
| height: auto; |
| padding: 0; |
| margin: 0; |
| border: 1px dotted; |
| /* reserve focus rect */ |
| min-width: 40px; |
| min-height: 48px; |
| text-align: center; |
| font-size: 12px; |
| line-height: 16px; |
| font-weight: normal; |
| overflow: visible; |
| /* Commands are lrtb */ |
| writing-mode: lr-tb; |
| position: relative; |
| z-index: 0; |
| } |
| button.win-command::-moz-focus-inner { |
| padding: 0; |
| border: 0; |
| } |
| button:lang(ar), |
| button:lang(dv), |
| button:lang(fa), |
| button:lang(he), |
| button:lang(ku-Arab), |
| button:lang(pa-Arab), |
| button:lang(prs), |
| button:lang(ps), |
| button:lang(sd-Arab), |
| button:lang(syr), |
| button:lang(ug), |
| button:lang(ur), |
| button:lang(qps-plocm) { |
| writing-mode: rl-tb; |
| } |
| /* |
| Always hide the outline, not just when :focus is applied. |
| https://github.com/winjs/winjs/issues/859 |
| */ |
| button.win-command { |
| outline: none; |
| } |
| /* |
| Command button icons. |
| */ |
| .win-commandicon { |
| display: block; |
| margin: 11px 21px; |
| /* left/right margin: 22px = 1px focus rect + 21px. Affects margin-top of button.win-command .win-label */ |
| min-width: 0; |
| min-height: 0; |
| padding: 0; |
| /* Normal sizing */ |
| width: 24px; |
| height: 24px; |
| box-sizing: border-box; |
| -moz-box-sizing: border-box; |
| cursor: default; |
| position: relative; |
| outline: none; |
| } |
| .win-commandimage { |
| /* Default font for glyphs. */ |
| font-family: "Segoe UI Command", "Symbols"; |
| letter-spacing: 0; |
| /* Applications provide their own content, like . */ |
| vertical-align: middle; |
| font-size: 20px; |
| margin: 0; |
| line-height: 24px; |
| /* line-height must match the content box height */ |
| background-position: 0 0; |
| background-origin: border-box; |
| display: inline-block; |
| width: 24px; |
| height: 24px; |
| background-size: 96px 48px; |
| outline: none; |
| } |
| .win-commandimage.win-commandglyph { |
| position: absolute; |
| left: 0; |
| } |
| /* |
| Offsets for sprite versions. |
| */ |
| html.win-hoverable button:enabled:hover .win-commandimage, |
| button:active .win-commandimage { |
| background-position: -24px 0; |
| } |
| button:enabled:hover:active .win-commandimage.win-commandimage { |
| background-position: -48px 0; |
| } |
| button:-ms-keyboard-active .win-commandimage { |
| background-position: -48px 0; |
| } |
| button:disabled .win-commandimage, |
| button:disabled:active .win-commandimage { |
| background-position: -72px 0; |
| } |
| /* |
| Offsets for sprite versions in selected state. |
| */ |
| button[aria-checked=true] .win-commandimage { |
| background-position: 0 -24px; |
| } |
| html.win-hoverable button[aria-checked=true]:enabled:hover .win-commandimage, |
| button[aria-checked=true]:active .win-commandimage { |
| background-position: -24px -24px; |
| } |
| button[aria-checked=true]:enabled:hover:active .win-commandimage.win-commandimage { |
| background-position: -48px -24px; |
| } |
| button[aria-checked=true]:-ms-keyboard-active .win-commandimage { |
| background-position: -48px -24px; |
| } |
| button[aria-checked=true]:disabled .win-commandimage, |
| button[aria-checked=true]:disabled:active .win-commandimage { |
| background-position: -72px -24px; |
| } |
| /* |
| Command button labels. |
| */ |
| button.win-command .win-label { |
| font-family: "Segoe UI", sans-serif, "Segoe MDL2 Assets", "Symbols"; |
| font-size: 12px; |
| font-weight: 400; |
| line-height: 1.167; |
| position: relative; |
| line-height: 16px; |
| display: block; |
| max-width: 66px; |
| /* 68px button, but allow for 2*1px for focus border on each side */ |
| margin-top: -10px; |
| /* 2px = 12px margin-bottom of .win-commandicon - 10px*/ |
| margin-bottom: 6px; |
| padding: 0; |
| overflow: hidden; |
| word-wrap: break-word; |
| word-break: keep-all; |
| outline: none; |
| } |
| /* |
| AppBarCommand separator types. |
| */ |
| hr.win-command { |
| display: inline-block; |
| padding: 0; |
| margin: 12px 16px; |
| width: 2px; |
| height: 24px; |
| border: 0; |
| vertical-align: top; |
| } |
| /* |
| AppBarCommand content types. |
| */ |
| div.win-command { |
| display: inline-block; |
| min-width: 0; |
| min-height: 0; |
| padding: 0px 31px; |
| border: 1px dotted; |
| /* reserve focus rect */ |
| text-align: center; |
| font-size: 12px; |
| line-height: 16px; |
| font-weight: normal; |
| vertical-align: top; |
| /* Content Commands are lrtb */ |
| writing-mode: lr-tb; |
| position: relative; |
| } |
| div.win-command:lang(ar), |
| div.win-command:lang(dv), |
| div.win-command:lang(fa), |
| div.win-command:lang(he), |
| div.win-command:lang(ku-Arab), |
| div.win-command:lang(pa-Arab), |
| div.win-command:lang(prs), |
| div.win-command:lang(ps), |
| div.win-command:lang(sd-Arab), |
| div.win-command:lang(syr), |
| div.win-command:lang(ug), |
| div.win-command:lang(ur), |
| div.win-command:lang(qps-plocm) { |
| writing-mode: rl-tb; |
| } |
| div.win-command:focus { |
| outline: none; |
| } |
| .win-command.win-command-hidden { |
| display: none; |
| } |
| /* |
| AppBar |
| */ |
| .win-navbar { |
| border-width: 0; |
| width: 100%; |
| height: auto; |
| left: 0; |
| position: fixed; |
| position: -ms-device-fixed; |
| min-height: 48px; |
| } |
| .win-navbar.win-navbar-minimal { |
| min-height: 25px; |
| } |
| .win-navbar.win-navbar-minimal.win-navbar-closed .win-navbar-invokebutton .win-navbar-ellipsis { |
| top: 5px; |
| } |
| .win-navbar.win-navbar-closing.win-navbar-minimal > :not(.win-navbar-invokebutton) { |
| opacity: 0; |
| } |
| .win-navbar.win-menulayout.win-navbar-closing .win-navbar-menu { |
| opacity: 1; |
| } |
| .win-navbar.win-navbar-closed.win-navbar-minimal > :not(.win-navbar-invokebutton) { |
| display: none !important; |
| } |
| .win-navbar.win-navbar-closing.win-navbar-minimal .win-navbar-invokebutton, |
| .win-navbar.win-navbar-closed.win-navbar-minimal .win-navbar-invokebutton { |
| width: 100%; |
| } |
| .win-navbar.win-menulayout.win-navbar-opening .win-navbar-invokebutton, |
| .win-navbar.win-menulayout.win-navbar-opened .win-navbar-invokebutton, |
| .win-navbar.win-menulayout.win-navbar-closing .win-navbar-invokebutton { |
| visibility: hidden; |
| } |
| .win-navbar.win-menulayout.win-navbar-opening .win-toolbar.win-toolbar-showndisplayfull .win-toolbar-overflowbutton, |
| .win-navbar.win-menulayout.win-navbar-opened .win-toolbar.win-toolbar-showndisplayfull .win-toolbar-overflowbutton, |
| .win-navbar.win-menulayout.win-navbar-closing .win-toolbar.win-toolbar-showndisplayfull .win-toolbar-overflowbutton { |
| visibility: visible; |
| } |
| .win-navbar .win-navbar-invokebutton { |
| touch-action: manipulation; |
| width: 32px; |
| height: 100%; |
| min-height: 25px; |
| position: absolute; |
| right: 0px; |
| margin: 0px; |
| padding: 0px; |
| border: dotted 1px; |
| min-width: 0px; |
| background-clip: border-box; |
| display: none; |
| z-index: 1; |
| } |
| .win-navbar .win-navbar-invokebutton .win-navbar-ellipsis { |
| width: 32px; |
| height: 100%; |
| right: 0px; |
| top: 15px; |
| position: absolute; |
| display: inline-block; |
| font-size: 14px; |
| text-align: center; |
| font-family: "Segoe MDL2 Assets", "Symbols"; |
| } |
| .win-navbar .win-navbar-invokebutton .win-navbar-ellipsis::before { |
| content: "\E10C"; |
| position: relative; |
| } |
| .win-navbar:lang(ar) .win-navbar-invokebutton, |
| .win-navbar:lang(dv) .win-navbar-invokebutton, |
| .win-navbar:lang(fa) .win-navbar-invokebutton, |
| .win-navbar:lang(he) .win-navbar-invokebutton, |
| .win-navbar:lang(ku-Arab) .win-navbar-invokebutton, |
| .win-navbar:lang(pa-Arab) .win-navbar-invokebutton, |
| .win-navbar:lang(prs) .win-navbar-invokebutton, |
| .win-navbar:lang(ps) .win-navbar-invokebutton, |
| .win-navbar:lang(sd-Arab) .win-navbar-invokebutton, |
| .win-navbar:lang(syr) .win-navbar-invokebutton, |
| .win-navbar:lang(ug) .win-navbar-invokebutton, |
| .win-navbar:lang(ur) .win-navbar-invokebutton, |
| .win-navbar:lang(qps-plocm) .win-navbar-invokebutton, |
| .win-navbar:lang(ar) .win-navbar-invokebutton .win-navbar-ellipsis, |
| .win-navbar:lang(dv) .win-navbar-invokebutton .win-navbar-ellipsis, |
| .win-navbar:lang(fa) .win-navbar-invokebutton .win-navbar-ellipsis, |
| .win-navbar:lang(he) .win-navbar-invokebutton .win-navbar-ellipsis, |
| .win-navbar:lang(ku-Arab) .win-navbar-invokebutton .win-navbar-ellipsis, |
| .win-navbar:lang(pa-Arab) .win-navbar-invokebutton .win-navbar-ellipsis, |
| .win-navbar:lang(prs) .win-navbar-invokebutton .win-navbar-ellipsis, |
| .win-navbar:lang(ps) .win-navbar-invokebutton .win-navbar-ellipsis, |
| .win-navbar:lang(sd-Arab) .win-navbar-invokebutton .win-navbar-ellipsis, |
| .win-navbar:lang(syr) .win-navbar-invokebutton .win-navbar-ellipsis, |
| .win-navbar:lang(ug) .win-navbar-invokebutton .win-navbar-ellipsis, |
| .win-navbar:lang(ur) .win-navbar-invokebutton .win-navbar-ellipsis, |
| .win-navbar:lang(qps-plocm) .win-navbar-invokebutton .win-navbar-ellipsis { |
| right: auto; |
| left: 0px; |
| } |
| .win-navbar.win-navbar-minimal .win-navbar-invokebutton, |
| .win-navbar.win-navbar-compact .win-navbar-invokebutton { |
| display: block; |
| } |
| /* |
| AppBar commands layout |
| */ |
| .win-commandlayout { |
| display: -ms-flexbox; |
| display: -webkit-flex; |
| display: flex; |
| -ms-flex-direction: row; |
| -webkit-flex-direction: row; |
| flex-direction: row; |
| -ms-flex-wrap: none; |
| -webkit-flex-wrap: nowrap; |
| flex-wrap: nowrap; |
| -ms-flex-pack: center; |
| -webkit-justify-content: center; |
| justify-content: center; |
| -ms-flex-align: start; |
| -webkit-align-items: flex-start; |
| align-items: flex-start; |
| } |
| .win-commandlayout .win-primarygroup { |
| -ms-flex-order: 2; |
| flex-order: 2; |
| -webkit-order: 2; |
| order: 2; |
| display: -ms-inline-flexbox; |
| display: -webkit-inline-flex; |
| display: inline-flex; |
| -ms-flex: 1 1 auto; |
| -webkit-flex: 1 1 auto; |
| flex: 1 1 auto; |
| -ms-flex-direction: row; |
| -webkit-flex-direction: row; |
| flex-direction: row; |
| -ms-flex-wrap: wrap; |
| -webkit-flex-wrap: wrap; |
| flex-wrap: wrap; |
| -ms-flex-pack: end; |
| -webkit-justify-content: flex-end; |
| justify-content: flex-end; |
| -ms-flex-align: start; |
| -webkit-align-items: flex-start; |
| align-items: flex-start; |
| } |
| .win-commandlayout .win-secondarygroup { |
| -ms-flex-order: 1; |
| flex-order: 1; |
| -webkit-order: 1; |
| order: 1; |
| display: -ms-inline-flexbox; |
| display: -webkit-inline-flex; |
| display: inline-flex; |
| -ms-flex: 1 1 auto; |
| -webkit-flex: 1 1 auto; |
| flex: 1 1 auto; |
| -ms-flex-direction: row; |
| -webkit-flex-direction: row; |
| flex-direction: row; |
| -ms-flex-wrap: wrap; |
| -webkit-flex-wrap: wrap; |
| flex-wrap: wrap; |
| -ms-flex-pack: start; |
| -webkit-justify-content: flex-start; |
| justify-content: flex-start; |
| -ms-flex-align: start; |
| -webkit-align-items: flex-start; |
| align-items: flex-start; |
| } |
| .win-commandlayout .win-command { |
| -ms-flex: 0 0 auto; |
| -webkit-flex: 0 0 auto; |
| flex: 0 0 auto; |
| } |
| .win-commandlayout.win-navbar-opening, |
| .win-commandlayout.win-navbar-opened, |
| .win-commandlayout.win-navbar-closing { |
| min-height: 62px; |
| } |
| .win-commandlayout.win-navbar-opening.win-navbar-compact, |
| .win-commandlayout.win-navbar-opened.win-navbar-compact, |
| .win-commandlayout.win-navbar-closing.win-navbar-compact { |
| min-height: 48px; |
| } |
| .win-commandlayout.win-navbar-minimal, |
| .win-commandlayout.win-navbar-compact { |
| padding-right: 32px; |
| width: calc(100% - 32px); |
| } |
| .win-commandlayout.win-navbar-compact button.win-command .win-label { |
| display: none; |
| } |
| .win-commandlayout.win-navbar-compact.win-navbar-closing button.win-command .win-label { |
| display: block; |
| visibility: hidden; |
| } |
| .win-commandlayout.win-navbar-compact.win-navbar-opened button.win-command .win-label, |
| .win-commandlayout.win-navbar-compact.win-navbar-opening button.win-command .win-label { |
| display: block; |
| visibility: visible; |
| } |
| /* CommandsLayout RTL */ |
| .win-commandlayout:lang(ar).win-navbar-minimal, |
| .win-commandlayout:lang(dv).win-navbar-minimal, |
| .win-commandlayout:lang(fa).win-navbar-minimal, |
| .win-commandlayout:lang(he).win-navbar-minimal, |
| .win-commandlayout:lang(ku-Arab).win-navbar-minimal, |
| .win-commandlayout:lang(pa-Arab).win-navbar-minimal, |
| .win-commandlayout:lang(prs).win-navbar-minimal, |
| .win-commandlayout:lang(ps).win-navbar-minimal, |
| .win-commandlayout:lang(sd-Arab).win-navbar-minimal, |
| .win-commandlayout:lang(syr).win-navbar-minimal, |
| .win-commandlayout:lang(ug).win-navbar-minimal, |
| .win-commandlayout:lang(ur).win-navbar-minimal, |
| .win-commandlayout:lang(qps-plocm).win-navbar-minimal, |
| .win-commandlayout:lang(ar).win-navbar-compact, |
| .win-commandlayout:lang(dv).win-navbar-compact, |
| .win-commandlayout:lang(fa).win-navbar-compact, |
| .win-commandlayout:lang(he).win-navbar-compact, |
| .win-commandlayout:lang(ku-Arab).win-navbar-compact, |
| .win-commandlayout:lang(pa-Arab).win-navbar-compact, |
| .win-commandlayout:lang(prs).win-navbar-compact, |
| .win-commandlayout:lang(ps).win-navbar-compact, |
| .win-commandlayout:lang(sd-Arab).win-navbar-compact, |
| .win-commandlayout:lang(syr).win-navbar-compact, |
| .win-commandlayout:lang(ug).win-navbar-compact, |
| .win-commandlayout:lang(ur).win-navbar-compact, |
| .win-commandlayout:lang(qps-plocm).win-navbar-compact { |
| padding-right: 0px; |
| padding-left: 32px; |
| } |
| /* |
| AppBar menu layout |
| */ |
| .win-menulayout .win-navbar-menu { |
| position: absolute; |
| right: 0; |
| top: 0; |
| overflow: hidden; |
| } |
| .win-menulayout .win-navbar-menu:lang(ar), |
| .win-menulayout .win-navbar-menu:lang(dv), |
| .win-menulayout .win-navbar-menu:lang(fa), |
| .win-menulayout .win-navbar-menu:lang(he), |
| .win-menulayout .win-navbar-menu:lang(ku-Arab), |
| .win-menulayout .win-navbar-menu:lang(pa-Arab), |
| .win-menulayout .win-navbar-menu:lang(prs), |
| .win-menulayout .win-navbar-menu:lang(ps), |
| .win-menulayout .win-navbar-menu:lang(sd-Arab), |
| .win-menulayout .win-navbar-menu:lang(syr), |
| .win-menulayout .win-navbar-menu:lang(ug), |
| .win-menulayout .win-navbar-menu:lang(ur), |
| .win-menulayout .win-navbar-menu:lang(qps-plocm) { |
| left: 0; |
| right: auto; |
| } |
| .win-menulayout.win-bottom .win-navbar-menu { |
| overflow: visible; |
| } |
| .win-menulayout .win-toolbar { |
| max-width: 100vw; |
| } |
| .win-menulayout.win-navbar-compact button.win-command .win-label { |
| display: none; |
| visibility: hidden; |
| } |
| .win-menulayout.win-navbar-compact.win-navbar-closing button.win-command .win-label, |
| .win-menulayout.win-navbar-compact.win-navbar-opening button.win-command .win-label { |
| display: block; |
| visibility: visible; |
| } |
| .win-menulayout.win-navbar-compact.win-navbar-opened button.win-command .win-label { |
| display: block; |
| visibility: visible; |
| } |
| .win-menulayout.win-navbar-compact.win-navbar-closed { |
| overflow: hidden; |
| } |
| .win-menulayout.win-navbar-compact.win-navbar-closed .win-toolbar-overflowarea { |
| visibility: hidden; |
| } |
| /* |
| High contrast AppBar needs a border |
| */ |
| @media (-ms-high-contrast) { |
| /* |
| AppBar Borders |
| */ |
| .win-navbar { |
| border: solid 2px; |
| } |
| .win-navbar.win-top { |
| border-top: none; |
| border-left: none; |
| border-right: none; |
| } |
| .win-navbar.win-bottom { |
| border-bottom: none; |
| border-left: none; |
| border-right: none; |
| } |
| .win-navbar.win-top button.win-command, |
| .win-navbar.win-top div.win-command { |
| padding-bottom: 7px; |
| /* 7px - 2px smaller to account for the high-constrast appbar border */ |
| } |
| .win-navbar.win-bottom button.win-command, |
| .win-navbar.win-bottom div.win-command { |
| padding-top: 7px; |
| /* 7px - 2px smaller to account for the high-constrast appbar border */ |
| } |
| .win-navbar.win-top hr.win-command { |
| margin-bottom: 28px; |
| } |
| .win-navbar.win-bottom hr.win-command { |
| margin-top: 8px; |
| } |
| .win-commandlayout.win-navbar-opening, |
| .win-commandlayout.win-navbar-opened, |
| .win-commandlayout.win-navbar-closing { |
| min-height: 62px; |
| } |
| } |
| /* |
| Flyout control. |
| */ |
| .win-flyout { |
| position: fixed; |
| position: -ms-device-fixed; |
| padding: 12px; |
| border-style: solid; |
| border-width: 1px; |
| margin: 4px; |
| min-width: 70px; |
| /* 96px - 2px border - 24px padding */ |
| max-width: 430px; |
| /* 456px - 2px border - 24px padding */ |
| min-height: 16px; |
| /* 44px - 2px border - 24px padding */ |
| max-height: 730px; |
| /* 758px - 2px border - 24px padding */ |
| width: auto; |
| height: auto; |
| word-wrap: break-word; |
| overflow: auto; |
| font-size: 15px; |
| font-weight: 400; |
| line-height: 1.333; |
| } |
| .win-flyout.win-leftalign { |
| margin-left: 0; |
| } |
| .win-flyout.win-rightalign { |
| margin-right: 0; |
| } |
| .win-flyout.win-scrolls { |
| overflow: auto; |
| } |
| @media (max-width: 464px) { |
| .win-flyout { |
| max-width: calc(100% - 34px); |
| /* 100% - 8px margin - 2px border - 24px padding */ |
| } |
| } |
| /* |
| Menu control. |
| */ |
| .win-menu { |
| padding: 0; |
| line-height: 33px; |
| text-align: left; |
| /* Set explicitly in case our parent has different alignment, like appbar overflow. */ |
| min-height: 42px; |
| /* 44px - 2px border */ |
| max-height: calc(100% - 26px); |
| min-width: 134px; |
| /* 136px - 2px border */ |
| max-width: 454px; |
| /* 456px - 2px border */ |
| } |
| /* |
| Menu commands. |
| */ |
| .win-menu button.win-command { |
| display: block; |
| margin-left: 0; |
| margin-right: 0; |
| text-align: left; |
| width: 100%; |
| font-size: 15px; |
| font-weight: 400; |
| line-height: 1.333; |
| } |
| .win-menu button.win-command:focus { |
| outline: none; |
| } |
| .win-menu button.win-command .win-menucommand-liner { |
| display: -ms-flexbox; |
| display: -webkit-flex; |
| display: flex; |
| -ms-flex-direction: row; |
| -webkit-flex-direction: row; |
| flex-direction: row; |
| -ms-flex-wrap: none; |
| -webkit-flex-wrap: nowrap; |
| flex-wrap: nowrap; |
| -ms-flex-align: center; |
| -webkit-align-items: center; |
| align-items: center; |
| width: 100%; |
| position: relative; |
| } |
| .win-menu button.win-command .win-menucommand-liner .win-toggleicon, |
| .win-menu button.win-command .win-menucommand-liner .win-flyouticon { |
| -ms-flex: 0 0 auto; |
| -webkit-flex: 0 0 auto; |
| flex: 0 0 auto; |
| display: none; |
| visibility: hidden; |
| font-size: 16px; |
| font-family: "Segoe MDL2 Assets", "Symbols"; |
| } |
| .win-menu button.win-command .win-menucommand-liner .win-toggleicon { |
| margin-left: 12px; |
| } |
| .win-menu button.win-command .win-menucommand-liner .win-toggleicon::before { |
| content: "\E0E7"; |
| } |
| .win-menu button.win-command .win-menucommand-liner .win-flyouticon { |
| margin-left: 12px; |
| margin-right: 16px; |
| } |
| .win-menu button.win-command .win-menucommand-liner .win-flyouticon::before { |
| content: "\E26B"; |
| } |
| .win-menu button.win-command .win-menucommand-liner .win-label { |
| -ms-flex: 1 1 auto; |
| -webkit-flex: 1 1 auto; |
| flex: 1 1 auto; |
| font-size: 15px; |
| line-height: inherit; |
| min-width: 112px; |
| max-width: none; |
| white-space: nowrap; |
| text-overflow: clip; |
| margin: 0px; |
| padding: 0px 12px; |
| } |
| .win-menu button.win-command .win-menucommand-liner:lang(ar), |
| .win-menu button.win-command .win-menucommand-liner:lang(dv), |
| .win-menu button.win-command .win-menucommand-liner:lang(fa), |
| .win-menu button.win-command .win-menucommand-liner:lang(he), |
| .win-menu button.win-command .win-menucommand-liner:lang(ku-Arab), |
| .win-menu button.win-command .win-menucommand-liner:lang(pa-Arab), |
| .win-menu button.win-command .win-menucommand-liner:lang(prs), |
| .win-menu button.win-command .win-menucommand-liner:lang(ps), |
| .win-menu button.win-command .win-menucommand-liner:lang(sd-Arab), |
| .win-menu button.win-command .win-menucommand-liner:lang(syr), |
| .win-menu button.win-command .win-menucommand-liner:lang(ug), |
| .win-menu button.win-command .win-menucommand-liner:lang(ur), |
| .win-menu button.win-command .win-menucommand-liner:lang(qps-plocm) { |
| text-align: right; |
| } |
| .win-menu button.win-command .win-menucommand-liner:lang(ar) .win-toggleicon, |
| .win-menu button.win-command .win-menucommand-liner:lang(dv) .win-toggleicon, |
| .win-menu button.win-command .win-menucommand-liner:lang(fa) .win-toggleicon, |
| .win-menu button.win-command .win-menucommand-liner:lang(he) .win-toggleicon, |
| .win-menu button.win-command .win-menucommand-liner:lang(ku-Arab) .win-toggleicon, |
| .win-menu button.win-command .win-menucommand-liner:lang(pa-Arab) .win-toggleicon, |
| .win-menu button.win-command .win-menucommand-liner:lang(prs) .win-toggleicon, |
| .win-menu button.win-command .win-menucommand-liner:lang(ps) .win-toggleicon, |
| .win-menu button.win-command .win-menucommand-liner:lang(sd-Arab) .win-toggleicon, |
| .win-menu button.win-command .win-menucommand-liner:lang(syr) .win-toggleicon, |
| .win-menu button.win-command .win-menucommand-liner:lang(ug) .win-toggleicon, |
| .win-menu button.win-command .win-menucommand-liner:lang(ur) .win-toggleicon, |
| .win-menu button.win-command .win-menucommand-liner:lang(qps-plocm) .win-toggleicon { |
| margin-left: 0px; |
| margin-right: 12px; |
| } |
| .win-menu button.win-command .win-menucommand-liner:lang(ar) .win-flyouticon, |
| .win-menu button.win-command .win-menucommand-liner:lang(dv) .win-flyouticon, |
| .win-menu button.win-command .win-menucommand-liner:lang(fa) .win-flyouticon, |
| .win-menu button.win-command .win-menucommand-liner:lang(he) .win-flyouticon, |
| .win-menu button.win-command .win-menucommand-liner:lang(ku-Arab) .win-flyouticon, |
| .win-menu button.win-command .win-menucommand-liner:lang(pa-Arab) .win-flyouticon, |
| .win-menu button.win-command .win-menucommand-liner:lang(prs) .win-flyouticon, |
| .win-menu button.win-command .win-menucommand-liner:lang(ps) .win-flyouticon, |
| .win-menu button.win-command .win-menucommand-liner:lang(sd-Arab) .win-flyouticon, |
| .win-menu button.win-command .win-menucommand-liner:lang(syr) .win-flyouticon, |
| .win-menu button.win-command .win-menucommand-liner:lang(ug) .win-flyouticon, |
| .win-menu button.win-command .win-menucommand-liner:lang(ur) .win-flyouticon, |
| .win-menu button.win-command .win-menucommand-liner:lang(qps-plocm) .win-flyouticon { |
| margin-left: 16px; |
| margin-right: 12px; |
| } |
| .win-menu button.win-command .win-menucommand-liner:lang(ar) .win-flyouticon::before, |
| .win-menu button.win-command .win-menucommand-liner:lang(dv) .win-flyouticon::before, |
| .win-menu button.win-command .win-menucommand-liner:lang(fa) .win-flyouticon::before, |
| .win-menu button.win-command .win-menucommand-liner:lang(he) .win-flyouticon::before, |
| .win-menu button.win-command .win-menucommand-liner:lang(ku-Arab) .win-flyouticon::before, |
| .win-menu button.win-command .win-menucommand-liner:lang(pa-Arab) .win-flyouticon::before, |
| .win-menu button.win-command .win-menucommand-liner:lang(prs) .win-flyouticon::before, |
| .win-menu button.win-command .win-menucommand-liner:lang(ps) .win-flyouticon::before, |
| .win-menu button.win-command .win-menucommand-liner:lang(sd-Arab) .win-flyouticon::before, |
| .win-menu button.win-command .win-menucommand-liner:lang(syr) .win-flyouticon::before, |
| .win-menu button.win-command .win-menucommand-liner:lang(ug) .win-flyouticon::before, |
| .win-menu button.win-command .win-menucommand-liner:lang(ur) .win-flyouticon::before, |
| .win-menu button.win-command .win-menucommand-liner:lang(qps-plocm) .win-flyouticon::before { |
| content: "\E26C"; |
| } |
| .win-menu.win-menu-mousespacing button.win-command { |
| padding-top: 5px; |
| padding-bottom: 7px; |
| min-height: 32px; |
| } |
| .win-menu.win-menu-touchspacing button.win-command { |
| padding-top: 11px; |
| padding-bottom: 13px; |
| min-height: 44px; |
| } |
| .win-menu hr.win-command { |
| display: block; |
| height: 1px; |
| width: auto; |
| border: 0; |
| padding: 0; |
| margin: 9px 20px 10px 20px; |
| } |
| /* |
| Menu toggle and flyout commands. |
| */ |
| .win-menu-containstogglecommand button.win-command .win-menucommand-liner .win-toggleicon, |
| .win-menu-containsflyoutcommand button.win-command .win-menucommand-liner .win-flyouticon { |
| display: inline-block; |
| } |
| .win-menu-containstogglecommand button.win-command-toggle[aria-checked=true] .win-menucommand-liner .win-toggleicon, |
| .win-menu-containsflyoutcommand button.win-command-flyout .win-menucommand-liner .win-flyouticon { |
| visibility: visible; |
| } |
| @media (max-width: 464px) { |
| .win-menu { |
| max-width: calc(100% - 10px); |
| /* 100% - 8px margin - 2px border */ |
| } |
| } |
| /* |
| Grippers in touch selection do not dissapear when focus moves to an element outside of the selection range and they are always drawn on a layer above all HTML elemements. |
| When an _Overlay derived control such as AppBar/Flyout/Menu/SettingsFlyout is invoked and steals focus, if that _Overlay is laid out on top of the elements in the touch selection, |
| the grippers can still be seen over the _Overlay and its contents. However, all grippers any where in the document will be hidden whenever the current active element has or inherits |
| the style "-ms-touch-select: none;" |
| */ |
| .win-overlay { |
| -ms-touch-select: none; |
| } |
| /* For input elements we filter type using the :not selector to capture any unrecognized user specified types which would just default to the form and function of a textbox*/ |
| .win-overlay input:not([type="file"]), |
| .win-overlay input:not([type="radio"]), |
| .win-overlay input:not([type="checkbox"]), |
| .win-overlay input:not([type="button"]), |
| .win-overlay input:not([type="range"]), |
| .win-overlay input:not([type="image"]), |
| .win-overlay input:not([type="reset"]), |
| .win-overlay input:not([type="hidden"]), |
| .win-overlay input:not([type="submit"]), |
| .win-overlay textarea, |
| .win-overlay [contenteditable=true] { |
| -ms-touch-select: grippers; |
| } |
| /* Singleton element maintained by _Overlay, used for getting accurate floating point measurements of the total size of the visual viewport. |
| Floating point is necesary in high DPI resolutions. */ |
| .win-visualviewport-space { |
| position: fixed; |
| position: -ms-device-fixed; |
| height: 100%; |
| width: 100%; |
| visibility: hidden; |
| } |
| /* |
| Settings Pane |
| */ |
| .win-settingsflyout { |
| border-left: 1px solid; |
| position: fixed; |
| top: 0; |
| right: 0; |
| height: 100%; |
| width: 319px; |
| /* 320px - border (1px) */ |
| /* Settings back button is slightly smaller. */ |
| } |
| .win-settingsflyout:lang(ar), |
| .win-settingsflyout:lang(dv), |
| .win-settingsflyout:lang(fa), |
| .win-settingsflyout:lang(he), |
| .win-settingsflyout:lang(ku-Arab), |
| .win-settingsflyout:lang(pa-Arab), |
| .win-settingsflyout:lang(prs), |
| .win-settingsflyout:lang(ps), |
| .win-settingsflyout:lang(sd-Arab), |
| .win-settingsflyout:lang(syr), |
| .win-settingsflyout:lang(ug), |
| .win-settingsflyout:lang(ur), |
| .win-settingsflyout:lang(qps-plocm) { |
| border-left: none; |
| border-right: 1px solid; |
| } |
| .win-settingsflyout.win-wide { |
| /* .win-wide is deprecated in Windows 8.1 */ |
| width: 645px; |
| /* 646px - border (1px) */ |
| } |
| .win-settingsflyout .win-backbutton, |
| .win-settingsflyout .win-back { |
| width: 32px; |
| height: 32px; |
| font-size: 20px; |
| line-height: 32px; |
| } |
| .win-settingsflyout .win-header { |
| padding-top: 6px; |
| padding-bottom: 10px; |
| padding-left: 52px; |
| /* 40px for the backbutton */ |
| padding-right: 12px; |
| height: 32px; |
| position: relative; |
| } |
| .win-settingsflyout .win-header .win-label { |
| display: inline-block; |
| font-size: 24px; |
| font-weight: 300; |
| line-height: 32px; |
| white-space: nowrap; |
| } |
| .win-settingsflyout .win-header .win-backbutton, |
| .win-settingsflyout .win-header .win-navigation-backbutton { |
| position: absolute; |
| left: 12px; |
| } |
| .win-settingsflyout .win-content { |
| overflow: auto; |
| padding: 0px 12px; |
| } |
| .win-settingsflyout .win-content .win-label { |
| font-size: 20px; |
| font-weight: 400; |
| line-height: 1.2; |
| } |
| .win-settingsflyout .win-content .win-settings-section { |
| padding-bottom: 39px; |
| margin: 0; |
| padding-top: 0; |
| padding-bottom: 20px; |
| } |
| .win-settingsflyout .win-content .win-settings-section p { |
| margin: 0; |
| padding-top: 0; |
| padding-bottom: 25px; |
| } |
| .win-settingsflyout .win-content .win-settings-section a { |
| margin: 0; |
| padding-top: 0; |
| padding-bottom: 25px; |
| display: inline-block; |
| } |
| .win-settingsflyout .win-content .win-settings-section label { |
| display: block; |
| padding-bottom: 7px; |
| } |
| .win-settingsflyout .win-content .win-settings-section button, |
| .win-settingsflyout .win-content .win-settings-section select, |
| .win-settingsflyout .win-content .win-settings-section input[type=button], |
| .win-settingsflyout .win-content .win-settings-section input[type=text] { |
| margin-bottom: 25px; |
| margin-left: 0; |
| margin-right: 20px; |
| } |
| .win-settingsflyout .win-content .win-settings-section button:lang(ar), |
| .win-settingsflyout .win-content .win-settings-section select:lang(ar), |
| .win-settingsflyout .win-content .win-settings-section input[type=button]:lang(ar), |
| .win-settingsflyout .win-content .win-settings-section input[type=text]:lang(ar), |
| .win-settingsflyout .win-content .win-settings-section button:lang(dv), |
| .win-settingsflyout .win-content .win-settings-section select:lang(dv), |
| .win-settingsflyout .win-content .win-settings-section input[type=button]:lang(dv), |
| .win-settingsflyout .win-content .win-settings-section input[type=text]:lang(dv), |
| .win-settingsflyout .win-content .win-settings-section button:lang(fa), |
| .win-settingsflyout .win-content .win-settings-section select:lang(fa), |
| .win-settingsflyout .win-content .win-settings-section input[type=button]:lang(fa), |
| .win-settingsflyout .win-content .win-settings-section input[type=text]:lang(fa), |
| .win-settingsflyout .win-content .win-settings-section button:lang(he), |
| .win-settingsflyout .win-content .win-settings-section select:lang(he), |
| .win-settingsflyout .win-content .win-settings-section input[type=button]:lang(he), |
| .win-settingsflyout .win-content .win-settings-section input[type=text]:lang(he), |
| .win-settingsflyout .win-content .win-settings-section button:lang(ku-Arab), |
| .win-settingsflyout .win-content .win-settings-section select:lang(ku-Arab), |
| .win-settingsflyout .win-content .win-settings-section input[type=button]:lang(ku-Arab), |
| .win-settingsflyout .win-content .win-settings-section input[type=text]:lang(ku-Arab), |
| .win-settingsflyout .win-content .win-settings-section button:lang(pa-Arab), |
| .win-settingsflyout .win-content .win-settings-section select:lang(pa-Arab), |
| .win-settingsflyout .win-content .win-settings-section input[type=button]:lang(pa-Arab), |
| .win-settingsflyout .win-content .win-settings-section input[type=text]:lang(pa-Arab), |
| .win-settingsflyout .win-content .win-settings-section button:lang(prs), |
| .win-settingsflyout .win-content .win-settings-section select:lang(prs), |
| .win-settingsflyout .win-content .win-settings-section input[type=button]:lang(prs), |
| .win-settingsflyout .win-content .win-settings-section input[type=text]:lang(prs), |
| .win-settingsflyout .win-content .win-settings-section button:lang(ps), |
| .win-settingsflyout .win-content .win-settings-section select:lang(ps), |
| .win-settingsflyout .win-content .win-settings-section input[type=button]:lang(ps), |
| .win-settingsflyout .win-content .win-settings-section input[type=text]:lang(ps), |
| .win-settingsflyout .win-content .win-settings-section button:lang(sd-Arab), |
| .win-settingsflyout .win-content .win-settings-section select:lang(sd-Arab), |
| .win-settingsflyout .win-content .win-settings-section input[type=button]:lang(sd-Arab), |
| .win-settingsflyout .win-content .win-settings-section input[type=text]:lang(sd-Arab), |
| .win-settingsflyout .win-content .win-settings-section button:lang(syr), |
| .win-settingsflyout .win-content .win-settings-section select:lang(syr), |
| .win-settingsflyout .win-content .win-settings-section input[type=button]:lang(syr), |
| .win-settingsflyout .win-content .win-settings-section input[type=text]:lang(syr), |
| .win-settingsflyout .win-content .win-settings-section button:lang(ug), |
| .win-settingsflyout .win-content .win-settings-section select:lang(ug), |
| .win-settingsflyout .win-content .win-settings-section input[type=button]:lang(ug), |
| .win-settingsflyout .win-content .win-settings-section input[type=text]:lang(ug), |
| .win-settingsflyout .win-content .win-settings-section button:lang(ur), |
| .win-settingsflyout .win-content .win-settings-section select:lang(ur), |
| .win-settingsflyout .win-content .win-settings-section input[type=button]:lang(ur), |
| .win-settingsflyout .win-content .win-settings-section input[type=text]:lang(ur), |
| .win-settingsflyout .win-content .win-settings-section button:lang(qps-plocm), |
| .win-settingsflyout .win-content .win-settings-section select:lang(qps-plocm), |
| .win-settingsflyout .win-content .win-settings-section input[type=button]:lang(qps-plocm), |
| .win-settingsflyout .win-content .win-settings-section input[type=text]:lang(qps-plocm) { |
| margin-bottom: 25px; |
| margin-left: 20px; |
| margin-right: 0; |
| } |
| .win-settingsflyout .win-content .win-settings-section input[type=radio] { |
| margin-top: 0; |
| margin-bottom: 0; |
| padding-bottom: 15px; |
| } |
| /*Flyout control animations*/ |
| @keyframes WinJS-showFlyoutTop { |
| from { |
| transform: translateY(50px); |
| } |
| to { |
| transform: none; |
| } |
| } |
| @keyframes WinJS-showFlyoutBottom { |
| from { |
| transform: translateY(-50px); |
| } |
| to { |
| transform: none; |
| } |
| } |
| @keyframes WinJS-showFlyoutLeft { |
| from { |
| transform: translateX(50px); |
| } |
| to { |
| transform: none; |
| } |
| } |
| @keyframes WinJS-showFlyoutRight { |
| from { |
| transform: translateX(-50px); |
| } |
| to { |
| transform: none; |
| } |
| } |
| @-webkit-keyframes -webkit-WinJS-showFlyoutTop { |
| from { |
| -webkit-transform: translateY(50px); |
| } |
| to { |
| -webkit-transform: none; |
| } |
| } |
| @-webkit-keyframes -webkit-WinJS-showFlyoutBottom { |
| from { |
| -webkit-transform: translateY(-50px); |
| } |
| to { |
| -webkit-transform: none; |
| } |
| } |
| @-webkit-keyframes -webkit-WinJS-showFlyoutLeft { |
| from { |
| -webkit-transform: translateX(50px); |
| } |
| to { |
| -webkit-transform: none; |
| } |
| } |
| @-webkit-keyframes -webkit-WinJS-showFlyoutRight { |
| from { |
| -webkit-transform: translateX(-50px); |
| } |
| to { |
| -webkit-transform: none; |
| } |
| } |
| .win-commandingsurface { |
| outline: none; |
| min-width: 32px; |
| /* enough to fit the overflowbutton */ |
| position: relative; |
| } |
| .win-commandingsurface.win-commandingsurface-overflowbottom .win-commandingsurface-overflowareacontainer { |
| top: 100%; |
| } |
| .win-commandingsurface.win-commandingsurface-overflowtop .win-commandingsurface-overflowareacontainer { |
| bottom: 100%; |
| } |
| .win-commandingsurface .win-commandingsurface-actionarea { |
| min-height: 24px; |
| vertical-align: top; |
| overflow: hidden; |
| display: -ms-flexbox; |
| display: -webkit-flex; |
| display: flex; |
| -ms-flex-pack: end; |
| -webkit-justify-content: flex-end; |
| justify-content: flex-end; |
| -ms-flex-align: start; |
| -webkit-align-items: flex-start; |
| align-items: flex-start; |
| } |
| .win-commandingsurface .win-commandingsurface-actionarea .win-commandingsurface-spacer { |
| visibility: hidden; |
| min-height: 48px; |
| /* height of a primary command with no label */ |
| width: 0px; |
| } |
| .win-commandingsurface .win-commandingsurface-actionarea .win-command, |
| .win-commandingsurface .win-commandingsurface-actionarea .win-commandingsurface-overflowbutton { |
| touch-action: manipulation; |
| -ms-flex: 0 0 auto; |
| -webkit-flex: 0 0 auto; |
| flex: 0 0 auto; |
| } |
| .win-commandingsurface .win-commandingsurface-actionarea .win-commandingsurface-overflowbutton { |
| width: 32px; |
| /* 30px + 2px border */ |
| margin: 0px; |
| padding: 0px; |
| border-width: 1px; |
| border-style: dotted; |
| min-width: 0px; |
| min-height: 0px; |
| outline: none; |
| -ms-flex-item-align: stretch; |
| -webkit-align-self: stretch; |
| align-self: stretch; |
| box-sizing: border-box; |
| background-clip: border-box; |
| } |
| .win-commandingsurface .win-commandingsurface-actionarea .win-commandingsurface-overflowbutton .win-commandingsurface-ellipsis { |
| font-size: 16px; |
| font-family: "Segoe MDL2 Assets", "Symbols"; |
| } |
| .win-commandingsurface .win-commandingsurface-actionarea .win-commandingsurface-overflowbutton .win-commandingsurface-ellipsis::before { |
| content: "\E10C"; |
| } |
| .win-commandingsurface.win-commandingsurface-opened .win-commandingsurface-actionarea { |
| height: auto; |
| } |
| .win-commandingsurface.win-commandingsurface-opened .win-commandingsurface-overflowarea, |
| .win-commandingsurface.win-commandingsurface-opened .win-commandingsurface-overflowareacontainer { |
| display: block; |
| } |
| .win-commandingsurface.win-commandingsurface-closed.win-commandingsurface-closeddisplayfull .win-commandingsurface-actionarea { |
| height: auto; |
| } |
| .win-commandingsurface.win-commandingsurface-closed.win-commandingsurface-closeddisplaycompact .win-commandingsurface-actionarea { |
| height: 48px; |
| } |
| .win-commandingsurface.win-commandingsurface-closed.win-commandingsurface-closeddisplaycompact .win-commandingsurface-actionarea .win-command .win-label { |
| display: none; |
| } |
| .win-commandingsurface.win-commandingsurface-closed.win-commandingsurface-closeddisplayminimal .win-commandingsurface-actionarea { |
| height: 24px; |
| } |
| .win-commandingsurface.win-commandingsurface-closed.win-commandingsurface-closeddisplayminimal .win-commandingsurface-actionarea .win-command, |
| .win-commandingsurface.win-commandingsurface-closed.win-commandingsurface-closeddisplayminimal .win-commandingsurface-actionarea .win-commandingsurface-spacer { |
| display: none; |
| } |
| .win-commandingsurface.win-commandingsurface-closed.win-commandingsurface-closeddisplaynone { |
| display: none; |
| } |
| .win-commandingsurface.win-commandingsurface-closed .win-commandingsurface-overflowarea, |
| .win-commandingsurface.win-commandingsurface-closed .win-commandingsurface-overflowareacontainer { |
| display: none; |
| } |
| .win-commandingsurface .win-commandingsurface-insetoutline { |
| /* Display none except in High Contrast scenarios */ |
| display: none; |
| } |
| .win-commandingsurface .win-commandingsurface-overflowareacontainer { |
| position: absolute; |
| overflow: hidden; |
| right: 0; |
| left: auto; |
| } |
| .win-commandingsurface .win-commandingsurface-overflowareacontainer:lang(ar), |
| .win-commandingsurface .win-commandingsurface-overflowareacontainer:lang(dv), |
| .win-commandingsurface .win-commandingsurface-overflowareacontainer:lang(fa), |
| .win-commandingsurface .win-commandingsurface-overflowareacontainer:lang(he), |
| .win-commandingsurface .win-commandingsurface-overflowareacontainer:lang(ku-Arab), |
| .win-commandingsurface .win-commandingsurface-overflowareacontainer:lang(pa-Arab), |
| .win-commandingsurface .win-commandingsurface-overflowareacontainer:lang(prs), |
| .win-commandingsurface .win-commandingsurface-overflowareacontainer:lang(ps), |
| .win-commandingsurface .win-commandingsurface-overflowareacontainer:lang(sd-Arab), |
| .win-commandingsurface .win-commandingsurface-overflowareacontainer:lang(syr), |
| .win-commandingsurface .win-commandingsurface-overflowareacontainer:lang(ug), |
| .win-commandingsurface .win-commandingsurface-overflowareacontainer:lang(ur), |
| .win-commandingsurface .win-commandingsurface-overflowareacontainer:lang(qps-plocm) { |
| left: 0; |
| right: auto; |
| } |
| .win-commandingsurface .win-commandingsurface-overflowarea, |
| .win-commandingsurface .win-commandingsurface-overflowareacontainer { |
| min-width: 160px; |
| min-height: 0; |
| max-height: 50vh; |
| padding: 0; |
| } |
| .win-commandingsurface .win-commandingsurface-overflowarea { |
| display: -ms-flexbox; |
| display: -webkit-flex; |
| display: flex; |
| -ms-flex-direction: column; |
| -webkit-flex-direction: column; |
| flex-direction: column; |
| overflow-y: auto; |
| overflow-x: hidden; |
| } |
| .win-commandingsurface .win-commandingsurface-overflowarea.win-menu { |
| max-width: 480px; |
| /* override max-width styles from WinJS.UI.Menu */ |
| } |
| .win-commandingsurface .win-commandingsurface-overflowarea .win-commandingsurface-spacer { |
| /* Reserves space at the bottom of the overflow area */ |
| visibility: hidden; |
| height: 24px; |
| } |
| .win-commandingsurface .win-commandingsurface-overflowarea button.win-command { |
| -ms-flex: 0 0 auto; |
| -webkit-flex: 0 0 auto; |
| flex: 0 0 auto; |
| min-height: 44px; |
| border: 1px dotted transparent; |
| padding: 10px 11px 12px 11px; |
| font-size: 15px; |
| font-weight: 400; |
| line-height: 1.333; |
| white-space: nowrap; |
| overflow: hidden; |
| } |
| .win-commandingsurface .win-commandingsurface-overflowarea hr.win-command { |
| -ms-flex: 0 0 auto; |
| -webkit-flex: 0 0 auto; |
| flex: 0 0 auto; |
| height: 2px; |
| margin: 6px 12px 4px 12px; |
| } |
| .win-commandingsurface .win-commandingsurface-actionareacontainer { |
| overflow: hidden; |
| position: relative; |
| } |
| .win-commandingsurface.win-commandingsurface-closing.win-commandingsurface-closeddisplaycompact .win-command .win-label, |
| .win-commandingsurface.win-commandingsurface-closing.win-commandingsurface-closeddisplayminimal .win-command, |
| .win-commandingsurface.win-commandingsurface-closing.win-commandingsurface-closeddisplaynone .win-command { |
| opacity: 0; |
| } |
| .win-commandingsurface .win-command.win-command-hidden { |
| display: inline-block; |
| } |
| .win-commandingsurface .win-command.win-commandingsurface-command-hidden { |
| display: none; |
| } |
| .win-commandingsurface .win-command.win-commandingsurface-command-primary-overflown, |
| .win-commandingsurface .win-command.win-commandingsurface-command-secondary-overflown, |
| .win-commandingsurface .win-command.win-commandingsurface-command-separator-hidden { |
| display: none; |
| } |
| @media (max-width: 480px) { |
| .win-commandingsurface .win-commandingsurface-overflowarea.win-menu { |
| width: 100vw; |
| } |
| } |
| .win-toolbar { |
| min-width: 32px; |
| /* enough to fit the overflowbutton */ |
| } |
| .win-toolbar.win-toolbar-opened { |
| position: fixed; |
| } |
| .win-autosuggestbox { |
| white-space: normal; |
| position: relative; |
| width: 266px; |
| min-width: 265px; |
| min-height: 28px; |
| } |
| .win-autosuggestbox-flyout { |
| position: absolute; |
| top: 100%; |
| width: 100%; |
| z-index: 100; |
| max-height: 374px; |
| min-height: 44px; |
| overflow: auto; |
| -ms-scroll-chaining: none; |
| touch-action: none; |
| font-size: 15px; |
| font-weight: 400; |
| line-height: 1.333; |
| } |
| .win-autosuggestbox-flyout-above { |
| bottom: 100%; |
| top: auto; |
| } |
| .win-autosuggestbox-flyout-above .win-repeater { |
| display: -ms-flexbox; |
| display: -webkit-flex; |
| display: flex; |
| -ms-flex-direction: column-reverse; |
| -webkit-flex-direction: column-reverse; |
| flex-direction: column-reverse; |
| } |
| .win-autosuggestbox .win-autosuggestbox-input { |
| -ms-ime-align: after; |
| margin: 0; |
| width: 100%; |
| } |
| .win-autosuggestbox-suggestion-selected { |
| outline-style: dotted; |
| outline-width: 1px; |
| } |
| .win-autosuggestbox-suggestion-result { |
| display: -ms-flexbox; |
| display: -webkit-flex; |
| display: flex; |
| padding: 0 18px; |
| height: 60px; |
| font-size: 11pt; |
| outline: none; |
| } |
| .win-autosuggestbox-suggestion-result div { |
| line-height: 20px; |
| white-space: nowrap; |
| overflow: hidden; |
| } |
| .win-autosuggestbox-suggestion-result-text { |
| padding-top: 9px; |
| padding-bottom: 11px; |
| height: 60px; |
| width: 179px; |
| white-space: nowrap; |
| overflow: hidden; |
| line-height: 20px; |
| } |
| .win-autosuggestbox-suggestion-result-detailed-text { |
| display: inline-block; |
| overflow: hidden; |
| line-height: 22px; |
| /* Some characters get clipped if line height is < 22px. Work around by setting -2 margin. */ |
| margin-top: -1px; |
| width: 100%; |
| } |
| .win-autosuggestbox-suggestion-result img { |
| width: 40px; |
| height: 40px; |
| margin-left: 0; |
| padding-right: 10px; |
| padding-top: 10px; |
| padding-bottom: 10px; |
| } |
| .win-autosuggestbox-suggestion-result img:lang(ar), |
| .win-autosuggestbox-suggestion-result img:lang(dv), |
| .win-autosuggestbox-suggestion-result img:lang(fa), |
| .win-autosuggestbox-suggestion-result img:lang(he), |
| .win-autosuggestbox-suggestion-result img:lang(ku-Arab), |
| .win-autosuggestbox-suggestion-result img:lang(pa-Arab), |
| .win-autosuggestbox-suggestion-result img:lang(prs), |
| .win-autosuggestbox-suggestion-result img:lang(ps), |
| .win-autosuggestbox-suggestion-result img:lang(sd-Arab), |
| .win-autosuggestbox-suggestion-result img:lang(syr), |
| .win-autosuggestbox-suggestion-result img:lang(ug), |
| .win-autosuggestbox-suggestion-result img:lang(ur), |
| .win-autosuggestbox-suggestion-result img:lang(qps-plocm) { |
| margin-right: 0; |
| margin-left: auto; |
| padding-left: 10px; |
| padding-right: 0; |
| } |
| .win-autosuggestbox-suggestion-query { |
| height: 20px; |
| padding: 11px 0px 13px 12px; |
| outline: none; |
| white-space: nowrap; |
| overflow: hidden; |
| line-height: 20px; |
| } |
| .win-autosuggestbox-suggestion-separator { |
| display: -ms-flexbox; |
| display: -webkit-flex; |
| display: flex; |
| padding: 0 18px; |
| height: 40px; |
| font-size: 11pt; |
| } |
| .win-autosuggestbox-suggestion-separator hr { |
| -ms-flex: 1 1 auto; |
| -webkit-flex: 1 1 auto; |
| flex: 1 1 auto; |
| margin-top: 18px; |
| border-style: solid; |
| border-width: 1px 0px 0px 0px; |
| } |
| .win-autosuggestbox-suggestion-separator hr:lang(ar), |
| .win-autosuggestbox-suggestion-separator hr:lang(dv), |
| .win-autosuggestbox-suggestion-separator hr:lang(fa), |
| .win-autosuggestbox-suggestion-separator hr:lang(he), |
| .win-autosuggestbox-suggestion-separator hr:lang(ku-Arab), |
| .win-autosuggestbox-suggestion-separator hr:lang(pa-Arab), |
| .win-autosuggestbox-suggestion-separator hr:lang(prs), |
| .win-autosuggestbox-suggestion-separator hr:lang(ps), |
| .win-autosuggestbox-suggestion-separator hr:lang(sd-Arab), |
| .win-autosuggestbox-suggestion-separator hr:lang(syr), |
| .win-autosuggestbox-suggestion-separator hr:lang(ug), |
| .win-autosuggestbox-suggestion-separator hr:lang(ur), |
| .win-autosuggestbox-suggestion-separator hr:lang(qps-plocm) { |
| margin-right: 10px; |
| margin-left: auto; |
| } |
| .win-autosuggestbox-suggestion-separator div { |
| text-overflow: ellipsis; |
| white-space: nowrap; |
| overflow: hidden; |
| padding-top: 9px; |
| padding-bottom: 11px; |
| line-height: 20px; |
| margin-right: 10px; |
| } |
| .win-autosuggestbox-suggestion-separator div:lang(ar), |
| .win-autosuggestbox-suggestion-separator div:lang(dv), |
| .win-autosuggestbox-suggestion-separator div:lang(fa), |
| .win-autosuggestbox-suggestion-separator div:lang(he), |
| .win-autosuggestbox-suggestion-separator div:lang(ku-Arab), |
| .win-autosuggestbox-suggestion-separator div:lang(pa-Arab), |
| .win-autosuggestbox-suggestion-separator div:lang(prs), |
| .win-autosuggestbox-suggestion-separator div:lang(ps), |
| .win-autosuggestbox-suggestion-separator div:lang(sd-Arab), |
| .win-autosuggestbox-suggestion-separator div:lang(syr), |
| .win-autosuggestbox-suggestion-separator div:lang(ug), |
| .win-autosuggestbox-suggestion-separator div:lang(ur), |
| .win-autosuggestbox-suggestion-separator div:lang(qps-plocm) { |
| margin-left: 10px; |
| margin-right: auto; |
| } |
| /* |
| ASB control animations |
| */ |
| @keyframes WinJS-flyoutBelowASB-showPopup { |
| from { |
| transform: translateY(0px); |
| } |
| to { |
| transform: none; |
| } |
| } |
| @keyframes WinJS-flyoutAboveASB-showPopup { |
| from { |
| transform: translateY(0px); |
| } |
| to { |
| transform: none; |
| } |
| } |
| @-webkit-keyframes -webkit-WinJS-flyoutBelowASB-showPopup { |
| from { |
| -webkit-transform: translateY(0px); |
| } |
| to { |
| -webkit-transform: none; |
| } |
| } |
| @-webkit-keyframes -webkit-WinJS-flyoutAboveASB-showPopup { |
| from { |
| -webkit-transform: translateY(0px); |
| } |
| to { |
| -webkit-transform: none; |
| } |
| } |
| @media (-ms-high-contrast) { |
| .win-autosuggestbox { |
| border-color: ButtonText; |
| background-color: ButtonFace; |
| color: ButtonText; |
| } |
| .win-autosuggestbox-disabled { |
| background-color: ButtonFace; |
| border-color: GrayText; |
| } |
| .win-autosuggestbox-disabled input[disabled] { |
| background-color: ButtonFace; |
| color: GrayText; |
| border-color: GrayText; |
| } |
| .win-autosuggestbox-disabled div { |
| color: GrayText; |
| background-color: ButtonFace; |
| } |
| .win-autosuggestbox:-ms-input-placeholder, |
| .win-autosuggestbox::-webkit-input-placeholder, |
| .win-autosuggestbox::-moz-input-placeholder { |
| color: GrayText; |
| } |
| .win-autosuggestbox-flyout { |
| border-color: ButtonText; |
| background-color: ButtonFace; |
| } |
| .win-autosuggestbox-flyout-highlighttext { |
| color: ButtonText; |
| } |
| html.win-hoverable .win-autosuggestbox-suggestion-result:hover, |
| html.win-hoverable .win-autosuggestbox-query:hover { |
| background-color: Highlight; |
| color: HighlightText; |
| } |
| html.win-hoverable .win-autosuggestbox-suggestion-result:hover .win-autosuggestbox-flyout-highlighttext, |
| html.win-hoverable .win-autosuggestbox-suggestion-query:hover .win-autosuggestbox-flyout-highlighttext { |
| color: HighlightText; |
| } |
| .win-autosuggestbox-suggestion-query, |
| .win-autosuggestbox-suggestion-result { |
| color: ButtonText; |
| } |
| .win-autosuggestbox-suggestion-selected { |
| background-color: Highlight; |
| color: HighlightText; |
| } |
| .win-autosuggestbox-suggestion-separator { |
| color: ButtonText; |
| } |
| .win-autosuggestbox-suggestion-separator hr { |
| border-color: ButtonText; |
| } |
| .win-autosuggestbox-suggestion-selected .win-autosuggestbox-flyout-highlighttext { |
| color: HighlightText; |
| } |
| } |
| /* |
| Hide clear button in search box control. |
| */ |
| .win-searchbox input[type=search]::-ms-clear { |
| display: none; |
| } |
| .win-searchbox input[type=search]::-webkit-search-cancel-button { |
| display: none; |
| } |
| .win-searchbox-button { |
| position: absolute; |
| right: 0; |
| top: 0; |
| width: 32px; |
| font-family: "Segoe MDL2 Assets", "Symbols"; |
| font-size: 15px; |
| border-style: none; |
| height: 100%; |
| text-align: center; |
| } |
| .win-searchbox-button:lang(ar), |
| .win-searchbox-button:lang(dv), |
| .win-searchbox-button:lang(fa), |
| .win-searchbox-button:lang(he), |
| .win-searchbox-button:lang(ku-Arab), |
| .win-searchbox-button:lang(pa-Arab), |
| .win-searchbox-button:lang(prs), |
| .win-searchbox-button:lang(ps), |
| .win-searchbox-button:lang(sd-Arab), |
| .win-searchbox-button:lang(syr), |
| .win-searchbox-button:lang(ug), |
| .win-searchbox-button:lang(ur), |
| .win-searchbox-button:lang(qps-plocm) { |
| right: auto; |
| left: 0; |
| } |
| .win-searchbox-button.win-searchbox-button:before { |
| content: "\E094"; |
| position: absolute; |
| left: 8px; |
| top: 8px; |
| line-height: 100%; |
| } |
| @media (-ms-high-contrast) { |
| .win-searchbox-button { |
| background-color: ButtonFace; |
| color: ButtonText; |
| } |
| html.win-hoverable .win-searchbox-button[disabled=false]:hover { |
| border-color: ButtonText; |
| background-color: HighLight; |
| color: HighLightText; |
| } |
| .win-searchbox-button-input-focus { |
| background-color: ButtonText; |
| color: ButtonFace; |
| } |
| html.win-hoverable .win-searchbox-button-input-focus:hover { |
| border-color: ButtonText; |
| background-color: HighLight; |
| color: HighLightText; |
| } |
| .win-searchbox-button:active { |
| background-color: ButtonText; |
| color: ButtonFace; |
| } |
| } |
| /* |
| SplitViewCommand |
| */ |
| .win-splitviewcommand { |
| display: -ms-flexbox; |
| display: -webkit-flex; |
| display: flex; |
| -ms-flex: 0 0 auto; |
| -webkit-flex: 0 0 auto; |
| flex: 0 0 auto; |
| touch-action: manipulation; |
| } |
| .win-splitviewcommand-button { |
| -ms-flex: 1 1 0%; |
| -webkit-flex: 1 1 0%; |
| flex: 1 1 0%; |
| position: relative; |
| } |
| .win-splitviewcommand-button-content { |
| position: relative; |
| height: 48px; |
| padding-left: 16px; |
| padding-right: 16px; |
| display: -ms-flexbox; |
| display: -webkit-flex; |
| display: flex; |
| } |
| .win-splitviewcommand-button:focus { |
| z-index: 1; |
| outline: none; |
| } |
| .win-splitviewcommand-icon { |
| font-family: "Segoe MDL2 Assets", "Symbols"; |
| height: 16px; |
| width: 16px; |
| font-size: 16px; |
| margin-left: 0; |
| margin-right: 16px; |
| margin-top: 14px; |
| /* Center icon vertically */ |
| line-height: 1; |
| /* Ensure icon is exactly font-size */ |
| -ms-flex: 0 0 auto; |
| -webkit-flex: 0 0 auto; |
| flex: 0 0 auto; |
| } |
| .win-splitviewcommand-icon:lang(ar), |
| .win-splitviewcommand-icon:lang(dv), |
| .win-splitviewcommand-icon:lang(fa), |
| .win-splitviewcommand-icon:lang(he), |
| .win-splitviewcommand-icon:lang(ku-Arab), |
| .win-splitviewcommand-icon:lang(pa-Arab), |
| .win-splitviewcommand-icon:lang(prs), |
| .win-splitviewcommand-icon:lang(ps), |
| .win-splitviewcommand-icon:lang(sd-Arab), |
| .win-splitviewcommand-icon:lang(syr), |
| .win-splitviewcommand-icon:lang(ug), |
| .win-splitviewcommand-icon:lang(ur), |
| .win-splitviewcommand-icon:lang(qps-plocm) { |
| margin-right: 0; |
| margin-left: 16px; |
| } |
| .win-splitviewcommand-label { |
| -ms-flex: 1 1 0%; |
| -webkit-flex: 1 1 0%; |
| flex: 1 1 0%; |
| overflow: hidden; |
| white-space: nowrap; |
| font-size: 15px; |
| font-weight: 400; |
| line-height: 1.333; |
| margin-top: 13px; |
| margin-bottom: 15px; |
| } |
| @media (-ms-high-contrast) { |
| /* |
| SplitViewCommand colors. |
| */ |
| .win-splitviewcommand-button { |
| background-color: ButtonFace; |
| color: ButtonText; |
| } |
| .win-splitviewcommand-button:after { |
| position: absolute; |
| top: 0; |
| left: 0; |
| border: 2px solid ButtonText; |
| content: ""; |
| width: calc(100% - 3px); |
| height: calc(100% - 3px); |
| pointer-events: none; |
| } |
| html.win-hoverable .win-splitviewcommand-button:hover { |
| background-color: Highlight; |
| color: HighlightText; |
| } |
| .win-splitviewcommand-button.win-pressed, |
| html.win-hoverable .win-splitviewcommand-button.win-pressed:hover { |
| background-color: ButtonText; |
| color: ButtonFace; |
| } |
| } |
| .win-navbar { |
| /* NavBar should overlay content in the body when opened or closed. |
| * This z-index value is chosen to be smaller than light dismissables. |
| * z-index will be overwritten by the light dismiss service to an even |
| * higher value when the NavBar is in the opened state. |
| */ |
| z-index: 999; |
| } |
| .win-navbar.win-navbar-showing, |
| .win-navbar.win-navbar-shown, |
| .win-navbar.win-navbar-hiding { |
| min-height: 60px; |
| } |
| .win-navbar .win-navbar-invokebutton { |
| width: 32px; |
| min-height: 0; |
| height: 24px; |
| } |
| .win-navbar .win-navbar-invokebutton .win-navbar-ellipsis { |
| width: 32px; |
| } |
| .win-navbar.win-top .win-navbar-invokebutton { |
| bottom: 0; |
| } |
| .win-navbar.win-top .win-navbar-invokebutton .win-navbar-ellipsis { |
| top: 5px; |
| } |
| .win-navbar.win-bottom .win-navbar-invokebutton { |
| top: 0; |
| } |
| .win-navbar.win-bottom .win-navbar-invokebutton .win-navbar-ellipsis { |
| top: 0; |
| } |
| .win-navbarcontainer { |
| width: 100%; |
| position: relative; |
| } |
| .win-navbarcontainer-pageindicator-box { |
| position: absolute; |
| width: 100%; |
| text-align: center; |
| pointer-events: none; |
| } |
| .win-navbarcontainer-vertical .win-navbarcontainer-pageindicator-box { |
| display: none; |
| } |
| .win-navbarcontainer-pageindicator { |
| display: inline-block; |
| width: 40px; |
| height: 4px; |
| margin: 4px 2px 16px 2px; |
| } |
| .win-navbarcontainer-horizontal .win-navbarcontainer-viewport::-webkit-scrollbar { |
| width: 0; |
| height: 0; |
| } |
| .win-navbarcontainer-horizontal .win-navbarcontainer-viewport { |
| padding: 20px 0; |
| overflow-x: auto; |
| overflow-y: hidden; |
| overflow: -moz-scrollbars-none; |
| -ms-scroll-snap-type: mandatory; |
| -ms-scroll-snap-points-x: snapInterval(0%, 100%); |
| -ms-overflow-style: none; |
| touch-action: pan-x; |
| } |
| .win-navbarcontainer-vertical .win-navbarcontainer-viewport { |
| overflow-x: hidden; |
| overflow-y: auto; |
| max-height: 216px; |
| -ms-overflow-style: -ms-autohiding-scrollbar; |
| touch-action: pan-y; |
| -webkit-overflow-scrolling: touch; |
| } |
| .win-navbarcontainer-horizontal .win-navbarcontainer-surface { |
| display: -ms-flexbox; |
| display: -webkit-flex; |
| display: flex; |
| -ms-flex-direction: column; |
| -webkit-flex-direction: column; |
| flex-direction: column; |
| -ms-flex-wrap: wrap; |
| -webkit-flex-wrap: wrap; |
| flex-wrap: wrap; |
| -ms-flex-line-pack: start; |
| -webkit-align-content: flex-start; |
| align-content: flex-start; |
| } |
| .win-navbarcontainer-vertical .win-navbarcontainer-surface { |
| padding: 12px 0; |
| } |
| .win-navbarcontainer-navarrow { |
| touch-action: manipulation; |
| position: absolute; |
| z-index: 2; |
| top: 24px; |
| display: -ms-flexbox; |
| display: -webkit-flex; |
| display: flex; |
| -ms-flex-direction: column; |
| -webkit-flex-direction: column; |
| flex-direction: column; |
| -ms-flex-align: center; |
| -webkit-align-items: center; |
| align-items: center; |
| -ms-flex-pack: center; |
| -webkit-justify-content: center; |
| justify-content: center; |
| font-family: "Segoe MDL2 Assets", "Symbols"; |
| height: calc(100% - 48px); |
| width: 20px; |
| font-size: 16px; |
| overflow: hidden; |
| } |
| .win-navbarcontainer-vertical .win-navbarcontainer-navarrow { |
| display: none; |
| } |
| .win-navbarcontainer-navleft { |
| left: 0; |
| margin-right: 2px; |
| } |
| .win-navbarcontainer-navleft::before { |
| content: '\E0E2'; |
| } |
| .win-navbarcontainer-navright { |
| right: 0; |
| margin-left: 2px; |
| } |
| .win-navbarcontainer-navright::before { |
| content: '\E0E3'; |
| } |
| /* |
| NavBarCommand |
| */ |
| .win-navbarcommand { |
| display: -ms-flexbox; |
| display: -webkit-flex; |
| display: flex; |
| -ms-flex: 0 0 auto; |
| -webkit-flex: 0 0 auto; |
| flex: 0 0 auto; |
| touch-action: manipulation; |
| } |
| .win-navbarcontainer-horizontal .win-navbarcommand { |
| margin: 4px; |
| width: 192px; |
| } |
| .win-navbarcontainer-vertical .win-navbarcommand { |
| margin: 4px 24px; |
| } |
| .win-navbarcommand-button { |
| -ms-flex: 1 1 0%; |
| -webkit-flex: 1 1 0%; |
| flex: 1 1 0%; |
| position: relative; |
| } |
| .win-navbarcommand-button-content { |
| position: relative; |
| height: 48px; |
| padding-left: 16px; |
| padding-right: 16px; |
| display: -ms-flexbox; |
| display: -webkit-flex; |
| display: flex; |
| } |
| .win-navbarcommand-button:focus { |
| z-index: 1; |
| outline: none; |
| } |
| .win-navbarcommand-icon { |
| font-family: "Segoe MDL2 Assets", "Symbols"; |
| height: 16px; |
| width: 16px; |
| font-size: 16px; |
| margin-left: 0; |
| margin-right: 16px; |
| margin-top: 14px; |
| /* Center icon vertically */ |
| line-height: 1; |
| /* Ensure icon is exactly font-size */ |
| -ms-flex: 0 0 auto; |
| -webkit-flex: 0 0 auto; |
| flex: 0 0 auto; |
| } |
| .win-navbarcommand-icon:lang(ar), |
| .win-navbarcommand-icon:lang(dv), |
| .win-navbarcommand-icon:lang(fa), |
| .win-navbarcommand-icon:lang(he), |
| .win-navbarcommand-icon:lang(ku-Arab), |
| .win-navbarcommand-icon:lang(pa-Arab), |
| .win-navbarcommand-icon:lang(prs), |
| .win-navbarcommand-icon:lang(ps), |
| .win-navbarcommand-icon:lang(sd-Arab), |
| .win-navbarcommand-icon:lang(syr), |
| .win-navbarcommand-icon:lang(ug), |
| .win-navbarcommand-icon:lang(ur), |
| .win-navbarcommand-icon:lang(qps-plocm) { |
| margin-right: 0; |
| margin-left: 16px; |
| } |
| .win-navbarcommand-label { |
| -ms-flex: 1 1 0%; |
| -webkit-flex: 1 1 0%; |
| flex: 1 1 0%; |
| overflow: hidden; |
| white-space: nowrap; |
| font-size: 15px; |
| font-weight: 400; |
| line-height: 1.333; |
| margin-top: 13px; |
| margin-bottom: 15px; |
| } |
| .win-navbarcommand-splitbutton { |
| -ms-flex: 0 0 auto; |
| -webkit-flex: 0 0 auto; |
| flex: 0 0 auto; |
| width: 48px; |
| font-family: "Segoe MDL2 Assets", "Symbols"; |
| font-size: 16px; |
| margin-right: 0; |
| margin-left: 2px; |
| position: relative; |
| } |
| .win-navbarcommand-splitbutton:lang(ar), |
| .win-navbarcommand-splitbutton:lang(dv), |
| .win-navbarcommand-splitbutton:lang(fa), |
| .win-navbarcommand-splitbutton:lang(he), |
| .win-navbarcommand-splitbutton:lang(ku-Arab), |
| .win-navbarcommand-splitbutton:lang(pa-Arab), |
| .win-navbarcommand-splitbutton:lang(prs), |
| .win-navbarcommand-splitbutton:lang(ps), |
| .win-navbarcommand-splitbutton:lang(sd-Arab), |
| .win-navbarcommand-splitbutton:lang(syr), |
| .win-navbarcommand-splitbutton:lang(ug), |
| .win-navbarcommand-splitbutton:lang(ur), |
| .win-navbarcommand-splitbutton:lang(qps-plocm) { |
| margin-left: 0; |
| margin-right: 2px; |
| } |
| .win-navbarcommand-splitbutton::before { |
| content: '\E019'; |
| pointer-events: none; |
| position: absolute; |
| box-sizing: border-box; |
| top: 0; |
| left: 0; |
| height: 100%; |
| width: 100%; |
| text-align: center; |
| line-height: 46px; |
| border: 1px dotted transparent; |
| } |
| .win-navbarcommand-splitbutton.win-navbarcommand-splitbutton-opened::before { |
| content: '\E018'; |
| } |
| .win-navbarcommand-splitbutton:focus { |
| outline: none; |
| } |
| @media (-ms-high-contrast) { |
| .win-navbarcontainer-pageindicator { |
| background-color: ButtonFace; |
| } |
| .win-navbarcontainer-pageindicator:after { |
| display: block; |
| border: 1px solid ButtonText; |
| content: ""; |
| width: calc(100% - 2px); |
| height: calc(100% - 2px); |
| } |
| .win-navbarcontainer-pageindicator-current { |
| background-color: ButtonText; |
| } |
| html.win-hoverable .win-navbarcontainer-pageindicator:hover { |
| background-color: Highlight; |
| } |
| html.win-hoverable .win-navbarcontainer-pageindicator-current:hover { |
| background-color: ButtonText; |
| } |
| .win-navbarcontainer-pageindicator:hover:active { |
| background-color: ButtonText; |
| } |
| .win-navbarcontainer-navarrow { |
| background-color: ButtonFace; |
| color: ButtonText; |
| } |
| .win-navbarcontainer-navarrow:after { |
| position: absolute; |
| top: 0; |
| left: 0; |
| border: 2px solid ButtonText; |
| content: ""; |
| width: calc(100% - 3px); |
| height: calc(100% - 3px); |
| } |
| html.win-hoverable .win-navbarcontainer-navarrow:hover { |
| background-color: Highlight; |
| color: HighlightText; |
| } |
| .win-navbarcontainer-navarrow:hover:active { |
| background-color: ButtonText; |
| color: ButtonFace; |
| } |
| /* |
| NavBarCommand colors. |
| */ |
| .win-navbarcommand-button, |
| .win-navbarcommand-splitbutton { |
| background-color: ButtonFace; |
| color: ButtonText; |
| } |
| .win-navbarcommand-button:after, |
| .win-navbarcommand-splitbutton:after { |
| position: absolute; |
| top: 0; |
| left: 0; |
| border: 2px solid ButtonText; |
| content: ""; |
| width: calc(100% - 3px); |
| height: calc(100% - 3px); |
| pointer-events: none; |
| } |
| html.win-hoverable .win-navbarcommand-button:hover, |
| html.win-hoverable .win-navbarcommand-splitbutton:hover { |
| background-color: Highlight; |
| color: HighlightText; |
| } |
| .win-navbarcommand-splitbutton.win-navbarcommand-splitbutton-opened, |
| html.win-hoverable .win-navbarcommand-splitbutton.win-navbarcommand-splitbutton-opened:hover, |
| .win-navbarcommand-button.win-pressed, |
| html.win-hoverable .win-navbarcommand-button.win-pressed:hover, |
| .win-navbarcommand-splitbutton.win-pressed, |
| html.win-hoverable .win-navbarcommand-splitbutton.win-pressed:hover { |
| background-color: ButtonText; |
| color: ButtonFace; |
| } |
| } |
| .win-viewbox { |
| width: 100%; |
| height: 100%; |
| position: relative; |
| } |
| .win-contentdialog { |
| /* Dialog's positioning and sizing rules: |
| - Horizontal alignment |
| - Always horizontally centered |
| - Vertical alignment |
| - If height of window < @dialogVerticallyCenteredThreshold, dialog is attached to top of window |
| - Otherwise, dialog is vertically centered |
| - Width: |
| - Always stays between @minWidth and @maxWidth |
| - Sizes to width of window |
| - Height: |
| - Always stays between @minHeight and @maxHeight |
| - If window height < @maxHeight and dialog height > 50% of window |
| height, dialog height = window height |
| - Otherwise, dialog height sizes to its content |
| */ |
| /* Purpose of this element is to control the dialog body's height based on the height |
| of the window. The dialog body's height should: |
| - Match height of window when dialog body's intrinsic height < 50% of window height. |
| In this case, .win-contentdialog-column0or1 will be in column 1 allowing |
| the dialog's body to fill the height of the window. |
| - Size to content otherwise. |
| In this case, .win-contentdialog-column0or1 will be in column 0 preventing |
| the dialog's body from growing. |
| This element works by moving between flexbox columns as the window's height changes. |
| */ |
| } |
| .win-contentdialog.win-contentdialog-verticalalignment { |
| position: fixed; |
| top: 0; |
| left: 0; |
| right: 0; |
| height: 100vh; |
| overflow: hidden; |
| display: none; |
| -ms-flex-direction: column; |
| -webkit-flex-direction: column; |
| flex-direction: column; |
| -ms-flex-wrap: wrap; |
| -webkit-flex-wrap: wrap; |
| flex-wrap: wrap; |
| -ms-flex-pack: center; |
| -webkit-justify-content: center; |
| justify-content: center; |
| /* center on flex axis (vertically) */ |
| -ms-flex-line-pack: center; |
| -webkit-align-content: center; |
| align-content: center; |
| /* maintain horizontal centering when the flexbox has 2 columns */ |
| } |
| .win-contentdialog.win-contentdialog-verticalalignment.win-contentdialog-devicefixedsupported { |
| position: -ms-device-fixed; |
| height: auto; |
| bottom: 0; |
| } |
| .win-contentdialog.win-contentdialog-verticalalignment.win-contentdialog-visible { |
| display: -ms-flexbox; |
| display: -webkit-flex; |
| display: flex; |
| } |
| .win-contentdialog .win-contentdialog-backgroundoverlay { |
| position: absolute; |
| top: 0; |
| left: 0; |
| width: 100%; |
| height: 100%; |
| } |
| .win-contentdialog .win-contentdialog-dialog { |
| display: -ms-flexbox; |
| display: -webkit-flex; |
| display: flex; |
| -ms-flex-direction: column; |
| -webkit-flex-direction: column; |
| flex-direction: column; |
| -ms-flex: 1 1 auto; |
| -webkit-flex: 1 1 auto; |
| flex: 1 1 auto; |
| z-index: 1; |
| /* Put the dialog's body above the backgroundoverlay */ |
| outline-style: solid; |
| outline-width: 1px; |
| box-sizing: border-box; |
| padding: 18px 24px 24px 24px; |
| width: 100%; |
| min-width: 320px; |
| max-width: 456px; |
| min-height: 184px; |
| max-height: 758px; |
| /* Center horizontally */ |
| margin-left: auto; |
| margin-right: auto; |
| } |
| .win-contentdialog .win-contentdialog-column0or1 { |
| -ms-flex: 10000 0 50%; |
| -webkit-flex: 10000 0 50%; |
| flex: 10000 0 50%; |
| width: 0; |
| } |
| @media (min-height: 640px) { |
| .win-contentdialog .win-contentdialog-dialog { |
| -ms-flex: 0 1 auto; |
| -webkit-flex: 0 1 auto; |
| flex: 0 1 auto; |
| } |
| .win-contentdialog .win-contentdialog-column0or1 { |
| display: none; |
| } |
| } |
| .win-contentdialog .win-contentdialog-scroller { |
| -ms-flex: 1 1 auto; |
| -webkit-flex: 1 1 auto; |
| flex: 1 1 auto; |
| display: -ms-flexbox; |
| display: -webkit-flex; |
| display: flex; |
| -ms-flex-direction: column; |
| -webkit-flex-direction: column; |
| flex-direction: column; |
| overflow: auto; |
| } |
| .win-contentdialog .win-contentdialog-title { |
| -ms-flex: 0 0 auto; |
| -webkit-flex: 0 0 auto; |
| flex: 0 0 auto; |
| font-size: 20px; |
| font-weight: 400; |
| line-height: 1.2; |
| margin: 0; |
| } |
| .win-contentdialog .win-contentdialog-content { |
| -ms-flex: 1 0 auto; |
| -webkit-flex: 1 0 auto; |
| flex: 1 0 auto; |
| font-size: 15px; |
| font-weight: 400; |
| line-height: 1.333; |
| } |
| .win-contentdialog .win-contentdialog-commands { |
| -ms-flex: 0 0 auto; |
| -webkit-flex: 0 0 auto; |
| flex: 0 0 auto; |
| display: -ms-flexbox; |
| display: -webkit-flex; |
| display: flex; |
| margin-top: 24px; |
| margin-right: -4px; |
| /* Chop off margin on last command */ |
| } |
| .win-contentdialog .win-contentdialog-commandspacer { |
| visibility: hidden; |
| } |
| .win-contentdialog .win-contentdialog-commands > button { |
| /* Each command should have the same width. Flexbox distributes widths using each |
| item's width and flex-grow as weights. Giving each command a flex-grow of 1 |
| and a width of 0 causes each item to have equal weights and thus equal widths. |
| */ |
| -ms-flex: 1 1 auto; |
| -webkit-flex: 1 1 auto; |
| flex: 1 1 auto; |
| width: 0; |
| margin-right: 4px; |
| /* 4px of space between each command */ |
| white-space: nowrap; |
| } |
| .win-splitview { |
| position: relative; |
| width: 100%; |
| height: 100%; |
| display: -ms-flexbox; |
| display: -webkit-flex; |
| display: flex; |
| overflow: hidden; |
| } |
| .win-splitview.win-splitview-placementtop, |
| .win-splitview.win-splitview-placementbottom { |
| -ms-flex-direction: column; |
| -webkit-flex-direction: column; |
| flex-direction: column; |
| } |
| .win-splitview.win-splitview-placementtop .win-splitview-panewrapper, |
| .win-splitview.win-splitview-placementbottom .win-splitview-panewrapper { |
| -ms-flex-direction: column; |
| -webkit-flex-direction: column; |
| flex-direction: column; |
| } |
| .win-splitview .win-splitview-panewrapper { |
| position: relative; |
| z-index: 1; |
| outline: none; |
| -ms-flex: 0 0 auto; |
| -webkit-flex: 0 0 auto; |
| flex: 0 0 auto; |
| overflow: hidden; |
| display: -ms-flexbox; |
| display: -webkit-flex; |
| display: flex; |
| } |
| .win-splitview .win-splitview-paneoutline { |
| display: none; |
| pointer-events: none; |
| position: absolute; |
| top: 0; |
| left: 0; |
| border: 1px solid transparent; |
| width: calc(100% - 2px); |
| height: calc(100% - 2px); |
| z-index: 1; |
| } |
| .win-splitview .win-splitview-pane { |
| outline: none; |
| } |
| .win-splitview .win-splitview-pane, |
| .win-splitview .win-splitview-paneplaceholder { |
| -ms-flex: 0 0 auto; |
| -webkit-flex: 0 0 auto; |
| flex: 0 0 auto; |
| overflow: hidden; |
| } |
| .win-splitview .win-splitview-contentwrapper { |
| position: relative; |
| z-index: 0; |
| -ms-flex: 1 1 0%; |
| -webkit-flex: 1 1 0%; |
| flex: 1 1 0%; |
| overflow: hidden; |
| } |
| .win-splitview .win-splitview-content { |
| position: absolute; |
| width: 100%; |
| height: 100%; |
| } |
| .win-splitview.win-splitview-pane-opened.win-splitview-placementleft .win-splitview-pane, |
| .win-splitview.win-splitview-pane-opened.win-splitview-placementright .win-splitview-pane { |
| width: 320px; |
| } |
| .win-splitview.win-splitview-pane-opened.win-splitview-placementtop .win-splitview-pane, |
| .win-splitview.win-splitview-pane-opened.win-splitview-placementbottom .win-splitview-pane { |
| height: 60px; |
| } |
| .win-splitview.win-splitview-pane-opened.win-splitview-openeddisplayoverlay.win-splitview-placementtop .win-splitview-panewrapper { |
| position: absolute; |
| top: 0; |
| left: 0; |
| width: 100%; |
| } |
| .win-splitview.win-splitview-pane-opened.win-splitview-openeddisplayoverlay.win-splitview-placementbottom .win-splitview-panewrapper { |
| position: absolute; |
| bottom: 0; |
| left: 0; |
| width: 100%; |
| } |
| .win-splitview.win-splitview-pane-opened.win-splitview-openeddisplayoverlay.win-splitview-placementleft .win-splitview-panewrapper { |
| position: absolute; |
| top: 0; |
| left: 0; |
| right: auto; |
| height: 100%; |
| } |
| .win-splitview.win-splitview-pane-opened.win-splitview-openeddisplayoverlay.win-splitview-placementleft:lang(ar) .win-splitview-panewrapper, |
| .win-splitview.win-splitview-pane-opened.win-splitview-openeddisplayoverlay.win-splitview-placementleft:lang(dv) .win-splitview-panewrapper, |
| .win-splitview.win-splitview-pane-opened.win-splitview-openeddisplayoverlay.win-splitview-placementleft:lang(fa) .win-splitview-panewrapper, |
| .win-splitview.win-splitview-pane-opened.win-splitview-openeddisplayoverlay.win-splitview-placementleft:lang(he) .win-splitview-panewrapper, |
| .win-splitview.win-splitview-pane-opened.win-splitview-openeddisplayoverlay.win-splitview-placementleft:lang(ku-Arab) .win-splitview-panewrapper, |
| .win-splitview.win-splitview-pane-opened.win-splitview-openeddisplayoverlay.win-splitview-placementleft:lang(pa-Arab) .win-splitview-panewrapper, |
| .win-splitview.win-splitview-pane-opened.win-splitview-openeddisplayoverlay.win-splitview-placementleft:lang(prs) .win-splitview-panewrapper, |
| .win-splitview.win-splitview-pane-opened.win-splitview-openeddisplayoverlay.win-splitview-placementleft:lang(ps) .win-splitview-panewrapper, |
| .win-splitview.win-splitview-pane-opened.win-splitview-openeddisplayoverlay.win-splitview-placementleft:lang(sd-Arab) .win-splitview-panewrapper, |
| .win-splitview.win-splitview-pane-opened.win-splitview-openeddisplayoverlay.win-splitview-placementleft:lang(syr) .win-splitview-panewrapper, |
| .win-splitview.win-splitview-pane-opened.win-splitview-openeddisplayoverlay.win-splitview-placementleft:lang(ug) .win-splitview-panewrapper, |
| .win-splitview.win-splitview-pane-opened.win-splitview-openeddisplayoverlay.win-splitview-placementleft:lang(ur) .win-splitview-panewrapper, |
| .win-splitview.win-splitview-pane-opened.win-splitview-openeddisplayoverlay.win-splitview-placementleft:lang(qps-plocm) .win-splitview-panewrapper { |
| position: absolute; |
| top: 0; |
| left: auto; |
| right: 0; |
| height: 100%; |
| } |
| .win-splitview.win-splitview-pane-opened.win-splitview-openeddisplayoverlay.win-splitview-placementright .win-splitview-panewrapper { |
| position: absolute; |
| top: 0; |
| left: auto; |
| right: 0; |
| height: 100%; |
| } |
| .win-splitview.win-splitview-pane-opened.win-splitview-openeddisplayoverlay.win-splitview-placementright:lang(ar) .win-splitview-panewrapper, |
| .win-splitview.win-splitview-pane-opened.win-splitview-openeddisplayoverlay.win-splitview-placementright:lang(dv) .win-splitview-panewrapper, |
| .win-splitview.win-splitview-pane-opened.win-splitview-openeddisplayoverlay.win-splitview-placementright:lang(fa) .win-splitview-panewrapper, |
| .win-splitview.win-splitview-pane-opened.win-splitview-openeddisplayoverlay.win-splitview-placementright:lang(he) .win-splitview-panewrapper, |
| .win-splitview.win-splitview-pane-opened.win-splitview-openeddisplayoverlay.win-splitview-placementright:lang(ku-Arab) .win-splitview-panewrapper, |
| .win-splitview.win-splitview-pane-opened.win-splitview-openeddisplayoverlay.win-splitview-placementright:lang(pa-Arab) .win-splitview-panewrapper, |
| .win-splitview.win-splitview-pane-opened.win-splitview-openeddisplayoverlay.win-splitview-placementright:lang(prs) .win-splitview-panewrapper, |
| .win-splitview.win-splitview-pane-opened.win-splitview-openeddisplayoverlay.win-splitview-placementright:lang(ps) .win-splitview-panewrapper, |
| .win-splitview.win-splitview-pane-opened.win-splitview-openeddisplayoverlay.win-splitview-placementright:lang(sd-Arab) .win-splitview-panewrapper, |
| .win-splitview.win-splitview-pane-opened.win-splitview-openeddisplayoverlay.win-splitview-placementright:lang(syr) .win-splitview-panewrapper, |
| .win-splitview.win-splitview-pane-opened.win-splitview-openeddisplayoverlay.win-splitview-placementright:lang(ug) .win-splitview-panewrapper, |
| .win-splitview.win-splitview-pane-opened.win-splitview-openeddisplayoverlay.win-splitview-placementright:lang(ur) .win-splitview-panewrapper, |
| .win-splitview.win-splitview-pane-opened.win-splitview-openeddisplayoverlay.win-splitview-placementright:lang(qps-plocm) .win-splitview-panewrapper { |
| position: absolute; |
| top: 0; |
| left: 0; |
| right: auto; |
| height: 100%; |
| } |
| .win-splitview.win-splitview-pane-closed .win-splitview-paneplaceholder { |
| display: none; |
| } |
| .win-splitview.win-splitview-pane-closed.win-splitview-placementtop .win-splitview-pane, |
| .win-splitview.win-splitview-pane-closed.win-splitview-placementbottom .win-splitview-pane { |
| height: 24px; |
| } |
| .win-splitview.win-splitview-pane-closed.win-splitview-placementleft .win-splitview-pane, |
| .win-splitview.win-splitview-pane-closed.win-splitview-placementright .win-splitview-pane { |
| width: 48px; |
| } |
| .win-splitview.win-splitview-pane-closed.win-splitview-closeddisplaynone .win-splitview-pane { |
| display: none; |
| } |
| .win-splitview.win-splitview-openeddisplayinline .win-splitview-paneplaceholder { |
| display: none; |
| } |
| button.win-splitviewpanetoggle { |
| touch-action: manipulation; |
| box-sizing: border-box; |
| height: 48px; |
| width: 48px; |
| min-height: 0; |
| min-width: 0; |
| padding: 0; |
| border: none; |
| margin: 0; |
| outline: none; |
| } |
| button.win-splitviewpanetoggle:after { |
| font-size: 24px; |
| font-family: 'Segoe MDL2 Assets', 'Symbols'; |
| font-weight: 400; |
| line-height: 1.333; |
| content: "\E700"; |
| } |
| .win-appbar { |
| width: 100%; |
| min-width: 32px; |
| /* enough to fit the overflowbutton */ |
| position: fixed; |
| position: -ms-device-fixed; |
| /* AppBar should overlay content in the body when opened or closed. |
| * This z-index value is chosen to be smaller than light dismissables. |
| * z-index will be overwritten by the light dismiss service to an even |
| * higher value when the AppBar is in the opened state. |
| */ |
| z-index: 999; |
| } |
| .win-appbar.win-appbar-top { |
| top: 0; |
| } |
| .win-appbar.win-appbar-bottom { |
| bottom: 0; |
| } |
| .win-appbar.win-appbar-closed.win-appbar-closeddisplaynone { |
| display: none; |
| } |
| body { |
| background-color: #000000; |
| color: #ffffff; |
| } |
| .win-ui-dark { |
| background-color: #000000; |
| color: #ffffff; |
| } |
| .win-ui-light { |
| background-color: #ffffff; |
| color: #000000; |
| } |
| winjs-themedetection-tag { |
| opacity: 0; |
| } |
| ::selection { |
| color: #fff; |
| } |
| .win-link:hover { |
| color: rgba(255, 255, 255, 0.6); |
| } |
| .win-link:active { |
| color: rgba(255, 255, 255, 0.4); |
| } |
| .win-link[disabled] { |
| color: rgba(255, 255, 255, 0.2); |
| } |
| .win-checkbox::-ms-check { |
| color: #ffffff; |
| border-color: rgba(255, 255, 255, 0.8); |
| background-color: transparent; |
| } |
| .win-checkbox:indeterminate::-ms-check { |
| color: rgba(255, 255, 255, 0.8); |
| } |
| .win-checkbox:checked::-ms-check { |
| color: #fff; |
| border-color: transparent; |
| } |
| .win-checkbox:hover::-ms-check { |
| border-color: #ffffff; |
| } |
| .win-checkbox:hover:indeterminate::-ms-check { |
| color: #ffffff; |
| } |
| .win-checkbox:active::-ms-check { |
| border-color: transparent; |
| background-color: rgba(255, 255, 255, 0.6); |
| } |
| .win-checkbox:indeterminate:active::-ms-check { |
| color: rgba(255, 255, 255, 0.6); |
| border-color: rgba(255, 255, 255, 0.8); |
| background-color: transparent; |
| } |
| .win-checkbox:disabled::-ms-check, |
| .win-checkbox:indeterminate:disabled::-ms-check { |
| color: rgba(255, 255, 255, 0.2); |
| border-color: rgba(255, 255, 255, 0.2); |
| background-color: transparent; |
| } |
| .win-radio::-ms-check { |
| color: rgba(255, 255, 255, 0.8); |
| border-color: rgba(255, 255, 255, 0.8); |
| background-color: transparent; |
| } |
| .win-radio:hover::-ms-check { |
| border-color: #ffffff; |
| } |
| .win-radio:hover::-ms-check { |
| color: #ffffff; |
| } |
| .win-radio:active::-ms-check { |
| color: rgba(255, 255, 255, 0.6); |
| border-color: rgba(255, 255, 255, 0.6); |
| } |
| .win-radio:disabled::-ms-check { |
| color: rgba(255, 255, 255, 0.2); |
| border-color: rgba(255, 255, 255, 0.2); |
| } |
| .win-progress-bar:not(:indeterminate), |
| .win-progress-ring:not(:indeterminate), |
| .win-ring:not(:indeterminate) { |
| background-color: rgba(255, 255, 255, 0.2); |
| } |
| .win-progress-bar::-webkit-progress-bar, |
| .win-progress-ring::-webkit-progress-bar, |
| .win-ring::-webkit-progress-bar { |
| background-color: transparent; |
| } |
| .win-progress-ring, |
| .win-ring { |
| background-color: transparent; |
| } |
| .win-button { |
| color: #ffffff; |
| background-color: rgba(255, 255, 255, 0.2); |
| border-color: transparent; |
| } |
| .win-button.win-button-primary { |
| color: #fff; |
| } |
| .win-button:hover, |
| .win-button.win-button-primary:hover { |
| border-color: rgba(255, 255, 255, 0.4); |
| } |
| .win-button:active, |
| .win-button.win-button-primary:active { |
| background-color: rgba(255, 255, 255, 0.4); |
| } |
| .win-button:disabled, |
| .win-button.win-button-primary:disabled { |
| color: rgba(255, 255, 255, 0.2); |
| background-color: rgba(255, 255, 255, 0.2); |
| border-color: transparent; |
| } |
| .win-dropdown { |
| color: #ffffff; |
| background-color: rgba(255, 255, 255, 0.2); |
| border-color: rgba(255, 255, 255, 0.4); |
| } |
| .win-dropdown::-ms-expand { |
| color: rgba(255, 255, 255, 0.8); |
| background-color: transparent; |
| } |
| .win-dropdown:hover { |
| background-color: #2b2b2b; |
| border-color: rgba(255, 255, 255, 0.6); |
| } |
| .win-dropdown:disabled { |
| color: rgba(255, 255, 255, 0.2); |
| background-color: rgba(255, 255, 255, 0.2); |
| } |
| .win-dropdown:disabled::-ms-expand { |
| color: rgba(255, 255, 255, 0.2); |
| border-color: rgba(255, 255, 255, 0.2); |
| } |
| .win-dropdown option { |
| color: #ffffff; |
| background-color: #2b2b2b; |
| } |
| .win-dropdown option:checked { |
| color: #ffffff; |
| } |
| .win-dropdown option:hover, |
| .win-dropdown option:active { |
| background-color: rgba(0, 0, 0, 0.2); |
| color: #ffffff; |
| } |
| .win-dropdown optgroup { |
| color: #ffffff; |
| background-color: #2b2b2b; |
| } |
| .win-dropdown optgroup:disabled { |
| color: rgba(255, 255, 255, 0.2); |
| } |
| select[multiple].win-dropdown { |
| border: none; |
| background-color: #2b2b2b; |
| } |
| select[multiple].win-dropdown option { |
| color: #ffffff; |
| } |
| select[multiple].win-dropdown option:hover { |
| color: #ffffff; |
| } |
| select[multiple].win-dropdown option:checked { |
| color: #ffffff; |
| } |
| .win-slider { |
| background-color: transparent; |
| } |
| .win-slider:hover::-ms-thumb { |
| background: #f9f9f9; |
| } |
| .win-slider:hover::-webkit-slider-thumb { |
| background: #f9f9f9; |
| } |
| .win-slider:hover::-moz-range-thumb { |
| background: #f9f9f9; |
| } |
| .win-slider:active::-ms-thumb { |
| background: #767676; |
| } |
| .win-slider:active::-webkit-slider-thumb { |
| background: #767676; |
| } |
| .win-slider:active::-moz-range-thumb { |
| background: #767676; |
| } |
| .win-slider:disabled::-ms-thumb { |
| background: #333333; |
| } |
| .win-slider:disabled::-webkit-slider-thumb { |
| background: #333333; |
| } |
| .win-slider:disabled::-moz-range-thumb { |
| background: #333333; |
| } |
| .win-slider:disabled::-ms-fill-lower { |
| background: rgba(255, 255, 255, 0.2); |
| } |
| .win-slider::-ms-fill-upper { |
| background: rgba(255, 255, 255, 0.4); |
| } |
| .win-slider::-webkit-slider-runnable-track { |
| background: rgba(255, 255, 255, 0.4); |
| } |
| .win-slider::-moz-range-track { |
| background: rgba(255, 255, 255, 0.4); |
| } |
| .win-slider:active::-ms-fill-upper { |
| background: rgba(255, 255, 255, 0.4); |
| } |
| .win-slider:active::-webkit-slider-runnable-track { |
| background: rgba(255, 255, 255, 0.4); |
| } |
| .win-slider:active::-moz-range-track { |
| background: rgba(255, 255, 255, 0.4); |
| } |
| .win-slider:disabled::-ms-fill-upper { |
| background: rgba(255, 255, 255, 0.2); |
| } |
| .win-slider:disabled::-webkit-slider-runnable-track { |
| background: rgba(255, 255, 255, 0.2); |
| } |
| .win-slider:disabled::-moz-range-track { |
| background: rgba(255, 255, 255, 0.2); |
| } |
| .win-slider::-ms-track { |
| color: transparent; |
| background-color: transparent; |
| } |
| .win-slider::-ms-ticks-before, |
| .win-slider::-ms-ticks-after { |
| color: rgba(255, 255, 255, 0.4); |
| } |
| .win-textbox, |
| .win-textarea { |
| color: #ffffff; |
| background-color: rgba(0, 0, 0, 0.4); |
| border-color: rgba(255, 255, 255, 0.4); |
| } |
| .win-textbox:-ms-input-placeholder, |
| .win-textarea:-ms-input-placeholder { |
| color: rgba(255, 255, 255, 0.6); |
| } |
| .win-textbox::-webkit-input-placeholder, |
| .win-textarea::-webkit-input-placeholder { |
| color: rgba(255, 255, 255, 0.6); |
| } |
| .win-textbox::-moz-input-placeholder, |
| .win-textarea::-moz-input-placeholder { |
| color: rgba(255, 255, 255, 0.6); |
| } |
| .win-textbox:hover, |
| .win-textarea:hover { |
| background-color: rgba(0, 0, 0, 0.6); |
| border-color: rgba(255, 255, 255, 0.6); |
| } |
| .win-textbox:focus, |
| .win-textarea:focus { |
| color: #000000; |
| background-color: #ffffff; |
| } |
| .win-textbox::-ms-clear, |
| .win-textbox::-ms-reveal { |
| display: block; |
| color: rgba(0, 0, 0, 0.6); |
| } |
| .win-textbox::-ms-clear:active, |
| .win-textbox::-ms-reveal:active { |
| color: #ffffff; |
| } |
| .win-xbox :focus { |
| outline: 2px solid white; |
| } |
| .win-selectionmode .win-itemcontainer.win-container .win-itembox::after, |
| .win-itemcontainer.win-selectionmode.win-container .win-itembox::after, |
| .win-listview .win-surface.win-selectionmode .win-itembox::after { |
| border-color: #ffffff; |
| background-color: #393939; |
| } |
| .win-selectioncheckmark { |
| color: #ffffff; |
| } |
| html.win-hoverable .win-listview.win-selectionstylefilled .win-container.win-pressed .win-itembox, |
| html.win-hoverable .win-listview.win-selectionstylefilled .win-container .win-itembox.win-pressed, |
| html.win-hoverable .win-itemcontainer.win-selectionstylefilled.win-container.win-pressed .win-itembox, |
| .win-listview.win-selectionstylefilled .win-container.win-pressed .win-itembox, |
| .win-listview.win-selectionstylefilled .win-container .win-itembox.win-pressed, |
| .win-itemcontainer.win-selectionstylefilled.win-container.win-pressed .win-itembox { |
| background-color: rgba(255, 255, 255, 0.2); |
| } |
| .win-listview .win-itembox, |
| .win-itemcontainer .win-itembox { |
| background-color: #1d1d1d; |
| } |
| .win-listview .win-container.win-backdrop { |
| background-color: rgba(155, 155, 155, 0.23); |
| } |
| .win-listview .win-groupheader { |
| outline-color: #ffffff; |
| } |
| .win-listview .win-focusedoutline, |
| .win-itemcontainer .win-focusedoutline { |
| outline: #ffffff dashed 2px; |
| } |
| .win-listview.win-selectionstylefilled .win-selected .win-selectionbackground, |
| .win-itemcontainer.win-selectionstylefilled.win-selected .win-selectionbackground { |
| opacity: 0.6; |
| } |
| .win-listview.win-selectionstylefilled .win-selected, |
| .win-itemcontainer.win-selectionstylefilled.win-selected { |
| color: #ffffff; |
| } |
| .win-flipview .win-navbutton { |
| background-color: rgba(255, 255, 255, 0.4); |
| color: rgba(0, 0, 0, 0.8); |
| } |
| .win-flipview .win-navbutton:hover:active { |
| background-color: rgba(255, 255, 255, 0.8); |
| } |
| html.win-hoverable .win-flipview .win-navbutton:hover { |
| background-color: rgba(255, 255, 255, 0.6); |
| } |
| .win-backbutton, |
| .win-back, |
| .win-navigation-backbutton { |
| background-color: transparent; |
| border: none; |
| color: #ffffff; |
| } |
| .win-backbutton:hover, |
| .win-navigation-backbutton:hover .win-back { |
| background-color: rgba(255, 255, 255, 0.1); |
| } |
| .win-backbutton:active, |
| .win-navigation-backbutton:active .win-back { |
| background-color: rgba(255, 255, 255, 0.2); |
| } |
| .win-backbutton:disabled, |
| .win-backbutton:disabled:active, |
| .win-navigation-backbutton:disabled, |
| .win-navigation-backbutton:disabled .win-back, |
| .win-navigation-backbutton:disabled:active .win-back { |
| color: rgba(255, 255, 255, 0.4); |
| background-color: transparent; |
| } |
| .win-backbutton:focus, |
| .win-navigation-backbutton:focus .win-back { |
| outline-color: #ffffff; |
| } |
| .win-tooltip { |
| color: #ffffff; |
| border-color: #767676; |
| background-color: #2b2b2b; |
| } |
| .win-rating .win-star.win-tentative.win-full { |
| color: rgba(255, 255, 255, 0.8); |
| } |
| .win-rating .win-star.win-average.win-full, |
| .win-rating .win-star.win-average.win-full.win-disabled { |
| color: rgba(255, 255, 255, 0.4); |
| } |
| .win-rating .win-star.win-empty { |
| color: rgba(255, 255, 255, 0.2); |
| } |
| .win-toggleswitch-header, |
| .win-toggleswitch-value { |
| color: #ffffff; |
| } |
| .win-toggleswitch-thumb { |
| background-color: rgba(255, 255, 255, 0.8); |
| } |
| .win-toggleswitch-off .win-toggleswitch-track { |
| border-color: rgba(255, 255, 255, 0.8); |
| } |
| .win-toggleswitch-pressed .win-toggleswitch-thumb { |
| background-color: #ffffff; |
| } |
| .win-toggleswitch-pressed .win-toggleswitch-track { |
| border-color: transparent; |
| background-color: rgba(255, 255, 255, 0.6); |
| } |
| .win-toggleswitch-disabled .win-toggleswitch-header, |
| .win-toggleswitch-disabled .win-toggleswitch-value { |
| color: rgba(255, 255, 255, 0.2); |
| } |
| .win-toggleswitch-disabled .win-toggleswitch-thumb { |
| background-color: rgba(255, 255, 255, 0.2); |
| } |
| .win-toggleswitch-disabled .win-toggleswitch-track { |
| border-color: rgba(255, 255, 255, 0.2); |
| } |
| .win-toggleswitch-on .win-toggleswitch-thumb { |
| background-color: #ffffff; |
| } |
| .win-toggleswitch-on .win-toggleswitch-track { |
| border-color: transparent; |
| } |
| .win-toggleswitch-on.win-toggleswitch-pressed .win-toggleswitch-track { |
| background-color: rgba(255, 255, 255, 0.6); |
| } |
| .win-toggleswitch-on.win-toggleswitch-disabled .win-toggleswitch-thumb { |
| background-color: rgba(255, 255, 255, 0.2); |
| } |
| .win-toggleswitch-on.win-toggleswitch-disabled .win-toggleswitch-track { |
| background-color: rgba(255, 255, 255, 0.2); |
| } |
| .win-semanticzoom-button { |
| background-color: rgba(216, 216, 216, 0.33); |
| border-color: transparent; |
| } |
| button.win-semanticzoom-button.win-semanticzoom-button:active, |
| button.win-semanticzoom-button.win-semanticzoom-button:hover:active { |
| background-color: #ffffff; |
| } |
| .win-pivot .win-pivot-title { |
| color: #ffffff; |
| } |
| .win-pivot .win-pivot-navbutton { |
| background-color: rgba(255, 255, 255, 0.4); |
| color: rgba(0, 0, 0, 0.8); |
| } |
| .win-pivot .win-pivot-navbutton.win-pivot-navbutton:hover:active { |
| color: rgba(255, 255, 255, 0.8); |
| } |
| .win-pivot button.win-pivot-header { |
| color: rgba(255, 255, 255, 0.6); |
| background-color: transparent; |
| } |
| .win-pivot button.win-pivot-header:focus, |
| .win-pivot button.win-pivot-header.win-pivot-header:hover:active { |
| color: rgba(255, 255, 255, 0.8); |
| } |
| .win-pivot button.win-pivot-header.win-pivot-header-selected { |
| color: #ffffff; |
| background-color: transparent; |
| } |
| .win-pivot-header[disabled] { |
| color: rgba(255, 255, 255, 0.4); |
| } |
| button.win-hub-section-header-tabstop, |
| button.win-hub-section-header-tabstop:hover:active { |
| color: #ffffff; |
| } |
| button.win-hub-section-header-tabstop.win-keyboard:focus { |
| outline: 1px dotted #ffffff; |
| } |
| button.win-hub-section-header-tabstop:-ms-keyboard-active { |
| color: #ffffff; |
| } |
| button.win-hub-section-header-tabstop.win-hub-section-header-interactive.win-hub-section-header-interactive:hover:active { |
| color: rgba(255, 255, 255, 0.4); |
| } |
| button.win-hub-section-header-tabstop.win-hub-section-header-interactive:-ms-keyboard-active { |
| color: rgba(255, 255, 255, 0.4); |
| } |
| .win-overlay { |
| outline: none; |
| } |
| hr.win-command { |
| background-color: rgba(255, 255, 255, 0.4); |
| } |
| div.win-command, |
| button.win-command { |
| border-color: transparent; |
| background-color: transparent; |
| } |
| div.win-command:hover:active, |
| button.win-command:hover:active { |
| border-color: transparent; |
| } |
| button:enabled.win-command.win-keyboard:focus, |
| div.win-command.win-keyboard:focus, |
| button:enabled.win-command.win-command.win-keyboard:hover:focus, |
| div.win-command.win-command.win-keyboard:hover:focus { |
| border-color: #ffffff; |
| } |
| .win-commandimage { |
| color: #ffffff; |
| } |
| button.win-command.win-command:enabled:hover:active, |
| button.win-command.win-command:enabled:active { |
| background-color: rgba(255, 255, 255, 0.2); |
| color: #ffffff; |
| } |
| button:enabled:hover:active .win-commandimage, |
| button:enabled:active .win-commandimage { |
| color: #ffffff; |
| } |
| button:disabled .win-commandimage, |
| button:disabled:active .win-commandimage { |
| color: rgba(255, 255, 255, 0.2); |
| } |
| button .win-label { |
| color: #ffffff; |
| } |
| button[aria-checked=true]:enabled .win-label, |
| button[aria-checked=true]:enabled .win-commandimage, |
| button[aria-checked=true]:enabled:hover:active .win-commandimage.win-commandimage { |
| color: #ffffff; |
| } |
| button[aria-checked=true]:-ms-keyboard-active .win-commandimage { |
| color: #ffffff; |
| } |
| button[aria-checked=true].win-command:before { |
| position: absolute; |
| height: 100%; |
| width: 100%; |
| opacity: 0.6; |
| box-sizing: content-box; |
| content: ""; |
| /* We want this pseudo element to cover the border of its parent. */ |
| /* Put a 1px border on this element to make it larger and then set its top/left to -1px.*/ |
| border-width: 1px; |
| border-style: solid; |
| top: -1px; |
| left: -1px; |
| } |
| button.win-command:enabled:-ms-keyboard-active { |
| background-color: rgba(255, 255, 255, 0.2); |
| color: #ffffff; |
| } |
| button[aria-checked=true].win-command:enabled:hover:active { |
| background-color: transparent; |
| } |
| button.win-command:disabled, |
| button.win-command:disabled:hover:active { |
| background-color: transparent; |
| border-color: transparent; |
| } |
| button.win-command:disabled .win-label, |
| button.win-command:disabled:active .win-label { |
| color: rgba(255, 255, 255, 0.2); |
| } |
| .win-navbar, |
| .win-navbar { |
| background-color: #393939; |
| border-color: #393939; |
| } |
| .win-navbar.win-menulayout .win-navbar-menu, |
| .win-navbar.win-menulayout .win-navbar-menu, |
| .win-navbar.win-menulayout .win-toolbar, |
| .win-navbar.win-menulayout .win-toolbar { |
| background-color: inherit; |
| } |
| .win-navbar button.win-navbar-invokebutton.win-navbar-invokebutton, |
| .win-navbar button.win-navbar-invokebutton.win-navbar-invokebutton { |
| background-color: transparent; |
| outline: none; |
| border-color: transparent; |
| } |
| .win-navbar button.win-navbar-invokebutton.win-navbar-invokebutton:enabled:-ms-keyboard-active, |
| .win-navbar button.win-navbar-invokebutton.win-navbar-invokebutton:enabled:-ms-keyboard-active { |
| background-color: transparent; |
| } |
| .win-navbar button.win-navbar-invokebutton.win-navbar-invokebutton:enabled .win-navbar-ellipsis, |
| .win-navbar button.win-navbar-invokebutton.win-navbar-invokebutton:enabled .win-navbar-ellipsis { |
| color: #ffffff; |
| } |
| .win-navbar button.win-navbar-invokebutton.win-navbar-invokebutton:enabled.win-keyboard:focus, |
| .win-navbar button.win-navbar-invokebutton.win-navbar-invokebutton:enabled.win-keyboard:focus { |
| border-color: #ffffff; |
| } |
| .win-navbar button.win-navbar-invokebutton.win-navbar-invokebutton:disabled:active, |
| .win-navbar button.win-navbar-invokebutton.win-navbar-invokebutton:disabled:active, |
| .win-navbar button.win-navbar-invokebutton.win-navbar-invokebutton:disabled:hover:active, |
| .win-navbar button.win-navbar-invokebutton.win-navbar-invokebutton:disabled:hover:active { |
| background-color: transparent; |
| } |
| .win-navbar button.win-navbar-invokebutton.win-navbar-invokebutton:disabled .win-navbar-ellipsis, |
| .win-navbar button.win-navbar-invokebutton.win-navbar-invokebutton:disabled .win-navbar-ellipsis { |
| color: rgba(255, 255, 255, 0.2); |
| } |
| .win-navbar.win-navbar-closing button.win-navbar-invokebutton.win-navbar-invokebutton:enabled:hover:active, |
| .win-navbar.win-navbar-closing button.win-navbar-invokebutton.win-navbar-invokebutton:enabled:hover:active, |
| .win-navbar.win-navbar-closed button.win-navbar-invokebutton.win-navbar-invokebutton:enabled:hover:active, |
| .win-navbar.win-navbar-closed button.win-navbar-invokebutton.win-navbar-invokebutton:enabled:hover:active, |
| .win-navbar.win-navbar-opening button.win-navbar-invokebutton.win-navbar-invokebutton:enabled:hover:active, |
| .win-navbar.win-navbar-opening button.win-navbar-invokebutton.win-navbar-invokebutton:enabled:hover:active, |
| .win-navbar.win-navbar-opened button.win-navbar-invokebutton.win-navbar-invokebutton:enabled:hover:active, |
| .win-navbar.win-navbar-opened button.win-navbar-invokebutton.win-navbar-invokebutton:enabled:hover:active { |
| background-color: rgba(255, 255, 255, 0.2); |
| } |
| .win-navbar.win-navbar-closing button.win-navbar-invokebutton.win-navbar-invokebutton:enabled:hover:active .win-navbar-ellipsis, |
| .win-navbar.win-navbar-closing button.win-navbar-invokebutton.win-navbar-invokebutton:enabled:hover:active .win-navbar-ellipsis, |
| .win-navbar.win-navbar-closed button.win-navbar-invokebutton.win-navbar-invokebutton:enabled:hover:active .win-navbar-ellipsis, |
| .win-navbar.win-navbar-closed button.win-navbar-invokebutton.win-navbar-invokebutton:enabled:hover:active .win-navbar-ellipsis, |
| .win-navbar.win-navbar-opening button.win-navbar-invokebutton.win-navbar-invokebutton:enabled:hover:active .win-navbar-ellipsis, |
| .win-navbar.win-navbar-opening button.win-navbar-invokebutton.win-navbar-invokebutton:enabled:hover:active .win-navbar-ellipsis, |
| .win-navbar.win-navbar-opened button.win-navbar-invokebutton.win-navbar-invokebutton:enabled:hover:active .win-navbar-ellipsis, |
| .win-navbar.win-navbar-opened button.win-navbar-invokebutton.win-navbar-invokebutton:enabled:hover:active .win-navbar-ellipsis { |
| color: #ffffff; |
| } |
| .win-flyout, |
| .win-flyout { |
| background-color: #000000; |
| } |
| .win-settingsflyout { |
| background-color: #000000; |
| } |
| .win-menu button, |
| .win-menu button { |
| background-color: transparent; |
| color: #ffffff; |
| } |
| .win-menu button.win-command.win-command:enabled:hover:active, |
| .win-menu button[aria-checked=true].win-command.win-command:enabled:hover:active { |
| background-color: rgba(255, 255, 255, 0.2); |
| color: #ffffff; |
| } |
| .win-menu-containsflyoutcommand button.win-command-flyout-activated:before, |
| .win-menu-containsflyoutcommand button.win-command-flyout-activated:before { |
| position: absolute; |
| height: 100%; |
| width: 100%; |
| opacity: 0.6; |
| content: ""; |
| box-sizing: content-box; |
| /* We want this pseudo element to cover the border of its parent. */ |
| /* Put a 1px border on this element to make it larger and then set its top/left to -1px.*/ |
| border-width: 1px; |
| border-style: solid; |
| top: -1px; |
| left: -1px; |
| } |
| .win-menu button[aria-checked=true].win-command:before, |
| .win-menu button[aria-checked=true].win-command:before { |
| background-color: transparent; |
| border-color: transparent; |
| } |
| .win-menu button:disabled, |
| .win-menu button:disabled, |
| .win-menu button:disabled:active, |
| .win-menu button:disabled:active { |
| background-color: transparent; |
| color: rgba(255, 255, 255, 0.2); |
| } |
| .win-commandingsurface .win-commandingsurface-actionarea, |
| .win-commandingsurface .win-commandingsurface-actionarea { |
| background-color: #393939; |
| } |
| .win-commandingsurface button.win-commandingsurface-overflowbutton, |
| .win-commandingsurface button.win-commandingsurface-overflowbutton { |
| background-color: transparent; |
| border-color: transparent; |
| } |
| .win-commandingsurface button.win-commandingsurface-overflowbutton:enabled:-ms-keyboard-active, |
| .win-commandingsurface button.win-commandingsurface-overflowbutton:enabled:-ms-keyboard-active { |
| background-color: transparent; |
| } |
| .win-commandingsurface button.win-commandingsurface-overflowbutton:enabled .win-commandingsurface-ellipsis, |
| .win-commandingsurface button.win-commandingsurface-overflowbutton:enabled .win-commandingsurface-ellipsis { |
| color: #ffffff; |
| } |
| .win-commandingsurface button.win-commandingsurface-overflowbutton.win-keyboard:focus, |
| .win-commandingsurface button.win-commandingsurface-overflowbutton.win-keyboard:focus { |
| border-color: #ffffff; |
| } |
| .win-commandingsurface .win-commandingsurface-overflowarea, |
| .win-commandingsurface .win-commandingsurface-overflowarea { |
| background-color: #2b2b2b; |
| } |
| .win-commandingsurface button.win-commandingsurface-overflowbutton.win-commandingsurface-overflowbutton:hover:active, |
| .win-commandingsurface button.win-commandingsurface-overflowbutton.win-commandingsurface-overflowbutton:hover:active { |
| background-color: rgba(255, 255, 255, 0.2); |
| } |
| .win-commandingsurface .win-commandingsurface-overflowarea button:enabled.win-command:hover:active, |
| .win-commandingsurface .win-commandingsurface-overflowarea button:enabled.win-command:hover:active { |
| color: #ffffff; |
| background-color: rgba(255, 255, 255, 0.2); |
| } |
| .win-autosuggestbox-flyout-highlighttext { |
| color: #4617b4; |
| } |
| .win-autosuggestbox-suggestion-separator { |
| color: #7a7a7a; |
| } |
| .win-autosuggestbox-suggestion-separator hr { |
| border-color: #7a7a7a; |
| } |
| .win-autosuggestbox-suggestion-selected .win-autosuggestbox-flyout-highlighttext { |
| color: #a38bda; |
| } |
| .win-autosuggestbox-flyout { |
| background-color: #2b2b2b; |
| color: #ffffff; |
| } |
| .win-autosuggestbox-suggestion-result:hover:active, |
| .win-autosuggestbox-suggestion-query:hover:active { |
| background-color: rgba(255, 255, 255, 0.2); |
| } |
| .win-searchbox-button { |
| color: rgba(255, 255, 255, 0.4); |
| } |
| .win-searchbox-button-input-focus { |
| color: rgba(0, 0, 0, 0.4); |
| } |
| .win-searchbox-button.win-searchbox-button:not(.win-searchbox-button-disabled):hover:active { |
| color: #ffffff; |
| } |
| .win-splitviewcommand-button { |
| background-color: transparent; |
| color: #ffffff; |
| } |
| .win-splitviewcommand-button.win-pressed { |
| background-color: rgba(255, 255, 255, 0.2); |
| } |
| .win-splitviewcommand-button.win-keyboard:focus::before { |
| content: ""; |
| pointer-events: none; |
| position: absolute; |
| box-sizing: border-box; |
| top: 0; |
| left: 0; |
| height: 100%; |
| width: 100%; |
| border: 1px dotted #ffffff; |
| } |
| .win-navbarcontainer-pageindicator { |
| background-color: rgba(255, 255, 255, 0.2); |
| } |
| .win-navbarcontainer-pageindicator-current { |
| background-color: rgba(255, 255, 255, 0.6); |
| } |
| .win-navbarcontainer-navarrow { |
| background-color: rgba(255, 255, 255, 0.4); |
| color: rgba(0, 0, 0, 0.8); |
| } |
| .win-navbarcontainer-navarrow.win-navbarcontainer-navarrow:hover:active { |
| background-color: rgba(255, 255, 255, 0.8); |
| } |
| .win-navbarcommand-button, |
| .win-navbarcommand-splitbutton { |
| background-color: rgba(255, 255, 255, 0.1); |
| color: #ffffff; |
| } |
| .win-navbarcommand-button.win-pressed, |
| .win-navbarcommand-splitbutton.win-pressed { |
| background-color: rgba(255, 255, 255, 0.28); |
| } |
| .win-navbarcommand-button.win-keyboard:focus::before { |
| content: ""; |
| pointer-events: none; |
| position: absolute; |
| box-sizing: border-box; |
| top: 0; |
| left: 0; |
| height: 100%; |
| width: 100%; |
| border: 1px dotted #ffffff; |
| } |
| .win-navbarcommand-splitbutton.win-keyboard:focus::before { |
| border-color: #ffffff; |
| } |
| .win-contentdialog-dialog { |
| background-color: #2b2b2b; |
| } |
| .win-contentdialog-title { |
| color: #ffffff; |
| } |
| .win-contentdialog-content { |
| color: #ffffff; |
| } |
| .win-contentdialog-backgroundoverlay { |
| background-color: #000000; |
| opacity: 0.6; |
| } |
| .win-splitview-pane { |
| background-color: #171717; |
| } |
| button.win-splitviewpanetoggle { |
| color: #ffffff; |
| background-color: transparent; |
| } |
| button.win-splitviewpanetoggle:active, |
| button.win-splitviewpanetoggle.win-splitviewpanetoggle:active:hover { |
| color: #ffffff; |
| background-color: rgba(255, 255, 255, 0.2); |
| } |
| button.win-splitviewpanetoggle.win-keyboard:focus { |
| border: 1px dotted #ffffff; |
| } |
| button.win-splitviewpanetoggle:disabled, |
| button.win-splitviewpanetoggle:disabled:active, |
| button.win-splitviewpanetoggle.win-splitviewpanetoggle:disabled:hover { |
| color: rgba(255, 255, 255, 0.2); |
| background-color: transparent; |
| } |
| html.win-hoverable { |
| /* LegacyAppBar control colors */ |
| } |
| html.win-hoverable .win-selectionstylefilled .win-container:hover .win-itembox, |
| html.win-hoverable .win-selectionstylefilled.win-container:hover .win-itembox { |
| background-color: rgba(255, 255, 255, 0.1); |
| } |
| html.win-hoverable .win-listview .win-itembox:hover::before, |
| html.win-hoverable .win-itemcontainer .win-itembox:hover::before { |
| border-color: #ffffff; |
| } |
| html.win-hoverable .win-listview .win-container.win-selected:hover .win-selectionborder, |
| html.win-hoverable .win-itemcontainer.win-container.win-selected:hover .win-selectionborder, |
| html.win-hoverable .win-listview.win-selectionstylefilled .win-selected:hover .win-selectionbackground, |
| html.win-hoverable .win-itemcontainer.win-selectionstylefilled.win-selected:hover .win-selectionbackground { |
| opacity: 0.8; |
| } |
| html.win-hoverable .win-toggleswitch:not(.win-toggleswitch-disabled):not(.win-toggleswitch-pressed) .win-toggleswitch-clickregion:hover .win-toggleswitch-thumb { |
| background-color: #ffffff; |
| } |
| html.win-hoverable .win-toggleswitch:not(.win-toggleswitch-disabled):not(.win-toggleswitch-pressed).win-toggleswitch-on .win-toggleswitch-clickregion:hover .win-toggleswitch-thumb { |
| background-color: #ffffff; |
| } |
| html.win-hoverable .win-toggleswitch-off:not(.win-toggleswitch-disabled):not(.win-toggleswitch-pressed) .win-toggleswitch-clickregion:hover .win-toggleswitch-track { |
| border-color: #ffffff; |
| } |
| html.win-hoverable button:hover.win-semanticzoom-button { |
| background-color: #d8d8d8; |
| } |
| html.win-hoverable .win-pivot .win-pivot-navbutton:hover { |
| color: rgba(255, 255, 255, 0.6); |
| } |
| html.win-hoverable .win-pivot button.win-pivot-header:hover { |
| color: baseMediumHigh; |
| } |
| html.win-hoverable button.win-hub-section-header-tabstop:hover { |
| color: #ffffff; |
| } |
| html.win-hoverable button.win-hub-section-header-tabstop.win-hub-section-header-interactive:hover { |
| color: rgba(255, 255, 255, 0.8); |
| } |
| html.win-hoverable.win-navbar button.win-navbar-invokebutton:enabled:hover, |
| html.win-hoverable .win-navbar button.win-navbar-invokebutton:enabled:hover, |
| html.win-hoverable.win-navbar button.win-navbar-invokebutton:disabled:hover, |
| html.win-hoverable .win-navbar button.win-navbar-invokebutton:disabled:hover { |
| background-color: transparent; |
| } |
| html.win-hoverable.win-navbar.win-navbar-opening button.win-navbar-invokebutton:enabled:hover, |
| html.win-hoverable .win-navbar.win-navbar-opening button.win-navbar-invokebutton:enabled:hover, |
| html.win-hoverable.win-navbar.win-navbar-opened button.win-navbar-invokebutton:enabled:hover, |
| html.win-hoverable .win-navbar.win-navbar-opened button.win-navbar-invokebutton:enabled:hover { |
| background-color: rgba(255, 255, 255, 0.1); |
| } |
| html.win-hoverable.win-navbar.win-navbar-opening button.win-navbar-invokebutton:enabled:hover .win-navbar-ellipsis, |
| html.win-hoverable .win-navbar.win-navbar-opening button.win-navbar-invokebutton:enabled:hover .win-navbar-ellipsis, |
| html.win-hoverable.win-navbar.win-navbar-opened button.win-navbar-invokebutton:enabled:hover .win-navbar-ellipsis, |
| html.win-hoverable .win-navbar.win-navbar-opened button.win-navbar-invokebutton:enabled:hover .win-navbar-ellipsis { |
| color: #ffffff; |
| } |
| html.win-hoverable.win-navbar.win-navbar-closing button.win-navbar-invokebutton:enabled:hover, |
| html.win-hoverable .win-navbar.win-navbar-closing button.win-navbar-invokebutton:enabled:hover, |
| html.win-hoverable.win-navbar.win-navbar-closed button.win-navbar-invokebutton:enabled:hover, |
| html.win-hoverable .win-navbar.win-navbar-closed button.win-navbar-invokebutton:enabled:hover { |
| background-color: rgba(255, 255, 255, 0.1); |
| } |
| html.win-hoverable.win-navbar.win-navbar-closing button.win-navbar-invokebutton:enabled:hover .win-navbar-ellipsis, |
| html.win-hoverable .win-navbar.win-navbar-closing button.win-navbar-invokebutton:enabled:hover .win-navbar-ellipsis, |
| html.win-hoverable.win-navbar.win-navbar-closed button.win-navbar-invokebutton:enabled:hover .win-navbar-ellipsis, |
| html.win-hoverable .win-navbar.win-navbar-closed button.win-navbar-invokebutton:enabled:hover .win-navbar-ellipsis { |
| color: #ffffff; |
| } |
| html.win-hoverable button.win-command:enabled:hover { |
| background-color: rgba(255, 255, 255, 0.1); |
| color: #ffffff; |
| } |
| html.win-hoverable button.win-command:enabled:hover .win-commandglyph { |
| color: #ffffff; |
| } |
| html.win-hoverable .win-menu button.win-command:enabled:hover { |
| background-color: rgba(255, 255, 255, 0.1); |
| color: #ffffff; |
| } |
| html.win-hoverable button[aria-checked=true].win-command:hover { |
| background-color: transparent; |
| } |
| html.win-hoverable button:enabled[aria-checked=true].win-command:hover:before { |
| opacity: 0.8; |
| } |
| html.win-hoverable button:enabled[aria-checked=true].win-command:hover:active:before { |
| opacity: 0.9; |
| } |
| html.win-hoverable.win-commandingsurface button.win-commandingsurface-overflowbutton:hover, |
| html.win-hoverable .win-commandingsurface button.win-commandingsurface-overflowbutton:hover, |
| html.win-hoverable.win-commandingsurface .win-commandingsurface-overflowarea button.win-command:hover, |
| html.win-hoverable .win-commandingsurface .win-commandingsurface-overflowarea button.win-command:hover { |
| background-color: rgba(255, 255, 255, 0.1); |
| } |
| html.win-hoverable.win-commandingsurface button.win-commandingsurface-overflowbutton:hover .win-commandingsurface-ellipsis, |
| html.win-hoverable .win-commandingsurface button.win-commandingsurface-overflowbutton:hover .win-commandingsurface-ellipsis { |
| color: #ffffff; |
| } |
| html.win-hoverable .win-autosuggestbox-suggestion-result:hover, |
| html.win-hoverable .win-autosuggestbox-suggestion-query:hover { |
| background-color: rgba(255, 255, 255, 0.1); |
| } |
| html.win-hoverable .win-searchbox-button:not(.win-searchbox-button-disabled):hover:active { |
| color: #ffffff; |
| } |
| html.win-hoverable .win-splitviewcommand-button:hover { |
| background-color: rgba(255, 255, 255, 0.1); |
| } |
| html.win-hoverable .win-splitviewcommand-button:hover.win-pressed { |
| background-color: rgba(255, 255, 255, 0.2); |
| } |
| html.win-hoverable .win-navbarcontainer-navarrow:hover { |
| background-color: rgba(255, 255, 255, 0.6); |
| } |
| html.win-hoverable .win-navbarcommand-button:hover, |
| html.win-hoverable .win-navbarcommand-splitbutton:hover { |
| background-color: rgba(255, 255, 255, 0.19); |
| } |
| html.win-hoverable .win-navbarcommand-button:hover.win-pressed, |
| html.win-hoverable .win-navbarcommand-splitbutton:hover.win-pressed { |
| background-color: rgba(255, 255, 255, 0.28); |
| } |
| html.win-hoverable button.win-splitviewpanetoggle:hover { |
| color: #ffffff; |
| background-color: rgba(255, 255, 255, 0.1); |
| } |
| .win-ui-light body { |
| background-color: #ffffff; |
| color: #000000; |
| } |
| .win-ui-light .win-ui-light { |
| background-color: #ffffff; |
| color: #000000; |
| } |
| .win-ui-light .win-ui-dark { |
| background-color: #000000; |
| color: #ffffff; |
| } |
| .win-ui-light ::selection { |
| color: #fff; |
| } |
| .win-ui-light .win-link:hover { |
| color: rgba(0, 0, 0, 0.6); |
| } |
| .win-ui-light .win-link:active { |
| color: rgba(0, 0, 0, 0.4); |
| } |
| .win-ui-light .win-link[disabled] { |
| color: rgba(0, 0, 0, 0.2); |
| } |
| .win-ui-light .win-checkbox::-ms-check { |
| color: #000000; |
| border-color: rgba(0, 0, 0, 0.8); |
| background-color: transparent; |
| } |
| .win-ui-light .win-checkbox:indeterminate::-ms-check { |
| color: rgba(0, 0, 0, 0.8); |
| } |
| .win-ui-light .win-checkbox:checked::-ms-check { |
| color: #fff; |
| border-color: transparent; |
| } |
| .win-ui-light .win-checkbox:hover::-ms-check { |
| border-color: #000000; |
| } |
| .win-ui-light .win-checkbox:hover:indeterminate::-ms-check { |
| color: #000000; |
| } |
| .win-ui-light .win-checkbox:active::-ms-check { |
| border-color: transparent; |
| background-color: rgba(0, 0, 0, 0.6); |
| } |
| .win-ui-light .win-checkbox:indeterminate:active::-ms-check { |
| color: rgba(0, 0, 0, 0.6); |
| border-color: rgba(0, 0, 0, 0.8); |
| background-color: transparent; |
| } |
| .win-ui-light .win-checkbox:disabled::-ms-check, |
| .win-ui-light .win-checkbox:indeterminate:disabled::-ms-check { |
| color: rgba(0, 0, 0, 0.2); |
| border-color: rgba(0, 0, 0, 0.2); |
| background-color: transparent; |
| } |
| .win-ui-light .win-radio::-ms-check { |
| color: rgba(0, 0, 0, 0.8); |
| border-color: rgba(0, 0, 0, 0.8); |
| background-color: transparent; |
| } |
| .win-ui-light .win-radio:hover::-ms-check { |
| border-color: #000000; |
| } |
| .win-ui-light .win-radio:hover::-ms-check { |
| color: #000000; |
| } |
| .win-ui-light .win-radio:active::-ms-check { |
| color: rgba(0, 0, 0, 0.6); |
| border-color: rgba(0, 0, 0, 0.6); |
| } |
| .win-ui-light .win-radio:disabled::-ms-check { |
| color: rgba(0, 0, 0, 0.2); |
| border-color: rgba(0, 0, 0, 0.2); |
| } |
| .win-ui-light .win-progress-bar:not(:indeterminate), |
| .win-ui-light .win-progress-ring:not(:indeterminate), |
| .win-ui-light .win-ring:not(:indeterminate) { |
| background-color: rgba(0, 0, 0, 0.2); |
| } |
| .win-ui-light .win-progress-bar::-webkit-progress-bar, |
| .win-ui-light .win-progress-ring::-webkit-progress-bar, |
| .win-ui-light .win-ring::-webkit-progress-bar { |
| background-color: transparent; |
| } |
| .win-ui-light .win-progress-ring, |
| .win-ui-light .win-ring { |
| background-color: transparent; |
| } |
| .win-ui-light .win-button { |
| color: #000000; |
| background-color: rgba(0, 0, 0, 0.2); |
| border-color: transparent; |
| } |
| .win-ui-light .win-button.win-button-primary { |
| color: #fff; |
| } |
| .win-ui-light .win-button:hover, |
| .win-ui-light .win-button.win-button-primary:hover { |
| border-color: rgba(0, 0, 0, 0.4); |
| } |
| .win-ui-light .win-button:active, |
| .win-ui-light .win-button.win-button-primary:active { |
| background-color: rgba(0, 0, 0, 0.4); |
| } |
| .win-ui-light .win-button:disabled, |
| .win-ui-light .win-button.win-button-primary:disabled { |
| color: rgba(0, 0, 0, 0.2); |
| background-color: rgba(0, 0, 0, 0.2); |
| border-color: transparent; |
| } |
| .win-ui-light .win-dropdown { |
| color: #000000; |
| background-color: rgba(0, 0, 0, 0.2); |
| border-color: rgba(0, 0, 0, 0.4); |
| } |
| .win-ui-light .win-dropdown::-ms-expand { |
| color: rgba(0, 0, 0, 0.8); |
| background-color: transparent; |
| } |
| .win-ui-light .win-dropdown:hover { |
| background-color: #f2f2f2; |
| border-color: rgba(0, 0, 0, 0.6); |
| } |
| .win-ui-light .win-dropdown:disabled { |
| color: rgba(0, 0, 0, 0.2); |
| background-color: rgba(0, 0, 0, 0.2); |
| } |
| .win-ui-light .win-dropdown:disabled::-ms-expand { |
| color: rgba(0, 0, 0, 0.2); |
| border-color: rgba(0, 0, 0, 0.2); |
| } |
| .win-ui-light .win-dropdown option { |
| color: #000000; |
| background-color: #f2f2f2; |
| } |
| .win-ui-light .win-dropdown option:checked { |
| color: #ffffff; |
| } |
| .win-ui-light .win-dropdown option:hover, |
| .win-ui-light .win-dropdown option:active { |
| background-color: rgba(0, 0, 0, 0.2); |
| color: #000000; |
| } |
| .win-ui-light .win-dropdown optgroup { |
| color: #000000; |
| background-color: #f2f2f2; |
| } |
| .win-ui-light .win-dropdown optgroup:disabled { |
| color: rgba(0, 0, 0, 0.2); |
| } |
| .win-ui-light select[multiple].win-dropdown { |
| border: none; |
| background-color: #f2f2f2; |
| } |
| .win-ui-light select[multiple].win-dropdown option { |
| color: #000000; |
| } |
| .win-ui-light select[multiple].win-dropdown option:hover { |
| color: #000000; |
| } |
| .win-ui-light select[multiple].win-dropdown option:checked { |
| color: #ffffff; |
| } |
| .win-ui-light .win-slider { |
| background-color: transparent; |
| } |
| .win-ui-light .win-slider:hover::-ms-thumb { |
| background: #1f1f1f; |
| } |
| .win-ui-light .win-slider:hover::-webkit-slider-thumb { |
| background: #1f1f1f; |
| } |
| .win-ui-light .win-slider:hover::-moz-range-thumb { |
| background: #1f1f1f; |
| } |
| .win-ui-light .win-slider:active::-ms-thumb { |
| background: #cccccc; |
| } |
| .win-ui-light .win-slider:active::-webkit-slider-thumb { |
| background: #cccccc; |
| } |
| .win-ui-light .win-slider:active::-moz-range-thumb { |
| background: #cccccc; |
| } |
| .win-ui-light .win-slider:disabled::-ms-thumb { |
| background: #cccccc; |
| } |
| .win-ui-light .win-slider:disabled::-webkit-slider-thumb { |
| background: #cccccc; |
| } |
| .win-ui-light .win-slider:disabled::-moz-range-thumb { |
| background: #cccccc; |
| } |
| .win-ui-light .win-slider:disabled::-ms-fill-lower { |
| background: rgba(0, 0, 0, 0.2); |
| } |
| .win-ui-light .win-slider::-ms-fill-upper { |
| background: rgba(0, 0, 0, 0.4); |
| } |
| .win-ui-light .win-slider::-webkit-slider-runnable-track { |
| background: rgba(0, 0, 0, 0.4); |
| } |
| .win-ui-light .win-slider::-moz-range-track { |
| background: rgba(0, 0, 0, 0.4); |
| } |
| .win-ui-light .win-slider:active::-ms-fill-upper { |
| background: rgba(0, 0, 0, 0.4); |
| } |
| .win-ui-light .win-slider:active::-webkit-slider-runnable-track { |
| background: rgba(0, 0, 0, 0.4); |
| } |
| .win-ui-light .win-slider:active::-moz-range-track { |
| background: rgba(0, 0, 0, 0.4); |
| } |
| .win-ui-light .win-slider:disabled::-ms-fill-upper { |
| background: rgba(0, 0, 0, 0.2); |
| } |
| .win-ui-light .win-slider:disabled::-webkit-slider-runnable-track { |
| background: rgba(0, 0, 0, 0.2); |
| } |
| .win-ui-light .win-slider:disabled::-moz-range-track { |
| background: rgba(0, 0, 0, 0.2); |
| } |
| .win-ui-light .win-slider::-ms-track { |
| color: transparent; |
| background-color: transparent; |
| } |
| .win-ui-light .win-slider::-ms-ticks-before, |
| .win-ui-light .win-slider::-ms-ticks-after { |
| color: rgba(0, 0, 0, 0.4); |
| } |
| .win-ui-light .win-textbox, |
| .win-ui-light .win-textarea { |
| color: #000000; |
| background-color: rgba(255, 255, 255, 0.4); |
| border-color: rgba(0, 0, 0, 0.4); |
| } |
| .win-ui-light .win-textbox:-ms-input-placeholder, |
| .win-ui-light .win-textarea:-ms-input-placeholder { |
| color: rgba(0, 0, 0, 0.6); |
| } |
| .win-ui-light .win-textbox::-webkit-input-placeholder, |
| .win-ui-light .win-textarea::-webkit-input-placeholder { |
| color: rgba(0, 0, 0, 0.6); |
| } |
| .win-ui-light .win-textbox::-moz-input-placeholder, |
| .win-ui-light .win-textarea::-moz-input-placeholder { |
| color: rgba(0, 0, 0, 0.6); |
| } |
| .win-ui-light .win-textbox:hover, |
| .win-ui-light .win-textarea:hover { |
| background-color: rgba(255, 255, 255, 0.6); |
| border-color: rgba(0, 0, 0, 0.6); |
| } |
| .win-ui-light .win-textbox:focus, |
| .win-ui-light .win-textarea:focus { |
| color: #000000; |
| background-color: #ffffff; |
| } |
| .win-ui-light .win-textbox::-ms-clear, |
| .win-ui-light .win-textbox::-ms-reveal { |
| display: block; |
| color: rgba(0, 0, 0, 0.6); |
| } |
| .win-ui-light .win-textbox::-ms-clear:active, |
| .win-ui-light .win-textbox::-ms-reveal:active { |
| color: #ffffff; |
| } |
| .win-ui-light .win-xbox :focus { |
| outline: 2px solid white; |
| } |
| .win-ui-light .win-selectionmode .win-itemcontainer.win-container .win-itembox::after, |
| .win-ui-light .win-itemcontainer.win-selectionmode.win-container .win-itembox::after, |
| .win-ui-light .win-listview .win-surface.win-selectionmode .win-itembox::after { |
| border-color: #000000; |
| background-color: #e6e6e6; |
| } |
| .win-ui-light .win-selectioncheckmark { |
| color: #000000; |
| } |
| .win-ui-light html.win-hoverable .win-listview.win-selectionstylefilled .win-container.win-pressed .win-itembox, |
| .win-ui-light html.win-hoverable .win-listview.win-selectionstylefilled .win-container .win-itembox.win-pressed, |
| .win-ui-light html.win-hoverable .win-itemcontainer.win-selectionstylefilled.win-container.win-pressed .win-itembox, |
| .win-ui-light .win-listview.win-selectionstylefilled .win-container.win-pressed .win-itembox, |
| .win-ui-light .win-listview.win-selectionstylefilled .win-container .win-itembox.win-pressed, |
| .win-ui-light .win-itemcontainer.win-selectionstylefilled.win-container.win-pressed .win-itembox { |
| background-color: rgba(0, 0, 0, 0.2); |
| } |
| .win-ui-light .win-listview .win-itembox, |
| .win-ui-light .win-itemcontainer .win-itembox { |
| background-color: #ffffff; |
| } |
| .win-ui-light .win-listview .win-container.win-backdrop { |
| background-color: rgba(155, 155, 155, 0.23); |
| } |
| .win-ui-light .win-listview .win-groupheader { |
| outline-color: #000000; |
| } |
| .win-ui-light .win-listview .win-focusedoutline, |
| .win-ui-light .win-itemcontainer .win-focusedoutline { |
| outline: #000000 dashed 2px; |
| } |
| .win-ui-light .win-listview.win-selectionstylefilled .win-selected .win-selectionbackground, |
| .win-ui-light .win-itemcontainer.win-selectionstylefilled.win-selected .win-selectionbackground { |
| opacity: 0.4; |
| } |
| .win-ui-light .win-listview.win-selectionstylefilled .win-selected, |
| .win-ui-light .win-itemcontainer.win-selectionstylefilled.win-selected { |
| color: #000000; |
| } |
| .win-ui-light .win-flipview .win-navbutton { |
| background-color: rgba(0, 0, 0, 0.4); |
| color: rgba(255, 255, 255, 0.8); |
| } |
| .win-ui-light .win-flipview .win-navbutton:hover:active { |
| background-color: rgba(0, 0, 0, 0.8); |
| } |
| .win-ui-light html.win-hoverable .win-flipview .win-navbutton:hover { |
| background-color: rgba(0, 0, 0, 0.6); |
| } |
| .win-ui-light .win-backbutton, |
| .win-ui-light .win-back, |
| .win-ui-light .win-navigation-backbutton { |
| background-color: transparent; |
| border: none; |
| color: #000000; |
| } |
| .win-ui-light .win-backbutton:hover, |
| .win-ui-light .win-navigation-backbutton:hover .win-back { |
| background-color: rgba(0, 0, 0, 0.1); |
| } |
| .win-ui-light .win-backbutton:active, |
| .win-ui-light .win-navigation-backbutton:active .win-back { |
| background-color: rgba(0, 0, 0, 0.2); |
| } |
| .win-ui-light .win-backbutton:disabled, |
| .win-ui-light .win-backbutton:disabled:active, |
| .win-ui-light .win-navigation-backbutton:disabled, |
| .win-ui-light .win-navigation-backbutton:disabled .win-back, |
| .win-ui-light .win-navigation-backbutton:disabled:active .win-back { |
| color: rgba(0, 0, 0, 0.4); |
| background-color: transparent; |
| } |
| .win-ui-light .win-backbutton:focus, |
| .win-ui-light .win-navigation-backbutton:focus .win-back { |
| outline-color: #000000; |
| } |
| .win-ui-light .win-tooltip { |
| color: #000000; |
| border-color: #cccccc; |
| background-color: #f2f2f2; |
| } |
| .win-ui-light .win-rating .win-star.win-tentative.win-full { |
| color: rgba(0, 0, 0, 0.8); |
| } |
| .win-ui-light .win-rating .win-star.win-average.win-full, |
| .win-ui-light .win-rating .win-star.win-average.win-full.win-disabled { |
| color: rgba(0, 0, 0, 0.4); |
| } |
| .win-ui-light .win-rating .win-star.win-empty { |
| color: rgba(0, 0, 0, 0.2); |
| } |
| .win-ui-light .win-toggleswitch-header, |
| .win-ui-light .win-toggleswitch-value { |
| color: #000000; |
| } |
| .win-ui-light .win-toggleswitch-thumb { |
| background-color: rgba(0, 0, 0, 0.8); |
| } |
| .win-ui-light .win-toggleswitch-off .win-toggleswitch-track { |
| border-color: rgba(0, 0, 0, 0.8); |
| } |
| .win-ui-light .win-toggleswitch-pressed .win-toggleswitch-thumb { |
| background-color: #ffffff; |
| } |
| .win-ui-light .win-toggleswitch-pressed .win-toggleswitch-track { |
| border-color: transparent; |
| background-color: rgba(0, 0, 0, 0.6); |
| } |
| .win-ui-light .win-toggleswitch-disabled .win-toggleswitch-header, |
| .win-ui-light .win-toggleswitch-disabled .win-toggleswitch-value { |
| color: rgba(0, 0, 0, 0.2); |
| } |
| .win-ui-light .win-toggleswitch-disabled .win-toggleswitch-thumb { |
| background-color: rgba(0, 0, 0, 0.2); |
| } |
| .win-ui-light .win-toggleswitch-disabled .win-toggleswitch-track { |
| border-color: rgba(0, 0, 0, 0.2); |
| } |
| .win-ui-light .win-toggleswitch-on .win-toggleswitch-thumb { |
| background-color: #ffffff; |
| } |
| .win-ui-light .win-toggleswitch-on .win-toggleswitch-track { |
| border-color: transparent; |
| } |
| .win-ui-light .win-toggleswitch-on.win-toggleswitch-pressed .win-toggleswitch-track { |
| background-color: rgba(0, 0, 0, 0.6); |
| } |
| .win-ui-light .win-toggleswitch-on.win-toggleswitch-disabled .win-toggleswitch-thumb { |
| background-color: rgba(0, 0, 0, 0.2); |
| } |
| .win-ui-light .win-toggleswitch-on.win-toggleswitch-disabled .win-toggleswitch-track { |
| background-color: rgba(0, 0, 0, 0.2); |
| } |
| .win-ui-light .win-semanticzoom-button { |
| background-color: rgba(216, 216, 216, 0.33); |
| border-color: transparent; |
| } |
| .win-ui-light button.win-semanticzoom-button.win-semanticzoom-button:active, |
| .win-ui-light button.win-semanticzoom-button.win-semanticzoom-button:hover:active { |
| background-color: #000000; |
| } |
| .win-ui-light .win-pivot .win-pivot-title { |
| color: #000000; |
| } |
| .win-ui-light .win-pivot .win-pivot-navbutton { |
| background-color: rgba(0, 0, 0, 0.4); |
| color: rgba(255, 255, 255, 0.8); |
| } |
| .win-ui-light .win-pivot .win-pivot-navbutton.win-pivot-navbutton:hover:active { |
| color: rgba(0, 0, 0, 0.8); |
| } |
| .win-ui-light .win-pivot button.win-pivot-header { |
| color: rgba(0, 0, 0, 0.6); |
| background-color: transparent; |
| } |
| .win-ui-light .win-pivot button.win-pivot-header:focus, |
| .win-ui-light .win-pivot button.win-pivot-header.win-pivot-header:hover:active { |
| color: rgba(0, 0, 0, 0.8); |
| } |
| .win-ui-light .win-pivot button.win-pivot-header.win-pivot-header-selected { |
| color: #000000; |
| background-color: transparent; |
| } |
| .win-ui-light .win-pivot-header[disabled] { |
| color: rgba(0, 0, 0, 0.4); |
| } |
| .win-ui-light button.win-hub-section-header-tabstop, |
| .win-ui-light button.win-hub-section-header-tabstop:hover:active { |
| color: #000000; |
| } |
| .win-ui-light button.win-hub-section-header-tabstop.win-keyboard:focus { |
| outline: 1px dotted #000000; |
| } |
| .win-ui-light button.win-hub-section-header-tabstop:-ms-keyboard-active { |
| color: #000000; |
| } |
| .win-ui-light button.win-hub-section-header-tabstop.win-hub-section-header-interactive.win-hub-section-header-interactive:hover:active { |
| color: rgba(0, 0, 0, 0.4); |
| } |
| .win-ui-light button.win-hub-section-header-tabstop.win-hub-section-header-interactive:-ms-keyboard-active { |
| color: rgba(0, 0, 0, 0.4); |
| } |
| .win-ui-light .win-overlay { |
| outline: none; |
| } |
| .win-ui-light hr.win-command { |
| background-color: rgba(0, 0, 0, 0.4); |
| } |
| .win-ui-light div.win-command, |
| .win-ui-light button.win-command { |
| border-color: transparent; |
| background-color: transparent; |
| } |
| .win-ui-light div.win-command:hover:active, |
| .win-ui-light button.win-command:hover:active { |
| border-color: transparent; |
| } |
| .win-ui-light button:enabled.win-command.win-keyboard:focus, |
| .win-ui-light div.win-command.win-keyboard:focus, |
| .win-ui-light button:enabled.win-command.win-command.win-keyboard:hover:focus, |
| .win-ui-light div.win-command.win-command.win-keyboard:hover:focus { |
| border-color: #000000; |
| } |
| .win-ui-light .win-commandimage { |
| color: #000000; |
| } |
| .win-ui-light button.win-command.win-command:enabled:hover:active, |
| .win-ui-light button.win-command.win-command:enabled:active { |
| background-color: rgba(0, 0, 0, 0.2); |
| color: #000000; |
| } |
| .win-ui-light button:enabled:hover:active .win-commandimage, |
| .win-ui-light button:enabled:active .win-commandimage { |
| color: #000000; |
| } |
| .win-ui-light button:disabled .win-commandimage, |
| .win-ui-light button:disabled:active .win-commandimage { |
| color: rgba(0, 0, 0, 0.2); |
| } |
| .win-ui-light button .win-label { |
| color: #000000; |
| } |
| .win-ui-light button[aria-checked=true]:enabled .win-label, |
| .win-ui-light button[aria-checked=true]:enabled .win-commandimage, |
| .win-ui-light button[aria-checked=true]:enabled:hover:active .win-commandimage.win-commandimage { |
| color: #000000; |
| } |
| .win-ui-light button[aria-checked=true]:-ms-keyboard-active .win-commandimage { |
| color: #000000; |
| } |
| .win-ui-light button[aria-checked=true].win-command:before { |
| position: absolute; |
| height: 100%; |
| width: 100%; |
| opacity: 0.4; |
| box-sizing: content-box; |
| content: ""; |
| /* We want this pseudo element to cover the border of its parent. */ |
| /* Put a 1px border on this element to make it larger and then set its top/left to -1px.*/ |
| border-width: 1px; |
| border-style: solid; |
| top: -1px; |
| left: -1px; |
| } |
| .win-ui-light button.win-command:enabled:-ms-keyboard-active { |
| background-color: rgba(0, 0, 0, 0.2); |
| color: #000000; |
| } |
| .win-ui-light button[aria-checked=true].win-command:enabled:hover:active { |
| background-color: transparent; |
| } |
| .win-ui-light button.win-command:disabled, |
| .win-ui-light button.win-command:disabled:hover:active { |
| background-color: transparent; |
| border-color: transparent; |
| } |
| .win-ui-light button.win-command:disabled .win-label, |
| .win-ui-light button.win-command:disabled:active .win-label { |
| color: rgba(0, 0, 0, 0.2); |
| } |
| .win-ui-light.win-navbar, |
| .win-ui-light .win-navbar { |
| background-color: #e6e6e6; |
| border-color: #e6e6e6; |
| } |
| .win-ui-light.win-navbar.win-menulayout .win-navbar-menu, |
| .win-ui-light .win-navbar.win-menulayout .win-navbar-menu, |
| .win-ui-light.win-navbar.win-menulayout .win-toolbar, |
| .win-ui-light .win-navbar.win-menulayout .win-toolbar { |
| background-color: inherit; |
| } |
| .win-ui-light.win-navbar button.win-navbar-invokebutton.win-navbar-invokebutton, |
| .win-ui-light .win-navbar button.win-navbar-invokebutton.win-navbar-invokebutton { |
| background-color: transparent; |
| outline: none; |
| border-color: transparent; |
| } |
| .win-ui-light.win-navbar button.win-navbar-invokebutton.win-navbar-invokebutton:enabled:-ms-keyboard-active, |
| .win-ui-light .win-navbar button.win-navbar-invokebutton.win-navbar-invokebutton:enabled:-ms-keyboard-active { |
| background-color: transparent; |
| } |
| .win-ui-light.win-navbar button.win-navbar-invokebutton.win-navbar-invokebutton:enabled .win-navbar-ellipsis, |
| .win-ui-light .win-navbar button.win-navbar-invokebutton.win-navbar-invokebutton:enabled .win-navbar-ellipsis { |
| color: #000000; |
| } |
| .win-ui-light.win-navbar button.win-navbar-invokebutton.win-navbar-invokebutton:enabled.win-keyboard:focus, |
| .win-ui-light .win-navbar button.win-navbar-invokebutton.win-navbar-invokebutton:enabled.win-keyboard:focus { |
| border-color: #000000; |
| } |
| .win-ui-light.win-navbar button.win-navbar-invokebutton.win-navbar-invokebutton:disabled:active, |
| .win-ui-light .win-navbar button.win-navbar-invokebutton.win-navbar-invokebutton:disabled:active, |
| .win-ui-light.win-navbar button.win-navbar-invokebutton.win-navbar-invokebutton:disabled:hover:active, |
| .win-ui-light .win-navbar button.win-navbar-invokebutton.win-navbar-invokebutton:disabled:hover:active { |
| background-color: transparent; |
| } |
| .win-ui-light.win-navbar button.win-navbar-invokebutton.win-navbar-invokebutton:disabled .win-navbar-ellipsis, |
| .win-ui-light .win-navbar button.win-navbar-invokebutton.win-navbar-invokebutton:disabled .win-navbar-ellipsis { |
| color: rgba(0, 0, 0, 0.2); |
| } |
| .win-ui-light.win-navbar.win-navbar-closing button.win-navbar-invokebutton.win-navbar-invokebutton:enabled:hover:active, |
| .win-ui-light .win-navbar.win-navbar-closing button.win-navbar-invokebutton.win-navbar-invokebutton:enabled:hover:active, |
| .win-ui-light.win-navbar.win-navbar-closed button.win-navbar-invokebutton.win-navbar-invokebutton:enabled:hover:active, |
| .win-ui-light .win-navbar.win-navbar-closed button.win-navbar-invokebutton.win-navbar-invokebutton:enabled:hover:active, |
| .win-ui-light.win-navbar.win-navbar-opening button.win-navbar-invokebutton.win-navbar-invokebutton:enabled:hover:active, |
| .win-ui-light .win-navbar.win-navbar-opening button.win-navbar-invokebutton.win-navbar-invokebutton:enabled:hover:active, |
| .win-ui-light.win-navbar.win-navbar-opened button.win-navbar-invokebutton.win-navbar-invokebutton:enabled:hover:active, |
| .win-ui-light .win-navbar.win-navbar-opened button.win-navbar-invokebutton.win-navbar-invokebutton:enabled:hover:active { |
| background-color: rgba(0, 0, 0, 0.2); |
| } |
| .win-ui-light.win-navbar.win-navbar-closing button.win-navbar-invokebutton.win-navbar-invokebutton:enabled:hover:active .win-navbar-ellipsis, |
| .win-ui-light .win-navbar.win-navbar-closing button.win-navbar-invokebutton.win-navbar-invokebutton:enabled:hover:active .win-navbar-ellipsis, |
| .win-ui-light.win-navbar.win-navbar-closed button.win-navbar-invokebutton.win-navbar-invokebutton:enabled:hover:active .win-navbar-ellipsis, |
| .win-ui-light .win-navbar.win-navbar-closed button.win-navbar-invokebutton.win-navbar-invokebutton:enabled:hover:active .win-navbar-ellipsis, |
| .win-ui-light.win-navbar.win-navbar-opening button.win-navbar-invokebutton.win-navbar-invokebutton:enabled:hover:active .win-navbar-ellipsis, |
| .win-ui-light .win-navbar.win-navbar-opening button.win-navbar-invokebutton.win-navbar-invokebutton:enabled:hover:active .win-navbar-ellipsis, |
| .win-ui-light.win-navbar.win-navbar-opened button.win-navbar-invokebutton.win-navbar-invokebutton:enabled:hover:active .win-navbar-ellipsis, |
| .win-ui-light .win-navbar.win-navbar-opened button.win-navbar-invokebutton.win-navbar-invokebutton:enabled:hover:active .win-navbar-ellipsis { |
| color: #000000; |
| } |
| .win-ui-light.win-flyout, |
| .win-ui-light .win-flyout { |
| background-color: #ffffff; |
| } |
| .win-ui-light .win-settingsflyout { |
| background-color: #ffffff; |
| } |
| .win-ui-light.win-menu button, |
| .win-ui-light .win-menu button { |
| background-color: transparent; |
| color: #000000; |
| } |
| .win-ui-light .win-menu button.win-command.win-command:enabled:hover:active, |
| .win-ui-light .win-menu button[aria-checked=true].win-command.win-command:enabled:hover:active { |
| background-color: rgba(0, 0, 0, 0.2); |
| color: #000000; |
| } |
| .win-ui-light.win-menu-containsflyoutcommand button.win-command-flyout-activated:before, |
| .win-ui-light .win-menu-containsflyoutcommand button.win-command-flyout-activated:before { |
| position: absolute; |
| height: 100%; |
| width: 100%; |
| opacity: 0.4; |
| content: ""; |
| box-sizing: content-box; |
| /* We want this pseudo element to cover the border of its parent. */ |
| /* Put a 1px border on this element to make it larger and then set its top/left to -1px.*/ |
| border-width: 1px; |
| border-style: solid; |
| top: -1px; |
| left: -1px; |
| } |
| .win-ui-light.win-menu button[aria-checked=true].win-command:before, |
| .win-ui-light .win-menu button[aria-checked=true].win-command:before { |
| background-color: transparent; |
| border-color: transparent; |
| } |
| .win-ui-light.win-menu button:disabled, |
| .win-ui-light .win-menu button:disabled, |
| .win-ui-light.win-menu button:disabled:active, |
| .win-ui-light .win-menu button:disabled:active { |
| background-color: transparent; |
| color: rgba(0, 0, 0, 0.2); |
| } |
| .win-ui-light.win-commandingsurface .win-commandingsurface-actionarea, |
| .win-ui-light .win-commandingsurface .win-commandingsurface-actionarea { |
| background-color: #e6e6e6; |
| } |
| .win-ui-light.win-commandingsurface button.win-commandingsurface-overflowbutton, |
| .win-ui-light .win-commandingsurface button.win-commandingsurface-overflowbutton { |
| background-color: transparent; |
| border-color: transparent; |
| } |
| .win-ui-light.win-commandingsurface button.win-commandingsurface-overflowbutton:enabled:-ms-keyboard-active, |
| .win-ui-light .win-commandingsurface button.win-commandingsurface-overflowbutton:enabled:-ms-keyboard-active { |
| background-color: transparent; |
| } |
| .win-ui-light.win-commandingsurface button.win-commandingsurface-overflowbutton:enabled .win-commandingsurface-ellipsis, |
| .win-ui-light .win-commandingsurface button.win-commandingsurface-overflowbutton:enabled .win-commandingsurface-ellipsis { |
| color: #000000; |
| } |
| .win-ui-light.win-commandingsurface button.win-commandingsurface-overflowbutton.win-keyboard:focus, |
| .win-ui-light .win-commandingsurface button.win-commandingsurface-overflowbutton.win-keyboard:focus { |
| border-color: #000000; |
| } |
| .win-ui-light.win-commandingsurface .win-commandingsurface-overflowarea, |
| .win-ui-light .win-commandingsurface .win-commandingsurface-overflowarea { |
| background-color: #f2f2f2; |
| } |
| .win-ui-light.win-commandingsurface button.win-commandingsurface-overflowbutton.win-commandingsurface-overflowbutton:hover:active, |
| .win-ui-light .win-commandingsurface button.win-commandingsurface-overflowbutton.win-commandingsurface-overflowbutton:hover:active { |
| background-color: rgba(0, 0, 0, 0.2); |
| } |
| .win-ui-light.win-commandingsurface .win-commandingsurface-overflowarea button:enabled.win-command:hover:active, |
| .win-ui-light .win-commandingsurface .win-commandingsurface-overflowarea button:enabled.win-command:hover:active { |
| color: #000000; |
| background-color: rgba(0, 0, 0, 0.2); |
| } |
| .win-ui-light .win-autosuggestbox-flyout-highlighttext { |
| color: #4617b4; |
| } |
| .win-ui-light .win-autosuggestbox-suggestion-separator { |
| color: #7a7a7a; |
| } |
| .win-ui-light .win-autosuggestbox-suggestion-separator hr { |
| border-color: #7a7a7a; |
| } |
| .win-ui-light .win-autosuggestbox-suggestion-selected .win-autosuggestbox-flyout-highlighttext { |
| color: #a38bda; |
| } |
| .win-ui-light .win-autosuggestbox-flyout { |
| background-color: #f2f2f2; |
| color: #000000; |
| } |
| .win-ui-light .win-autosuggestbox-suggestion-result:hover:active, |
| .win-ui-light .win-autosuggestbox-suggestion-query:hover:active { |
| background-color: rgba(0, 0, 0, 0.2); |
| } |
| .win-ui-light .win-searchbox-button { |
| color: rgba(0, 0, 0, 0.4); |
| } |
| .win-ui-light .win-searchbox-button-input-focus { |
| color: rgba(0, 0, 0, 0.4); |
| } |
| .win-ui-light .win-searchbox-button.win-searchbox-button:not(.win-searchbox-button-disabled):hover:active { |
| color: #ffffff; |
| } |
| .win-ui-light .win-splitviewcommand-button { |
| background-color: transparent; |
| color: #000000; |
| } |
| .win-ui-light .win-splitviewcommand-button.win-pressed { |
| background-color: rgba(0, 0, 0, 0.2); |
| } |
| .win-ui-light .win-splitviewcommand-button.win-keyboard:focus::before { |
| content: ""; |
| pointer-events: none; |
| position: absolute; |
| box-sizing: border-box; |
| top: 0; |
| left: 0; |
| height: 100%; |
| width: 100%; |
| border: 1px dotted #000000; |
| } |
| .win-ui-light .win-navbarcontainer-pageindicator { |
| background-color: rgba(0, 0, 0, 0.2); |
| } |
| .win-ui-light .win-navbarcontainer-pageindicator-current { |
| background-color: rgba(0, 0, 0, 0.6); |
| } |
| .win-ui-light .win-navbarcontainer-navarrow { |
| background-color: rgba(0, 0, 0, 0.4); |
| color: rgba(255, 255, 255, 0.8); |
| } |
| .win-ui-light .win-navbarcontainer-navarrow.win-navbarcontainer-navarrow:hover:active { |
| background-color: rgba(0, 0, 0, 0.8); |
| } |
| .win-ui-light .win-navbarcommand-button, |
| .win-ui-light .win-navbarcommand-splitbutton { |
| background-color: rgba(0, 0, 0, 0.1); |
| color: #000000; |
| } |
| .win-ui-light .win-navbarcommand-button.win-pressed, |
| .win-ui-light .win-navbarcommand-splitbutton.win-pressed { |
| background-color: rgba(0, 0, 0, 0.28); |
| } |
| .win-ui-light .win-navbarcommand-button.win-keyboard:focus::before { |
| content: ""; |
| pointer-events: none; |
| position: absolute; |
| box-sizing: border-box; |
| top: 0; |
| left: 0; |
| height: 100%; |
| width: 100%; |
| border: 1px dotted #000000; |
| } |
| .win-ui-light .win-navbarcommand-splitbutton.win-keyboard:focus::before { |
| border-color: #000000; |
| } |
| .win-ui-light .win-contentdialog-dialog { |
| background-color: #f2f2f2; |
| } |
| .win-ui-light .win-contentdialog-title { |
| color: #000000; |
| } |
| .win-ui-light .win-contentdialog-content { |
| color: #000000; |
| } |
| .win-ui-light .win-contentdialog-backgroundoverlay { |
| background-color: #ffffff; |
| opacity: 0.6; |
| } |
| .win-ui-light .win-splitview-pane { |
| background-color: #f2f2f2; |
| } |
| .win-ui-light button.win-splitviewpanetoggle { |
| color: #000000; |
| background-color: transparent; |
| } |
| .win-ui-light button.win-splitviewpanetoggle:active, |
| .win-ui-light button.win-splitviewpanetoggle.win-splitviewpanetoggle:active:hover { |
| color: #000000; |
| background-color: rgba(0, 0, 0, 0.2); |
| } |
| .win-ui-light button.win-splitviewpanetoggle.win-keyboard:focus { |
| border: 1px dotted #000000; |
| } |
| .win-ui-light button.win-splitviewpanetoggle:disabled, |
| .win-ui-light button.win-splitviewpanetoggle:disabled:active, |
| .win-ui-light button.win-splitviewpanetoggle.win-splitviewpanetoggle:disabled:hover { |
| color: rgba(0, 0, 0, 0.2); |
| background-color: transparent; |
| } |
| html.win-hoverable .win-ui-light { |
| /* LegacyAppBar control colors */ |
| } |
| html.win-hoverable .win-ui-light .win-selectionstylefilled .win-container:hover .win-itembox, |
| html.win-hoverable .win-ui-light .win-selectionstylefilled.win-container:hover .win-itembox { |
| background-color: rgba(0, 0, 0, 0.1); |
| } |
| html.win-hoverable .win-ui-light .win-listview .win-itembox:hover::before, |
| html.win-hoverable .win-ui-light .win-itemcontainer .win-itembox:hover::before { |
| border-color: #000000; |
| } |
| html.win-hoverable .win-ui-light .win-listview .win-container.win-selected:hover .win-selectionborder, |
| html.win-hoverable .win-ui-light .win-itemcontainer.win-container.win-selected:hover .win-selectionborder, |
| html.win-hoverable .win-ui-light .win-listview.win-selectionstylefilled .win-selected:hover .win-selectionbackground, |
| html.win-hoverable .win-ui-light .win-itemcontainer.win-selectionstylefilled.win-selected:hover .win-selectionbackground { |
| opacity: 0.6; |
| } |
| html.win-hoverable .win-ui-light .win-toggleswitch:not(.win-toggleswitch-disabled):not(.win-toggleswitch-pressed) .win-toggleswitch-clickregion:hover .win-toggleswitch-thumb { |
| background-color: #000000; |
| } |
| html.win-hoverable .win-ui-light .win-toggleswitch:not(.win-toggleswitch-disabled):not(.win-toggleswitch-pressed).win-toggleswitch-on .win-toggleswitch-clickregion:hover .win-toggleswitch-thumb { |
| background-color: #ffffff; |
| } |
| html.win-hoverable .win-ui-light .win-toggleswitch-off:not(.win-toggleswitch-disabled):not(.win-toggleswitch-pressed) .win-toggleswitch-clickregion:hover .win-toggleswitch-track { |
| border-color: #000000; |
| } |
| html.win-hoverable .win-ui-light button:hover.win-semanticzoom-button { |
| background-color: #d8d8d8; |
| } |
| html.win-hoverable .win-ui-light .win-pivot .win-pivot-navbutton:hover { |
| color: rgba(0, 0, 0, 0.6); |
| } |
| html.win-hoverable .win-ui-light .win-pivot button.win-pivot-header:hover { |
| color: baseMediumHigh; |
| } |
| html.win-hoverable .win-ui-light button.win-hub-section-header-tabstop:hover { |
| color: #000000; |
| } |
| html.win-hoverable .win-ui-light button.win-hub-section-header-tabstop.win-hub-section-header-interactive:hover { |
| color: rgba(0, 0, 0, 0.8); |
| } |
| html.win-hoverable .win-ui-light.win-navbar button.win-navbar-invokebutton:enabled:hover, |
| html.win-hoverable .win-ui-light .win-navbar button.win-navbar-invokebutton:enabled:hover, |
| html.win-hoverable .win-ui-light.win-navbar button.win-navbar-invokebutton:disabled:hover, |
| html.win-hoverable .win-ui-light .win-navbar button.win-navbar-invokebutton:disabled:hover { |
| background-color: transparent; |
| } |
| html.win-hoverable .win-ui-light.win-navbar.win-navbar-opening button.win-navbar-invokebutton:enabled:hover, |
| html.win-hoverable .win-ui-light .win-navbar.win-navbar-opening button.win-navbar-invokebutton:enabled:hover, |
| html.win-hoverable .win-ui-light.win-navbar.win-navbar-opened button.win-navbar-invokebutton:enabled:hover, |
| html.win-hoverable .win-ui-light .win-navbar.win-navbar-opened button.win-navbar-invokebutton:enabled:hover { |
| background-color: rgba(0, 0, 0, 0.1); |
| } |
| html.win-hoverable .win-ui-light.win-navbar.win-navbar-opening button.win-navbar-invokebutton:enabled:hover .win-navbar-ellipsis, |
| html.win-hoverable .win-ui-light .win-navbar.win-navbar-opening button.win-navbar-invokebutton:enabled:hover .win-navbar-ellipsis, |
| html.win-hoverable .win-ui-light.win-navbar.win-navbar-opened button.win-navbar-invokebutton:enabled:hover .win-navbar-ellipsis, |
| html.win-hoverable .win-ui-light .win-navbar.win-navbar-opened button.win-navbar-invokebutton:enabled:hover .win-navbar-ellipsis { |
| color: #000000; |
| } |
| html.win-hoverable .win-ui-light.win-navbar.win-navbar-closing button.win-navbar-invokebutton:enabled:hover, |
| html.win-hoverable .win-ui-light .win-navbar.win-navbar-closing button.win-navbar-invokebutton:enabled:hover, |
| html.win-hoverable .win-ui-light.win-navbar.win-navbar-closed button.win-navbar-invokebutton:enabled:hover, |
| html.win-hoverable .win-ui-light .win-navbar.win-navbar-closed button.win-navbar-invokebutton:enabled:hover { |
| background-color: rgba(0, 0, 0, 0.1); |
| } |
| html.win-hoverable .win-ui-light.win-navbar.win-navbar-closing button.win-navbar-invokebutton:enabled:hover .win-navbar-ellipsis, |
| html.win-hoverable .win-ui-light .win-navbar.win-navbar-closing button.win-navbar-invokebutton:enabled:hover .win-navbar-ellipsis, |
| html.win-hoverable .win-ui-light.win-navbar.win-navbar-closed button.win-navbar-invokebutton:enabled:hover .win-navbar-ellipsis, |
| html.win-hoverable .win-ui-light .win-navbar.win-navbar-closed button.win-navbar-invokebutton:enabled:hover .win-navbar-ellipsis { |
| color: #000000; |
| } |
| html.win-hoverable .win-ui-light button.win-command:enabled:hover { |
| background-color: rgba(0, 0, 0, 0.1); |
| color: #000000; |
| } |
| html.win-hoverable .win-ui-light button.win-command:enabled:hover .win-commandglyph { |
| color: #000000; |
| } |
| html.win-hoverable .win-ui-light .win-menu button.win-command:enabled:hover { |
| background-color: rgba(0, 0, 0, 0.1); |
| color: #000000; |
| } |
| html.win-hoverable .win-ui-light button[aria-checked=true].win-command:hover { |
| background-color: transparent; |
| } |
| html.win-hoverable .win-ui-light button:enabled[aria-checked=true].win-command:hover:before { |
| opacity: 0.6; |
| } |
| html.win-hoverable .win-ui-light button:enabled[aria-checked=true].win-command:hover:active:before { |
| opacity: 0.7; |
| } |
| html.win-hoverable .win-ui-light.win-commandingsurface button.win-commandingsurface-overflowbutton:hover, |
| html.win-hoverable .win-ui-light .win-commandingsurface button.win-commandingsurface-overflowbutton:hover, |
| html.win-hoverable .win-ui-light.win-commandingsurface .win-commandingsurface-overflowarea button.win-command:hover, |
| html.win-hoverable .win-ui-light .win-commandingsurface .win-commandingsurface-overflowarea button.win-command:hover { |
| background-color: rgba(0, 0, 0, 0.1); |
| } |
| html.win-hoverable .win-ui-light.win-commandingsurface button.win-commandingsurface-overflowbutton:hover .win-commandingsurface-ellipsis, |
| html.win-hoverable .win-ui-light .win-commandingsurface button.win-commandingsurface-overflowbutton:hover .win-commandingsurface-ellipsis { |
| color: #000000; |
| } |
| html.win-hoverable .win-ui-light .win-autosuggestbox-suggestion-result:hover, |
| html.win-hoverable .win-ui-light .win-autosuggestbox-suggestion-query:hover { |
| background-color: rgba(0, 0, 0, 0.1); |
| } |
| html.win-hoverable .win-ui-light .win-searchbox-button:not(.win-searchbox-button-disabled):hover:active { |
| color: #ffffff; |
| } |
| html.win-hoverable .win-ui-light .win-splitviewcommand-button:hover { |
| background-color: rgba(255, 255, 255, 0.1); |
| } |
| html.win-hoverable .win-ui-light .win-splitviewcommand-button:hover.win-pressed { |
| background-color: rgba(255, 255, 255, 0.2); |
| } |
| html.win-hoverable .win-ui-light .win-navbarcontainer-navarrow:hover { |
| background-color: rgba(0, 0, 0, 0.6); |
| } |
| html.win-hoverable .win-ui-light .win-navbarcommand-button:hover, |
| html.win-hoverable .win-ui-light .win-navbarcommand-splitbutton:hover { |
| background-color: rgba(255, 255, 255, 0.19); |
| } |
| html.win-hoverable .win-ui-light .win-navbarcommand-button:hover.win-pressed, |
| html.win-hoverable .win-ui-light .win-navbarcommand-splitbutton:hover.win-pressed { |
| background-color: rgba(255, 255, 255, 0.28); |
| } |
| html.win-hoverable .win-ui-light button.win-splitviewpanetoggle:hover { |
| color: #000000; |
| background-color: rgba(0, 0, 0, 0.1); |
| } |
| @media (-ms-high-contrast) { |
| ::selection { |
| background-color: Highlight; |
| color: HighlightText; |
| } |
| .win-link { |
| color: -ms-hotlight; |
| } |
| .win-link:active { |
| color: Highlight; |
| } |
| .win-link[disabled] { |
| color: GrayText; |
| } |
| .win-checkbox::-ms-check, |
| .win-radio::-ms-check { |
| background-color: ButtonFace; |
| border-color: ButtonText; |
| color: HighlightText; |
| } |
| .win-checkbox:indeterminate::-ms-check, |
| .win-radio:indeterminate::-ms-check { |
| background-color: Highlight; |
| border-color: ButtonText; |
| color: ButtonText; |
| } |
| .win-checkbox:checked::-ms-check, |
| .win-radio:checked::-ms-check { |
| background-color: Highlight; |
| border-color: HighlightText; |
| } |
| .win-checkbox:hover::-ms-check, |
| .win-radio:hover::-ms-check { |
| border-color: Highlight; |
| } |
| .win-checkbox:hover:active::-ms-check, |
| .win-radio:hover:active::-ms-check, |
| .win-checkbox:-ms-keyboard-active::-ms-check, |
| .win-radio:-ms-keyboard-active::-ms-check { |
| border-color: Highlight; |
| } |
| .win-checkbox:disabled::-ms-check, |
| .win-radio:disabled::-ms-check, |
| .win-checkbox:disabled:active::-ms-check, |
| .win-radio:disabled:active::-ms-check { |
| background-color: ButtonFace; |
| border-color: GrayText; |
| color: GrayText; |
| } |
| .win-progress-bar, |
| .win-progress-ring, |
| .win-ring { |
| background-color: ButtonFace; |
| color: Highlight; |
| } |
| .win-progress-bar::-ms-fill, |
| .win-progress-ring::-ms-fill, |
| .win-ring::-ms-fill { |
| background-color: Highlight; |
| } |
| .win-progress-bar.win-paused:not(:indeterminate)::-ms-fill, |
| .win-progress-ring.win-paused:not(:indeterminate)::-ms-fill, |
| .win-ring.win-paused:not(:indeterminate)::-ms-fill { |
| background-color: GrayText; |
| } |
| .win-progress-bar.win-paused:not(:indeterminate), |
| .win-progress-ring.win-paused:not(:indeterminate), |
| .win-ring.win-paused:not(:indeterminate) { |
| animation-name: none; |
| opacity: 1.0; |
| } |
| .win-button { |
| border-color: ButtonText; |
| color: ButtonText; |
| } |
| .win-button:hover { |
| border-color: Highlight; |
| color: Highlight; |
| } |
| .win-button:active { |
| border-color: Highlight; |
| color: Highlight; |
| } |
| .win-button:disabled { |
| border-color: GrayText; |
| color: GrayText; |
| } |
| .win-dropdown { |
| background-color: ButtonFace; |
| border-color: ButtonText; |
| color: WindowText; |
| } |
| .win-dropdown:hover { |
| border-color: Highlight; |
| } |
| .win-dropdown:active { |
| border-color: Highlight; |
| } |
| .win-dropdown:disabled { |
| border-color: GrayText; |
| color: GrayText; |
| } |
| .win-dropdown::-ms-expand { |
| color: ButtonText; |
| } |
| .win-dropdown:disabled::-ms-expand { |
| color: GrayText; |
| } |
| .win-dropdown option { |
| background-color: ButtonFace; |
| color: ButtonText; |
| } |
| .win-dropdown option:hover, |
| .win-dropdown option:active, |
| .win-dropdown option:checked { |
| background-color: Highlight; |
| color: HighlightText; |
| } |
| .win-dropdown option:disabled { |
| background-color: ButtonFace; |
| color: GrayText; |
| } |
| select[multiple].win-dropdown { |
| border: none; |
| } |
| select[multiple].win-dropdown:disabled option { |
| background-color: ButtonFace; |
| color: GrayText; |
| } |
| select[multiple].win-dropdown:disabled option:checked { |
| background-color: GrayText; |
| color: ButtonFace; |
| } |
| .win-slider::-ms-track { |
| color: transparent; |
| } |
| .win-slider::-ms-ticks-before, |
| .win-slider::-ms-ticks-after { |
| color: ButtonText; |
| } |
| .win-slider::-ms-fill-lower { |
| background-color: Highlight; |
| } |
| .win-slider::-ms-fill-upper { |
| background-color: ButtonText; |
| } |
| .win-slider::-ms-thumb { |
| background-color: ButtonText; |
| } |
| .win-slider:hover::-ms-thumb { |
| background-color: Highlight; |
| } |
| .win-slider:active::-ms-thumb { |
| background-color: Highlight; |
| } |
| .win-slider:disabled::-ms-fill-lower, |
| .win-slider:disabled::-ms-fill-upper, |
| .win-slider:disabled::-ms-thumb { |
| background-color: GrayText; |
| } |
| .win-textbox, |
| .win-textarea { |
| border-color: ButtonText; |
| color: ButtonText; |
| } |
| .win-textbox:hover, |
| .win-textarea:hover, |
| .win-textbox:active, |
| .win-textarea:active, |
| .win-textbox:focus, |
| .win-textarea:focus { |
| border-color: Highlight; |
| } |
| .win-textbox:disabled, |
| .win-textarea:disabled { |
| border-color: GrayText; |
| color: GrayText; |
| } |
| .win-textbox:-ms-input-placeholder, |
| .win-textarea:-ms-input-placeholder { |
| color: WindowText; |
| } |
| .win-textbox::-ms-input-placeholder, |
| .win-textarea::-ms-input-placeholder { |
| color: WindowText; |
| } |
| .win-textbox:disabled:-ms-input-placeholder, |
| .win-textarea:disabled:-ms-input-placeholder { |
| color: GrayText; |
| } |
| .win-textbox:disabled::-ms-input-placeholder, |
| .win-textarea:disabled::-ms-input-placeholder { |
| color: GrayText; |
| } |
| .win-textbox::-ms-clear, |
| .win-textbox::-ms-reveal { |
| background-color: ButtonFace; |
| color: ButtonText; |
| } |
| .win-textbox::-ms-clear:hover, |
| .win-textbox::-ms-reveal:hover { |
| color: Highlight; |
| } |
| .win-textbox::-ms-clear:active, |
| .win-textbox::-ms-reveal:active { |
| background-color: Highlight; |
| color: HighlightText; |
| } |
| .win-toggleswitch-header, |
| .win-toggleswitch-value { |
| color: HighlightText; |
| } |
| .win-toggleswitch-thumb { |
| background-color: HighlightText; |
| } |
| .win-toggleswitch-off .win-toggleswitch-track { |
| border-color: HighlightText; |
| } |
| .win-toggleswitch-pressed .win-toggleswitch-thumb { |
| background-color: HighlightText; |
| } |
| .win-toggleswitch-pressed .win-toggleswitch-track { |
| border-color: Highlight; |
| background-color: Highlight; |
| } |
| .win-toggleswitch-disabled .win-toggleswitch-header, |
| .win-toggleswitch-disabled .win-toggleswitch-value { |
| color: GrayText; |
| } |
| .win-toggleswitch-disabled .win-toggleswitch-thumb { |
| background-color: GrayText; |
| } |
| .win-toggleswitch-disabled .win-toggleswitch-track { |
| border-color: GrayText; |
| } |
| .win-toggleswitch-on .win-toggleswitch-thumb { |
| background-color: HighlightText; |
| } |
| .win-toggleswitch-on .win-toggleswitch-track { |
| border-color: HighlightText; |
| } |
| .win-toggleswitch-on.win-toggleswitch-pressed .win-toggleswitch-track { |
| background-color: Highlight; |
| } |
| .win-toggleswitch-on.win-toggleswitch-disabled .win-toggleswitch-thumb { |
| background-color: Background; |
| } |
| .win-toggleswitch-on.win-toggleswitch-disabled .win-toggleswitch-track { |
| background-color: GrayText; |
| } |
| /* Override Accent Color styles */ |
| .win-toggleswitch-on.win-toggleswitch-enabled:not(.win-toggleswitch-pressed) .win-toggleswitch-track { |
| background-color: Highlight; |
| } |
| .win-toggleswitch-on.win-toggleswitch-disabled .win-toggleswitch-track { |
| border-color: GrayText; |
| } |
| .win-toggleswitch-enabled .win-toggleswitch-clickregion:hover .win-toggleswitch-track { |
| border-color: Highlight; |
| } |
| .win-toggleswitch-off.win-toggleswitch-enabled:not(.win-toggleswitch-pressed) .win-toggleswitch-clickregion:hover .win-toggleswitch-thumb { |
| background-color: Highlight; |
| } |
| .win-pivot .win-pivot-title { |
| color: WindowText; |
| } |
| .win-pivot .win-pivot-navbutton { |
| background-color: Highlight; |
| color: HighlightText; |
| } |
| .win-pivot .win-pivot-navbutton.win-pivot-navbutton:hover:active { |
| color: HighlightText; |
| } |
| .win-pivot button.win-pivot-header { |
| color: HighlightText; |
| background-color: transparent; |
| } |
| .win-pivot button.win-pivot-header:focus, |
| .win-pivot button.win-pivot-header.win-pivot-header:hover:active { |
| color: HighlightText; |
| } |
| .win-pivot button.win-pivot-header.win-pivot-header-selected { |
| color: HighlightText; |
| background-color: Highlight; |
| } |
| .win-pivot-header[disabled] { |
| color: GrayText; |
| } |
| .win-overlay { |
| outline: none; |
| } |
| hr.win-command { |
| background-color: ButtonText; |
| } |
| div.win-command, |
| button.win-command { |
| border-color: transparent; |
| background-color: transparent; |
| } |
| div.win-command:hover:active, |
| button.win-command:hover:active { |
| border-color: transparent; |
| } |
| button:enabled.win-command.win-keyboard:focus, |
| div.win-command.win-keyboard:focus, |
| button:enabled.win-command.win-command.win-keyboard:hover:focus, |
| div.win-command.win-command.win-keyboard:hover:focus { |
| border-color: ButtonText; |
| } |
| .win-commandimage { |
| color: ButtonText; |
| } |
| button.win-command.win-command:enabled:hover:active, |
| button.win-command.win-command:enabled:active { |
| background-color: Highlight; |
| color: ButtonText; |
| } |
| button:enabled:hover:active .win-commandimage, |
| button:enabled:active .win-commandimage { |
| color: ButtonText; |
| } |
| button:disabled .win-commandimage, |
| button:disabled:active .win-commandimage { |
| color: GrayText; |
| } |
| button .win-label { |
| color: ButtonText; |
| } |
| button[aria-checked=true]:enabled .win-label, |
| button[aria-checked=true]:enabled .win-commandimage, |
| button[aria-checked=true]:enabled:hover:active .win-commandimage.win-commandimage { |
| color: ButtonText; |
| } |
| button[aria-checked=true]:-ms-keyboard-active .win-commandimage { |
| color: ButtonText; |
| } |
| button[aria-checked=true].win-command:before { |
| position: absolute; |
| height: 100%; |
| width: 100%; |
| opacity: 1; |
| box-sizing: content-box; |
| content: ""; |
| /* We want this pseudo element to cover the border of its parent. */ |
| /* Put a 1px border on this element to make it larger and then set its top/left to -1px.*/ |
| border-width: 1px; |
| border-style: solid; |
| top: -1px; |
| left: -1px; |
| } |
| button.win-command:enabled:-ms-keyboard-active { |
| background-color: Highlight; |
| color: ButtonText; |
| } |
| button[aria-checked=true].win-command:enabled:hover:active { |
| background-color: transparent; |
| } |
| button.win-command:disabled, |
| button.win-command:disabled:hover:active { |
| background-color: transparent; |
| border-color: transparent; |
| } |
| button.win-command:disabled .win-label, |
| button.win-command:disabled:active .win-label { |
| color: GrayText; |
| } |
| .win-navbar, |
| .win-navbar { |
| background-color: ButtonFace; |
| border-color: Highlight; |
| } |
| .win-navbar.win-menulayout .win-navbar-menu, |
| .win-navbar.win-menulayout .win-navbar-menu, |
| .win-navbar.win-menulayout .win-toolbar, |
| .win-navbar.win-menulayout .win-toolbar { |
| background-color: inherit; |
| } |
| .win-navbar button.win-navbar-invokebutton.win-navbar-invokebutton, |
| .win-navbar button.win-navbar-invokebutton.win-navbar-invokebutton { |
| background-color: transparent; |
| outline: none; |
| border-color: transparent; |
| } |
| .win-navbar button.win-navbar-invokebutton.win-navbar-invokebutton:enabled:-ms-keyboard-active, |
| .win-navbar button.win-navbar-invokebutton.win-navbar-invokebutton:enabled:-ms-keyboard-active { |
| background-color: transparent; |
| } |
| .win-navbar button.win-navbar-invokebutton.win-navbar-invokebutton:enabled .win-navbar-ellipsis, |
| .win-navbar button.win-navbar-invokebutton.win-navbar-invokebutton:enabled .win-navbar-ellipsis { |
| color: ButtonText; |
| } |
| .win-navbar button.win-navbar-invokebutton.win-navbar-invokebutton:enabled.win-keyboard:focus, |
| .win-navbar button.win-navbar-invokebutton.win-navbar-invokebutton:enabled.win-keyboard:focus { |
| border-color: ButtonText; |
| } |
| .win-navbar button.win-navbar-invokebutton.win-navbar-invokebutton:disabled:active, |
| .win-navbar button.win-navbar-invokebutton.win-navbar-invokebutton:disabled:active, |
| .win-navbar button.win-navbar-invokebutton.win-navbar-invokebutton:disabled:hover:active, |
| .win-navbar button.win-navbar-invokebutton.win-navbar-invokebutton:disabled:hover:active { |
| background-color: transparent; |
| } |
| .win-navbar button.win-navbar-invokebutton.win-navbar-invokebutton:disabled .win-navbar-ellipsis, |
| .win-navbar button.win-navbar-invokebutton.win-navbar-invokebutton:disabled .win-navbar-ellipsis { |
| color: GrayText; |
| } |
| .win-navbar.win-navbar-closing button.win-navbar-invokebutton.win-navbar-invokebutton:enabled:hover:active, |
| .win-navbar.win-navbar-closing button.win-navbar-invokebutton.win-navbar-invokebutton:enabled:hover:active, |
| .win-navbar.win-navbar-closed button.win-navbar-invokebutton.win-navbar-invokebutton:enabled:hover:active, |
| .win-navbar.win-navbar-closed button.win-navbar-invokebutton.win-navbar-invokebutton:enabled:hover:active, |
| .win-navbar.win-navbar-opening button.win-navbar-invokebutton.win-navbar-invokebutton:enabled:hover:active, |
| .win-navbar.win-navbar-opening button.win-navbar-invokebutton.win-navbar-invokebutton:enabled:hover:active, |
| .win-navbar.win-navbar-opened button.win-navbar-invokebutton.win-navbar-invokebutton:enabled:hover:active, |
| .win-navbar.win-navbar-opened button.win-navbar-invokebutton.win-navbar-invokebutton:enabled:hover:active { |
| background-color: Highlight; |
| } |
| .win-navbar.win-navbar-closing button.win-navbar-invokebutton.win-navbar-invokebutton:enabled:hover:active .win-navbar-ellipsis, |
| .win-navbar.win-navbar-closing button.win-navbar-invokebutton.win-navbar-invokebutton:enabled:hover:active .win-navbar-ellipsis, |
| .win-navbar.win-navbar-closed button.win-navbar-invokebutton.win-navbar-invokebutton:enabled:hover:active .win-navbar-ellipsis, |
| .win-navbar.win-navbar-closed button.win-navbar-invokebutton.win-navbar-invokebutton:enabled:hover:active .win-navbar-ellipsis, |
| .win-navbar.win-navbar-opening button.win-navbar-invokebutton.win-navbar-invokebutton:enabled:hover:active .win-navbar-ellipsis, |
| .win-navbar.win-navbar-opening button.win-navbar-invokebutton.win-navbar-invokebutton:enabled:hover:active .win-navbar-ellipsis, |
| .win-navbar.win-navbar-opened button.win-navbar-invokebutton.win-navbar-invokebutton:enabled:hover:active .win-navbar-ellipsis, |
| .win-navbar.win-navbar-opened button.win-navbar-invokebutton.win-navbar-invokebutton:enabled:hover:active .win-navbar-ellipsis { |
| color: ButtonText; |
| } |
| .win-flyout, |
| .win-flyout { |
| background-color: ButtonFace; |
| } |
| .win-settingsflyout { |
| background-color: ButtonFace; |
| } |
| .win-menu button, |
| .win-menu button { |
| background-color: transparent; |
| color: ButtonText; |
| } |
| .win-menu button.win-command.win-command:enabled:hover:active, |
| .win-menu button[aria-checked=true].win-command.win-command:enabled:hover:active { |
| background-color: Highlight; |
| color: ButtonText; |
| } |
| .win-menu-containsflyoutcommand button.win-command-flyout-activated:before, |
| .win-menu-containsflyoutcommand button.win-command-flyout-activated:before { |
| position: absolute; |
| height: 100%; |
| width: 100%; |
| opacity: 0.6; |
| content: ""; |
| box-sizing: content-box; |
| /* We want this pseudo element to cover the border of its parent. */ |
| /* Put a 1px border on this element to make it larger and then set its top/left to -1px.*/ |
| border-width: 1px; |
| border-style: solid; |
| top: -1px; |
| left: -1px; |
| } |
| .win-menu button[aria-checked=true].win-command:before, |
| .win-menu button[aria-checked=true].win-command:before { |
| background-color: transparent; |
| border-color: transparent; |
| } |
| .win-menu button:disabled, |
| .win-menu button:disabled, |
| .win-menu button:disabled:active, |
| .win-menu button:disabled:active { |
| background-color: transparent; |
| color: GrayText; |
| } |
| button[aria-checked=true].win-command:before { |
| border-color: Highlight; |
| background-color: Highlight; |
| } |
| .win-commandingsurface .win-commandingsurface-actionarea, |
| .win-commandingsurface .win-commandingsurface-actionarea { |
| background-color: ButtonFace; |
| } |
| .win-commandingsurface button.win-commandingsurface-overflowbutton, |
| .win-commandingsurface button.win-commandingsurface-overflowbutton { |
| background-color: ButtonFace; |
| border-color: transparent; |
| } |
| .win-commandingsurface button.win-commandingsurface-overflowbutton:enabled:-ms-keyboard-active, |
| .win-commandingsurface button.win-commandingsurface-overflowbutton:enabled:-ms-keyboard-active { |
| background-color: ButtonFace; |
| } |
| .win-commandingsurface button.win-commandingsurface-overflowbutton:enabled .win-commandingsurface-ellipsis, |
| .win-commandingsurface button.win-commandingsurface-overflowbutton:enabled .win-commandingsurface-ellipsis { |
| color: ButtonText; |
| } |
| .win-commandingsurface button.win-commandingsurface-overflowbutton.win-keyboard:focus, |
| .win-commandingsurface button.win-commandingsurface-overflowbutton.win-keyboard:focus { |
| border-color: ButtonText; |
| } |
| .win-commandingsurface .win-commandingsurface-overflowarea, |
| .win-commandingsurface .win-commandingsurface-overflowarea { |
| background-color: ButtonFace; |
| } |
| .win-commandingsurface button.win-commandingsurface-overflowbutton.win-commandingsurface-overflowbutton:hover:active, |
| .win-commandingsurface button.win-commandingsurface-overflowbutton.win-commandingsurface-overflowbutton:hover:active { |
| background-color: Highlight; |
| } |
| .win-commandingsurface .win-commandingsurface-overflowarea button:enabled.win-command:hover:active, |
| .win-commandingsurface .win-commandingsurface-overflowarea button:enabled.win-command:hover:active { |
| color: ButtonText; |
| background-color: Highlight; |
| } |
| .win-commandingsurface.win-commandingsurface-opened .win-commandingsurface-insetoutline { |
| display: block; |
| /* The element is only used to draw a border inside of the edges of its parent element without displacing content. */ |
| border: solid 1px ButtonText; |
| pointer-events: none; |
| background-color: transparent; |
| z-index: 1; |
| position: absolute; |
| top: 0px; |
| left: 0px; |
| height: calc(100% - 2px); |
| width: calc(100% - 2px); |
| } |
| .win-commandingsurface.win-commandingsurface-closed .win-commandingsurface-insetoutline, |
| .win-commandingsurface.win-commandingsurface-closing .win-commandingsurface-insetoutline, |
| .win-commandingsurface.win-commandingsurface-opening .win-commandingsurface-insetoutline { |
| display: none; |
| } |
| .win-contentdialog-dialog { |
| background-color: Window; |
| } |
| .win-contentdialog-title { |
| color: WindowText; |
| } |
| .win-contentdialog-content { |
| color: WindowText; |
| } |
| .win-contentdialog-backgroundoverlay { |
| background-color: Window; |
| opacity: 0.6; |
| } |
| .win-splitview-pane { |
| background-color: ButtonFace; |
| } |
| .win-splitview.win-splitview-pane-opened .win-splitview-paneoutline { |
| display: block; |
| border-color: ButtonText; |
| } |
| .win-splitview.win-splitview-animating .win-splitview-paneoutline { |
| display: none; |
| } |
| button.win-splitviewpanetoggle { |
| color: ButtonText; |
| background-color: transparent; |
| } |
| button.win-splitviewpanetoggle:active, |
| button.win-splitviewpanetoggle.win-splitviewpanetoggle:active:hover { |
| color: ButtonText; |
| background-color: Highlight; |
| } |
| button.win-splitviewpanetoggle.win-keyboard:focus { |
| border: 1px dotted ButtonText; |
| } |
| button.win-splitviewpanetoggle:disabled, |
| button.win-splitviewpanetoggle:disabled:active, |
| button.win-splitviewpanetoggle.win-splitviewpanetoggle:disabled:hover { |
| color: GrayText; |
| background-color: transparent; |
| } |
| html.win-hoverable { |
| /* LegacyAppBar control colors */ |
| } |
| html.win-hoverable.win-navbar button.win-navbar-invokebutton:enabled:hover, |
| html.win-hoverable .win-navbar button.win-navbar-invokebutton:enabled:hover, |
| html.win-hoverable.win-navbar button.win-navbar-invokebutton:disabled:hover, |
| html.win-hoverable .win-navbar button.win-navbar-invokebutton:disabled:hover { |
| background-color: transparent; |
| } |
| html.win-hoverable.win-navbar.win-navbar-opening button.win-navbar-invokebutton:enabled:hover, |
| html.win-hoverable .win-navbar.win-navbar-opening button.win-navbar-invokebutton:enabled:hover, |
| html.win-hoverable.win-navbar.win-navbar-opened button.win-navbar-invokebutton:enabled:hover, |
| html.win-hoverable .win-navbar.win-navbar-opened button.win-navbar-invokebutton:enabled:hover { |
| background-color: Highlight; |
| } |
| html.win-hoverable.win-navbar.win-navbar-opening button.win-navbar-invokebutton:enabled:hover .win-navbar-ellipsis, |
| html.win-hoverable .win-navbar.win-navbar-opening button.win-navbar-invokebutton:enabled:hover .win-navbar-ellipsis, |
| html.win-hoverable.win-navbar.win-navbar-opened button.win-navbar-invokebutton:enabled:hover .win-navbar-ellipsis, |
| html.win-hoverable .win-navbar.win-navbar-opened button.win-navbar-invokebutton:enabled:hover .win-navbar-ellipsis { |
| color: HighlightText; |
| } |
| html.win-hoverable.win-navbar.win-navbar-closing button.win-navbar-invokebutton:enabled:hover, |
| html.win-hoverable .win-navbar.win-navbar-closing button.win-navbar-invokebutton:enabled:hover, |
| html.win-hoverable.win-navbar.win-navbar-closed button.win-navbar-invokebutton:enabled:hover, |
| html.win-hoverable .win-navbar.win-navbar-closed button.win-navbar-invokebutton:enabled:hover { |
| background-color: Highlight; |
| } |
| html.win-hoverable.win-navbar.win-navbar-closing button.win-navbar-invokebutton:enabled:hover .win-navbar-ellipsis, |
| html.win-hoverable .win-navbar.win-navbar-closing button.win-navbar-invokebutton:enabled:hover .win-navbar-ellipsis, |
| html.win-hoverable.win-navbar.win-navbar-closed button.win-navbar-invokebutton:enabled:hover .win-navbar-ellipsis, |
| html.win-hoverable .win-navbar.win-navbar-closed button.win-navbar-invokebutton:enabled:hover .win-navbar-ellipsis { |
| color: HighlightText; |
| } |
| html.win-hoverable button.win-command:enabled:hover { |
| background-color: Highlight; |
| color: HighlightText; |
| } |
| html.win-hoverable button.win-command:enabled:hover .win-commandglyph { |
| color: HighlightText; |
| } |
| html.win-hoverable .win-menu button.win-command:enabled:hover { |
| background-color: Highlight; |
| color: HighlightText; |
| } |
| html.win-hoverable button[aria-checked=true].win-command:hover { |
| background-color: transparent; |
| } |
| html.win-hoverable button:enabled[aria-checked=true].win-command:hover:before { |
| opacity: 1; |
| } |
| html.win-hoverable button:enabled[aria-checked=true].win-command:hover:active:before { |
| opacity: 1; |
| } |
| html.win-hoverable.win-commandingsurface button.win-commandingsurface-overflowbutton:hover, |
| html.win-hoverable .win-commandingsurface button.win-commandingsurface-overflowbutton:hover, |
| html.win-hoverable.win-commandingsurface .win-commandingsurface-overflowarea button.win-command:hover, |
| html.win-hoverable .win-commandingsurface .win-commandingsurface-overflowarea button.win-command:hover { |
| background-color: Highlight; |
| } |
| html.win-hoverable.win-commandingsurface button.win-commandingsurface-overflowbutton:hover .win-commandingsurface-ellipsis, |
| html.win-hoverable .win-commandingsurface button.win-commandingsurface-overflowbutton:hover .win-commandingsurface-ellipsis { |
| color: HighlightText; |
| } |
| html.win-hoverable button.win-splitviewpanetoggle:hover { |
| color: ButtonText; |
| background-color: Highlight; |
| } |
| } |