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