sui-framework/packages/components.form/docs/public/styles.css

Open source Frontend Framework

html,body,div,span,applet,object,iframe,h1,h2,h3,h4,h5,h6,p,blockquote,pre,a,abbr,acronym,address,big,cite,code,del,dfn,em,img,ins,kbd,q,s,samp,small,strike,strong,sub,sup,tt,var,b,u,i,center,dl,dt,dd,ol,ul,li,fieldset,form,label,legend,table,caption,tbody,tfoot,thead,tr,th,td,article,aside,canvas,details,embed,figure,figcaption,footer,header,hgroup,menu,nav,output,ruby,section,summary,time,mark,audio,video{margin:0;padding:0;border:0;font-size:100%;font:inherit;vertical-align:baseline}article,aside,details,figcaption,figure,footer,header,hgroup,menu,nav,section{display:block}body{line-height:1}ol,ul{list-style:none}blockquote,q{quotes:none}blockquote:before,blockquote:after,q:before,q:after{content:'';content:none}table{border-collapse:collapse;border-spacing:0}textarea{resize:none}html{font-family:sans-serif;-webkit-text-size-adjust:100%;-ms-text-size-adjust:100%;text-size-adjust:100%}@font-face{font-family:Lato-Regular;font-style:normal;font-weight:normal;src:url("fonts/Lato-Regular.eot");src:url("fonts/Lato-Regular.eot?#iefix") format("embedded-opentype"),url("fonts/Lato-Regular.woff2") format("woff2"),url("fonts/Lato-Regular.woff") format("woff"),url("fonts/Lato-Regular.ttf") format("truetype"),url("fonts/Lato-Regular.svg#latoregular") format("svg")}@font-face{font-family:Lato-Bold;font-style:normal;font-weight:normal;src:url("fonts/Lato-Bold.eot");src:url("fonts/Lato-Bold.eot?#iefix") format("embedded-opentype"),url("fonts/Lato-Bold.woff2") format("woff2"),url("fonts/Lato-Bold.woff") format("woff"),url("fonts/Lato-Bold.ttf") format("truetype"),url("fonts/Lato-Bold.svg#latoregular") format("svg")}@font-face{font-family:Lato-Bold-Italic;font-style:normal;font-weight:normal;src:url("fonts/Lato-Bold-Italic.eot");src:url("fonts/Lato-Bold-Italic.eot?#iefix") format("embedded-opentype"),url("fonts/Lato-Bold-Italic.woff2") format("woff2"),url("fonts/Lato-Bold-Italic.woff") format("woff"),url("fonts/Lato-Bold-Italic.ttf") format("truetype"),url("fonts/Lato-Bold-Italic.svg#latoregular") format("svg")}@font-face{font-family:Lato-Italic;font-style:normal;font-weight:normal;src:url("fonts/Lato-Italic.eot");src:url("fonts/Lato-Italic.eot?#iefix") format("embedded-opentype"),url("fonts/Lato-Italic.woff2") format("woff2"),url("fonts/Lato-Italic.woff") format("woff"),url("fonts/Lato-Italic.ttf") format("truetype"),url("fonts/Lato-Italic.svg#latoregular") format("svg")}html{box-sizing:border-box}*,*::before,*::after,input[type='search']{box-sizing:inherit}body{font-size:16px;line-height:1.25;font-family:"Lato-Regular",Helvetica,Arial,sans-serif}@media print{body{font-size:12.0003px;line-height:0.93752}}a,a:hover{color:#999;text-decoration:none}a:focus{outline:none}:invalid{box-shadow:none}::-webkit-input-placeholder{color:#999;font-size:16px;text-overflow:ellipsis}::-moz-placeholder{color:#999;font-size:16px;text-overflow:ellipsis}:-ms-input-placeholder{color:#999;font-size:16px;text-overflow:ellipsis}::placeholder{color:#999;font-size:16px;text-overflow:ellipsis}fieldset+fieldset{margin-top:40px}fieldset:first-child{margin-top:0}fieldset>button{margin-top:20px}legend{display:none}textarea,[type="text"],[type="number"],[type="tel"],[type="button"],[type="submit"],select{border-radius:0}[type="number"]{-webkit-appearance:textfield;-moz-appearance:textfield;appearance:textfield}[type="number"]::-webkit-inner-spin-button{-webkit-appearance:none;margin:0}label,.FormGroup-label{display:inline-block;font-size:16px;line-height:1.25;margin-bottom:5px;vertical-align:top;width:auto}input,textarea{border-color:#ccc;border-style:solid;border-width:1px;color:#666;display:block;font-size:16px;height:44px;line-height:1.25;padding:4px 10px;width:100%;margin:0}input:focus,textarea:focus{border-color:#999;outline:none}@media only screen and (min-width: 480px){input,textarea{width:330px}}textarea{font-family:"Lato-Regular",Helvetica,Arial,sans-serif;min-height:150px;resize:vertical}.FormGroup-textareaCounter,.FormGroup-info{color:#999;font-size:14px;margin-top:5px}.FormGroup-textareaCounter.is-error,.FormGroup-info.is-error{color:#bf2102}.FormGroup-textareaCounter.is-success,.FormGroup-info.is-success{color:#00a550}select{border-color:#ccc;border-style:solid;border-width:1px;color:#666;display:block;font-size:16px;height:44px;line-height:1.25;padding:4px 10px;-webkit-appearance:none;-moz-appearance:none;appearance:none;background-color:transparent;background-image:url(images/backgrounds/bg-select-arrow.png);background-position:right center;background-repeat:no-repeat;cursor:pointer;padding:0 10px;width:330px}select:focus{border-color:#999;outline:none}.InputGroup{display:table;width:100%}.InputGroup>div{display:table-cell}.InputGroup input{margin:0;border-right-width:0;width:100%}.is-active .InputGroup input{background-color:#fff;cursor:default}.InputGroup div:last-child input{border-right-width:1px}.InputGroup--date{width:auto;border:1px solid #ccc}.InputGroup--date>div{position:relative}.InputGroup--date>div::before{content:'|';position:absolute;top:12px;left:-5px;color:#ccc}.is-disabled .InputGroup--date>div::before{color:rgba(153,153,153,0.5)}.InputGroup--date>div:first-of-type::before{content:''}.InputGroup--date>div input{width:50px;margin-left:-4px;text-align:center;border:0}.InputGroup--date>div:last-child input{width:66px}.InputGroup--date>div:first-of-type input{margin-left:0}.is-error .InputGroup--date{border:1px solid #bf2102}[type="radio"],[type="checkbox"]{display:inline-block;cursor:pointer;padding:0;margin:3px 6px 0 0;width:auto;border:0 none;vertical-align:top;height:auto;font-size:16px}[type="radio"]+label,[type="checkbox"]+label{cursor:pointer}.FormGroup-radio,.FormGroup-check{display:-webkit-box;display:-webkit-flex;display:-ms-flexbox;display:flex;-webkit-box-align:start;-webkit-align-items:flex-start;-ms-flex-align:start;align-items:flex-start}.FormGroup-radio input,.FormGroup-check input{-webkit-flex-shrink:0;-ms-flex-negative:0;flex-shrink:0}.FormGroup-radio.is-error,.FormGroup-check.is-error{color:#bf2102}.FormGroup-radio.is-disabled input,.FormGroup-check.is-disabled input{opacity:.6}.FormGroup-radio.is-disabled input+label,.FormGroup-check.is-disabled input+label{color:rgba(153,153,153,0.5);cursor:default}.FormGroup-radio--inline,.FormGroup-check--inline{float:left;white-space:nowrap;margin-right:20px}.FormGroup-radio--inline:last-child,.FormGroup-check--inline:last-child{margin-right:0}.StrengthBar meter{width:100%;height:7px;vertical-align:top;-webkit-appearance:none;-moz-appearance:none;appearance:none;background:#f2f2f2}.StrengthBar meter::-webkit-meter-bar{background:#ccc}.StrengthBar meter::-webkit-meter-optimum-value,.StrengthBar meter::-webkit-meter-suboptimum-value{background:#00a550}.StrengthBar meter::-webkit-meter-even-less-good-value{background:#bf2102}.StrengthBar meter:-moz-meter-optimum::-moz-meter-bar,.StrengthBar meter:-moz-meter-sub-optimum::-moz-meter-bar{background:#00a550}.StrengthBar meter:-moz-meter-sub-sub-optimum::-moz-meter-bar{background:#bf2102}.FormGroup{margin-bottom:20px}.FormGroup.is-error label{color:#bf2102}.FormGroup.is-error input,.FormGroup.is-error textarea,.FormGroup.is-error select{border-color:#bf2102}.FormGroup.is-success label{color:#00a550}.FormGroup.is-success input,.FormGroup.is-success textarea,.FormGroup.is-success select{border-color:#00a550}.FormGroup.is-success input{background-color:#f2fff8}.FormGroup.is-disabled label,.FormGroup.is-disabled .FormGroup-info,.FormGroup.is-disabled .FormGroup-textareaCounter,.FormGroup.is-disabled input,.FormGroup.is-disabled textarea,.FormGroup.is-disabled select,.FormGroup.is-disabled [disabled],.FormGroup.is-disabled [placeholder]{color:rgba(153,153,153,0.5);cursor:default}.FormGroup.is-disabled input,.FormGroup.is-disabled textarea,.FormGroup.is-disabled select{border-color:rgba(153,153,153,0.5)}.FormGroup.is-disabled [disabled],.FormGroup.is-disabled [placeholder]{background:transparent}.FormGroup.is-disabled ::-webkit-input-placeholder{color:rgba(153,153,153,0.5)}.FormGroup.is-disabled ::-moz-placeholder{color:rgba(153,153,153,0.5)}.FormGroup.is-disabled :-ms-input-placeholder{color:rgba(153,153,153,0.5)}.FormGroup.is-disabled ::placeholder{color:rgba(153,153,153,0.5)}.FormGroup:last-child{margin-bottom:0}