app-base-react/css/generator/atom.css

react development common base package.

.fr-generator-container .outline{outline:solid 1px}.fr-generator-container .outline-transparent{outline:transparent solid 1px}.fr-generator-container .outline-0{outline:0}.fr-generator-container .ba{border-style:solid;border-width:1px}.fr-generator-container .bt{border-top-style:solid;border-top-width:1px}.fr-generator-container .br{border-right-style:solid;border-right-width:1px}.fr-generator-container .bb{border-bottom-style:solid;border-bottom-width:1px}.fr-generator-container .bl{border-left-style:solid;border-left-width:1px}.fr-generator-container .bn{border-style:none;border-width:0}.fr-generator-container .br0{border-radius:0}.fr-generator-container .br1{border-radius:.125rem}.fr-generator-container .br2{border-radius:.25rem}.fr-generator-container .br3{border-radius:.5rem}.fr-generator-container .br4{border-radius:1rem}.fr-generator-container .br-100{border-radius:100%}.fr-generator-container .br-pill{border-radius:9999px}.fr-generator-container .br--bottom{border-top-left-radius:0;border-top-right-radius:0}.fr-generator-container .br--top{border-bottom-left-radius:0;border-bottom-right-radius:0}.fr-generator-container .br--right{border-top-left-radius:0;border-bottom-left-radius:0}.fr-generator-container .br--left{border-top-right-radius:0;border-bottom-right-radius:0}.fr-generator-container .b--dotted{border-style:dotted}.fr-generator-container .b--dashed{border-style:dashed}.fr-generator-container .b--solid{border-style:solid}.fr-generator-container .b--none{border-style:none}.fr-generator-container .b--black-10{border-color:rgba(0,0,0,.1)}.fr-generator-container .b--black-20{border-color:rgba(0,0,0,.2)}.fr-generator-container .b--black-30{border-color:rgba(0,0,0,.3)}.fr-generator-container .black-40{color:rgba(0,0,0,.4)}.fr-generator-container .f4{font-size:1.25rem}.fr-generator-container .bw0{border-width:0}.fr-generator-container .bw1{border-width:.125rem}.fr-generator-container .bw2{border-width:.25rem}.fr-generator-container .bw3{border-width:.5rem}.fr-generator-container .bw4{border-width:1rem}.fr-generator-container .bw5{border-width:2rem}.fr-generator-container .bt-0{border-top-width:0}.fr-generator-container .br-0{border-right-width:0}.fr-generator-container .bb-0{border-bottom-width:0}.fr-generator-container .bl-0{border-left-width:0}.fr-generator-container .shadow-1{-webkit-box-shadow:0 0 4px 2px rgba(0,0,0,.2);box-shadow:0 0 4px 2px rgba(0,0,0,.2)}.fr-generator-container .shadow-2{-webkit-box-shadow:0 0 8px 2px rgba(0,0,0,.2);box-shadow:0 0 8px 2px rgba(0,0,0,.2)}.fr-generator-container .shadow-3{-webkit-box-shadow:2px 2px 4px 2px rgba(0,0,0,.2);box-shadow:2px 2px 4px 2px rgba(0,0,0,.2)}.fr-generator-container .shadow-4{-webkit-box-shadow:2px 2px 8px 0 rgba(0,0,0,.2);box-shadow:2px 2px 8px 0 rgba(0,0,0,.2)}.fr-generator-container .shadow-5{-webkit-box-shadow:4px 4px 8px 0 rgba(0,0,0,.2);box-shadow:4px 4px 8px 0 rgba(0,0,0,.2)}.fr-generator-container .top-0{top:0}.fr-generator-container .right-0{right:0}.fr-generator-container .bottom-0{bottom:0}.fr-generator-container .left-0{left:0}.fr-generator-container .top-1{top:1rem}.fr-generator-container .right-1{right:1rem}.fr-generator-container .bottom-1{bottom:1rem}.fr-generator-container .left-1{left:1rem}.fr-generator-container .top-2{top:2rem}.fr-generator-container .right-2{right:2rem}.fr-generator-container .bottom-2{bottom:2rem}.fr-generator-container .left-2{left:2rem}.fr-generator-container .top--1{top:-1rem}.fr-generator-container .right--1{right:-1rem}.fr-generator-container .bottom--1{bottom:-1rem}.fr-generator-container .left--1{left:-1rem}.fr-generator-container .top--2{top:-2rem}.fr-generator-container .right--2{right:-2rem}.fr-generator-container .bottom--2{bottom:-2rem}.fr-generator-container .left--2{left:-2rem}.fr-generator-container .absolute--fill{top:0;right:0;bottom:0;left:0}.fr-generator-container .dn{display:none}.fr-generator-container .di{display:inline}.fr-generator-container .db{display:block}.fr-generator-container .dib{display:inline-block}.fr-generator-container .dit{display:inline-table}.fr-generator-container .dt{display:table}.fr-generator-container .dtc{display:table-cell}.fr-generator-container .dt-row{display:table-row}.fr-generator-container .dt-row-group{display:table-row-group}.fr-generator-container .dt-column{display:table-column}.fr-generator-container .dt-column-group{display:table-column-group}.fr-generator-container .dt--fixed{table-layout:fixed;width:100%}.fr-generator-container .flex{display:-webkit-box;display:-ms-flexbox;display:flex}.fr-generator-container .inline-flex{display:-webkit-inline-box;display:-ms-inline-flexbox;display:inline-flex}.fr-generator-container .flex-auto{-webkit-box-flex:1;-ms-flex:1 1 auto;flex:1 1 auto;min-width:0;min-height:0}.fr-generator-container .flex-none{-webkit-box-flex:0;-ms-flex:none;flex:none}.fr-generator-container .flex-column{-webkit-box-orient:vertical;-webkit-box-direction:normal;-ms-flex-direction:column;flex-direction:column}.fr-generator-container .flex-row{-webkit-box-orient:horizontal;-webkit-box-direction:normal;-ms-flex-direction:row;flex-direction:row}.fr-generator-container .flex-wrap{-ms-flex-wrap:wrap;flex-wrap:wrap}.fr-generator-container .flex-nowrap{-ms-flex-wrap:nowrap;flex-wrap:nowrap}.fr-generator-container .flex-wrap-reverse{-ms-flex-wrap:wrap-reverse;flex-wrap:wrap-reverse}.fr-generator-container .flex-column-reverse{-webkit-box-orient:vertical;-webkit-box-direction:reverse;-ms-flex-direction:column-reverse;flex-direction:column-reverse}.fr-generator-container .flex-row-reverse{-webkit-box-orient:horizontal;-webkit-box-direction:reverse;-ms-flex-direction:row-reverse;flex-direction:row-reverse}.fr-generator-container .items-start{-webkit-box-align:start;-ms-flex-align:start;align-items:flex-start}.fr-generator-container .items-end{-webkit-box-align:end;-ms-flex-align:end;align-items:flex-end}.fr-generator-container .items-center{-webkit-box-align:center;-ms-flex-align:center;align-items:center}.fr-generator-container .items-baseline{-webkit-box-align:baseline;-ms-flex-align:baseline;align-items:baseline}.fr-generator-container .items-stretch{-webkit-box-align:stretch;-ms-flex-align:stretch;align-items:stretch}.fr-generator-container .self-start{-ms-flex-item-align:start;align-self:flex-start}.fr-generator-container .self-end{-ms-flex-item-align:end;align-self:flex-end}.fr-generator-container .self-center{-ms-flex-item-align:center;align-self:center}.fr-generator-container .self-baseline{-ms-flex-item-align:baseline;align-self:baseline}.fr-generator-container .self-stretch{-ms-flex-item-align:stretch;align-self:stretch}.fr-generator-container .justify-start{-webkit-box-pack:start;-ms-flex-pack:start;justify-content:flex-start}.fr-generator-container .justify-end{-webkit-box-pack:end;-ms-flex-pack:end;justify-content:flex-end}.fr-generator-container .justify-center{-webkit-box-pack:center;-ms-flex-pack:center;justify-content:center}.fr-generator-container .justify-between{-webkit-box-pack:justify;-ms-flex-pack:justify;justify-content:space-between}.fr-generator-container .justify-around{-ms-flex-pack:distribute;justify-content:space-around}.fr-generator-container .content-start{-ms-flex-line-pack:start;align-content:flex-start}.fr-generator-container .content-end{-ms-flex-line-pack:end;align-content:flex-end}.fr-generator-container .content-center{-ms-flex-line-pack:center;align-content:center}.fr-generator-container .content-between{-ms-flex-line-pack:justify;align-content:space-between}.fr-generator-container .content-around{-ms-flex-line-pack:distribute;align-content:space-around}.fr-generator-container .content-stretch{-ms-flex-line-pack:stretch;align-content:stretch}.fr-generator-container .order-0{-webkit-box-ordinal-group:1;-ms-flex-order:0;order:0}.fr-generator-container .order-1{-webkit-box-ordinal-group:2;-ms-flex-order:1;order:1}.fr-generator-container .order-2{-webkit-box-ordinal-group:3;-ms-flex-order:2;order:2}.fr-generator-container .order-3{-webkit-box-ordinal-group:4;-ms-flex-order:3;order:3}.fr-generator-container .order-4{-webkit-box-ordinal-group:5;-ms-flex-order:4;order:4}.fr-generator-container .order-5{-webkit-box-ordinal-group:6;-ms-flex-order:5;order:5}.fr-generator-container .order-6{-webkit-box-ordinal-group:7;-ms-flex-order:6;order:6}.fr-generator-container .order-7{-webkit-box-ordinal-group:8;-ms-flex-order:7;order:7}.fr-generator-container .order-8{-webkit-box-ordinal-group:9;-ms-flex-order:8;order:8}.fr-generator-container .order-last{-webkit-box-ordinal-group:100000;-ms-flex-order:99999;order:99999}.fr-generator-container .flex-grow-0{-webkit-box-flex:0;-ms-flex-positive:0;flex-grow:0}.fr-generator-container .flex-grow-1{-webkit-box-flex:1;-ms-flex-positive:1;flex-grow:1}.fr-generator-container .flex-shrink-0{-ms-flex-negative:0;flex-shrink:0}.fr-generator-container .flex-shrink-1{-ms-flex-negative:1;flex-shrink:1}.fr-generator-container .fw1{font-weight:100}.fr-generator-container .fw2{font-weight:200}.fr-generator-container .fw3{font-weight:300}.fr-generator-container .fw4{font-weight:400}.fr-generator-container .fw5{font-weight:500}.fr-generator-container .fw6{font-weight:600}.fr-generator-container .fw7{font-weight:700}.fr-generator-container .fw8{font-weight:800}.fr-generator-container .fw9{font-weight:900}.fr-generator-container .h1{height:1rem}.fr-generator-container .h2{height:2rem}.fr-generator-container .h3{height:4rem}.fr-generator-container .h4{height:8rem}.fr-generator-container .h5{height:16rem}.fr-generator-container .h-25{height:25%}.fr-generator-container .h-50{height:50%}.fr-generator-container .h-75{height:75%}.fr-generator-container .h-100{height:100%}.fr-generator-container .min-h-100{min-height:100%}.fr-generator-container .vh-25{height:25vh}.fr-generator-container .vh-50{height:50vh}.fr-generator-container .vh-75{height:75vh}.fr-generator-container .vh-100{height:100vh}.fr-generator-container .min-vh-100{min-height:100vh}.fr-generator-container .h-auto{height:auto}.fr-generator-container .h-inherit{height:inherit}.fr-generator-container .tracked{letter-spacing:.1em}.fr-generator-container .tracked-tight{letter-spacing:-.05em}.fr-generator-container .tracked-mega{letter-spacing:.25em}.fr-generator-container .lh-solid{line-height:1}.fr-generator-container .lh-title{line-height:1.25}.fr-generator-container .lh-copy{line-height:1.5}.fr-generator-container .mw-100{max-width:100%}.fr-generator-container .mw1{max-width:1rem}.fr-generator-container .mw2{max-width:2rem}.fr-generator-container .mw3{max-width:4rem}.fr-generator-container .mw4{max-width:8rem}.fr-generator-container .mw5{max-width:16rem}.fr-generator-container .mw6{max-width:32rem}.fr-generator-container .mw7{max-width:48rem}.fr-generator-container .mw8{max-width:64rem}.fr-generator-container .mw9{max-width:96rem}.fr-generator-container .mw-none{max-width:none}.fr-generator-container .w1{width:1rem}.fr-generator-container .w2{width:2rem}.fr-generator-container .w3{width:4rem}.fr-generator-container .w4{width:8rem}.fr-generator-container .w5{width:16rem}.fr-generator-container .w-10{width:10%}.fr-generator-container .w-20{width:20%}.fr-generator-container .w-25{width:25%}.fr-generator-container .w-30{width:30%}.fr-generator-container .w-33{width:33%}.fr-generator-container .w-34{width:34%}.fr-generator-container .w-40{width:40%}.fr-generator-container .w-50{width:50%}.fr-generator-container .w-60{width:60%}.fr-generator-container .w-70{width:70%}.fr-generator-container .w-75{width:75%}.fr-generator-container .w-80{width:80%}.fr-generator-container .w-90{width:90%}.fr-generator-container .w-100{width:100%}.fr-generator-container .w-third{width:33.3333333333%}.fr-generator-container .w-two-thirds{width:66.6666666667%}.fr-generator-container .w-auto{width:auto}.fr-generator-container .tl{text-align:left}.fr-generator-container .tr{text-align:right}.fr-generator-container .tc{text-align:center}.fr-generator-container .tj{text-align:justify}.fr-generator-container .overflow-visible{overflow:visible}.fr-generator-container .overflow-hidden{overflow:hidden}.fr-generator-container .overflow-scroll{overflow:scroll}.fr-generator-container .overflow-auto{overflow:auto}.fr-generator-container .overflow-x-visible{overflow-x:visible}.fr-generator-container .overflow-x-hidden{overflow-x:hidden}.fr-generator-container .overflow-x-scroll{overflow-x:scroll}.fr-generator-container .overflow-x-auto{overflow-x:auto}.fr-generator-container .overflow-y-visible{overflow-y:visible}.fr-generator-container .overflow-y-hidden{overflow-y:hidden}.fr-generator-container .overflow-y-scroll{overflow-y:scroll}.fr-generator-container .overflow-y-auto{overflow-y:auto}.fr-generator-container .static{position:static}.fr-generator-container .relative{position:relative}.fr-generator-container .absolute{position:absolute}.fr-generator-container .fixed{position:fixed}.fr-generator-container .o-100{opacity:1}.fr-generator-container .o-90{opacity:.9}.fr-generator-container .o-80{opacity:.8}.fr-generator-container .o-70{opacity:.7}.fr-generator-container .o-60{opacity:.6}.fr-generator-container .o-50{opacity:.5}.fr-generator-container .o-40{opacity:.4}.fr-generator-container .o-30{opacity:.3}.fr-generator-container .o-20{opacity:.2}.fr-generator-container .o-10{opacity:.1}.fr-generator-container .o-05{opacity:.05}.fr-generator-container .o-025{opacity:.025}.fr-generator-container .o-0{opacity:0}.fr-generator-container .pa0{padding:0}.fr-generator-container .pa1{padding:.25rem}.fr-generator-container .pa2{padding:.5rem}.fr-generator-container .pa3{padding:1rem}.fr-generator-container .pa4{padding:2rem}.fr-generator-container .pa5{padding:4rem}.fr-generator-container .pa6{padding:8rem}.fr-generator-container .pa7{padding:16rem}.fr-generator-container .pl0{padding-left:0}.fr-generator-container .pl1{padding-left:.25rem}.fr-generator-container .pl2{padding-left:.5rem}.fr-generator-container .pl3{padding-left:1rem}.fr-generator-container .pl4{padding-left:2rem}.fr-generator-container .pl5{padding-left:4rem}.fr-generator-container .pl6{padding-left:8rem}.fr-generator-container .pl7{padding-left:16rem}.fr-generator-container .pr0{padding-right:0}.fr-generator-container .pr1{padding-right:.25rem}.fr-generator-container .pr2{padding-right:.5rem}.fr-generator-container .pr3{padding-right:1rem}.fr-generator-container .pr4{padding-right:2rem}.fr-generator-container .pr5{padding-right:4rem}.fr-generator-container .pr6{padding-right:8rem}.fr-generator-container .pr7{padding-right:16rem}.fr-generator-container .pb0{padding-bottom:0}.fr-generator-container .pb1{padding-bottom:.25rem}.fr-generator-container .pb2{padding-bottom:.5rem}.fr-generator-container .pb3{padding-bottom:1rem}.fr-generator-container .pb4{padding-bottom:2rem}.fr-generator-container .pb5{padding-bottom:4rem}.fr-generator-container .pb6{padding-bottom:8rem}.fr-generator-container .pb7{padding-bottom:16rem}.fr-generator-container .pt0{padding-top:0}.fr-generator-container .pt1{padding-top:.25rem}.fr-generator-container .pt2{padding-top:.5rem}.fr-generator-container .pt3{padding-top:1rem}.fr-generator-container .pt4{padding-top:2rem}.fr-generator-container .pt5{padding-top:4rem}.fr-generator-container .pt6{padding-top:8rem}.fr-generator-container .pt7{padding-top:16rem}.fr-generator-container .pv0{padding-top:0;padding-bottom:0}.fr-generator-container .pv1{padding-top:.25rem;padding-bottom:.25rem}.fr-generator-container .pv2{padding-top:.5rem;padding-bottom:.5rem}.fr-generator-container .pv3{padding-top:1rem;padding-bottom:1rem}.fr-generator-container .pv4{padding-top:2rem;padding-bottom:2rem}.fr-generator-container .pv5{padding-top:4rem;padding-bottom:4rem}.fr-generator-container .pv6{padding-top:8rem;padding-bottom:8rem}.fr-generator-container .pv7{padding-top:16rem;padding-bottom:16rem}.fr-generator-container .ph0{padding-left:0;padding-right:0}.fr-generator-container .ph1{padding-left:.25rem;padding-right:.25rem}.fr-generator-container .ph2{padding-left:.5rem;padding-right:.5rem}.fr-generator-container .ph3{padding-left:1rem;padding-right:1rem}.fr-generator-container .ph4{padding-left:2rem;padding-right:2rem}.fr-generator-container .ph5{padding-left:4rem;padding-right:4rem}.fr-generator-container .ph6{padding-left:8rem;padding-right:8rem}.fr-generator-container .ph7{padding-left:16rem;padding-right:16rem}.fr-generator-container .ma1{margin:.25rem}.fr-generator-container .ma2{margin:.5rem}.fr-generator-container .ma3{margin:1rem}.fr-generator-container .ma4{margin:2rem}.fr-generator-container .ma5{margin:4rem}.fr-generator-container .ma6{margin:8rem}.fr-generator-container .ma7{margin:16rem}.fr-generator-container .ma0{margin:0}.fr-generator-container .ml1{margin-left:.25rem}.fr-generator-container .ml2{margin-left:.5rem}.fr-generator-container .ml3{margin-left:1rem}.fr-generator-container .ml4{margin-left:2rem}.fr-generator-container .ml5{margin-left:4rem}.fr-generator-container .ml6{margin-left:8rem}.fr-generator-container .ml7{margin-left:16rem}.fr-generator-container .ml0{margin-left:0}.fr-generator-container .mr1{margin-right:.25rem}.fr-generator-container .mr2{margin-right:.5rem}.fr-generator-container .mr3{margin-right:1rem}.fr-generator-container .mr4{margin-right:2rem}.fr-generator-container .mr5{margin-right:4rem}.fr-generator-container .mr6{margin-right:8rem}.fr-generator-container .mr7{margin-right:16rem}.fr-generator-container .mr0{margin-right:0}.fr-generator-container .mb1{margin-bottom:.25rem}.fr-generator-container .mb2{margin-bottom:.5rem}.fr-generator-container .mb3{margin-bottom:1rem}.fr-generator-container .mb4{margin-bottom:2rem}.fr-generator-container .mb5{margin-bottom:4rem}.fr-generator-container .mb6{margin-bottom:8rem}.fr-generator-container .mb7{margin-bottom:16rem}.fr-generator-container .mb0{margin-bottom:0}.fr-generator-container .mt1{margin-top:.25rem}.fr-generator-container .mt2{margin-top:.5rem}.fr-generator-container .mt3{margin-top:1rem}.fr-generator-container .mt4{margin-top:2rem}.fr-generator-container .mt5{margin-top:4rem}.fr-generator-container .mt6{margin-top:8rem}.fr-generator-container .mt7{margin-top:16rem}.fr-generator-container .mt0{margin-top:0}.fr-generator-container .mv1{margin-top:.25rem;margin-bottom:.25rem}.fr-generator-container .mv2{margin-top:.5rem;margin-bottom:.5rem}.fr-generator-container .mv3{margin-top:1rem;margin-bottom:1rem}.fr-generator-container .mv4{margin-top:2rem;margin-bottom:2rem}.fr-generator-container .mv5{margin-top:4rem;margin-bottom:4rem}.fr-generator-container .mv6{margin-top:8rem;margin-bottom:8rem}.fr-generator-container .mv7{margin-top:16rem;margin-bottom:16rem}.fr-generator-container .mv0{margin-top:0;margin-bottom:0}.fr-generator-container .mh1{margin-left:.25rem;margin-right:.25rem}.fr-generator-container .mh2{margin-left:.5rem;margin-right:.5rem}.fr-generator-container .mh3{margin-left:1rem;margin-right:1rem}.fr-generator-container .mh4{margin-left:2rem;margin-right:2rem}.fr-generator-container .mh5{margin-left:4rem;margin-right:4rem}.fr-generator-container .mh6{margin-left:8rem;margin-right:8rem}.fr-generator-container .mh7{margin-left:16rem;margin-right:16rem}.fr-generator-container .mh0{margin-left:0;margin-right:0}.fr-generator-container .red{color:red}.fr-generator-container .blue{color:#357edd}.fr-generator-container .f7{font-size:.75rem}.fr-generator-container .debug *{outline:gold solid 1px}.fr-generator-container .debug-white *{outline:#fff solid 1px}.fr-generator-container .debug-black *{outline:#000 solid 1px}.fr-generator-container .debug-grid{background:url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAgAAAAICAYAAADED76LAAAAFElEQVR4AWPAC97/9x0eCsAEPgwAVLshdpENIxcAAAAASUVORK5CYII=) top left}.fr-generator-container .truncate{white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.fr-generator-container .bg-white{background-color:#fff}.fr-generator-container .pointer:hover{cursor:pointer}.fr-generator-container .link{color:#1890ff;font-size:14px}.fr-generator-container .link:hover{color:#40a9ff;font-size:14px}@media screen and (min-width:60em){.fr-generator-container .w5-l{width:16rem}}