| #wheel{position:relative;height:100%;display:-webkit-flex;display:-ms-flexbox;display:flex;-webkit-flex-direction:row;-ms-flex-direction:row;flex-direction:row;-webkit-justify-content:center;-ms-flex-pack:center;justify-content:center;-webkit-align-items:center;-ms-flex-align:center;align-items:center}.is-small-screen .mdl-gen #wheel{min-height:100vw}#wheel svg{width:100%;height:100%}@media (min-width:840px){#wheel svg{max-width:100%;width:100%}}#wheel .mdl-gen-download{position:absolute;left:50%;top:50%}#wheel .mdl-gen-download .mdl-button{-webkit-transform:translate(-50%,-50%);transform:translate(-50%,-50%)}#wheel g[data-color]{opacity:1;transition:opacity .2s cubic-bezier(.4,0,1,1)}#wheel .selector{opacity:0;transition:opacity .4s cubic-bezier(.4,0,1,1);fill:#BDBDBD}#wheel .selected .selector{opacity:1}#wheel .label{text-anchor:middle;opacity:0;transition:opacity .4s cubic-bezier(.4,0,1,1);fill:#fff;font-size:24px}#wheel .selected--1 .label--1,#wheel .selected--2 .label--2{opacity:1}#wheel svg.hide-nonaccents g[data-color="Blue Grey"]:not(.selected),#wheel svg.hide-nonaccents g[data-color="Brown"]:not(.selected),#wheel svg.hide-nonaccents g[data-color="Grey"]:not(.selected){opacity:.12}#wheel .selected{opacity:1!important}.mdl-gen>.mdl-grid{max-width:1280px;padding:0}.mdl-gen__preview{position:relative;height:350px}.mdl-gen__preview .mdl-layout__container{height:auto}.mdl-gen__preview .mdl-layout__content{padding:32px;background-color:#EFEFEF;display:-webkit-flex;display:-ms-flexbox;display:flex;-webkit-flex-direction:column;-ms-flex-direction:column;flex-direction:column;-webkit-justify-content:flex-start;-ms-flex-pack:start;justify-content:flex-start;-webkit-align-items:flex-start;-ms-flex-align:start;align-items:flex-start}.mdl-gen__preview .mdl-layout__content .mdl-button{margin:0}.mdl-gen__preview .mdl-layout__content .mdl-button--fab{-webkit-align-self:flex-end;-ms-flex-item-align:end;align-self:flex-end}.mdl-gen__preview .mdl-layout__content h3{margin-top:0}.mdl-gen__panel--right{display:-webkit-flex;display:-ms-flexbox;display:flex;-webkit-flex-direction:column;-ms-flex-direction:column;flex-direction:column;-webkit-align-items:stretch;-ms-flex-align:stretch;align-items:stretch;-webkit-justify-content:center;-ms-flex-pack:center;justify-content:center;padding-bottom:0}.mdl-gen__desc strong,.mdl-gen__desc p{display:block;margin-bottom:32px;color:rgba(0,0,0,.54)}.mdl-gen__cdn .demo-code{box-sizing:border-box}.content{margin-left:auto;margin-right:auto;max-width:1280px;margin-bottom:80px} |