diff --git a/README.md b/README.md index 5ab96fe..e3f1ab9 100644 --- a/README.md +++ b/README.md @@ -1,6 +1,8 @@ -# An overview of barebones drop-in minimal CSS boilerplate frameworks +# Modular switcher for previewing drop-in minimal CSS frameworks -This is a quick CSS switcher to allow for previewing some of the many minimal CSS-only frameworks out there. See the demo [here](https://dohliam.github.io/dropin-minimal-css) or [drop the switcher](#Usage) into your own page to see how [different frameworks](#list-of-frameworks) would look with your content. +This is a quick CSS switcher to allow for previewing some of the many minimal CSS-only frameworks out there. See the [demo](https://dohliam.github.io/dropin-minimal-css) or [drop the switcher](#Usage) into your own page to see how [different frameworks](#list-of-frameworks) would look together with your content. + +This project only includes "drop-in" minimal frameworks, in other words, boilerplate frameworks that require no adjustment of the corresponding HTML and can be simply dropped into the project to provide a starting point for further design. No additional javascript, compiling, pre-processors, or fiddling with classes should be required for these to look good and be responsive. ## Usage @@ -23,6 +25,10 @@ Then, add the following code wherever you want the dropdown to appear: That's it! You should now be able to cycle through the different frameworks by choosing them from the dropdown. +## Custom frameworks + +You can easily add your own frameworks to the dropdown, or replace the default ones entirely. Just copy the minified css file for each framework into the `vendor` directory and add the framework names to the list at the top of `switcher.js`, separated by commas. They will be automatically pulled into the switcher dropdown and loaded when you select them. + ## List of frameworks * [bullframe](https://github.com/marcopontili/bullframe.css) by @marcopontili ([MIT](http://opensource.org/licenses/MIT)) @@ -32,7 +38,6 @@ That's it! You should now be able to cycle through the different frameworks by c * [lotus](https://github.com/goatslacker/lotus.css) by goatslacker (MIT) * [milligram](https://github.com/milligram/milligram) by @cjpatoilo ([MIT](http://cjpatoilo.mit-license.org/)) * [min](https://github.com/owenversteeg/min) by @owenversteeg (MIT) -* [monalisa](https://github.com/jusbrasil/monalisa) by jusbrasil (MIT) * [motherplate](https://github.com/leemunroe/motherplate) by @leemunroe ([MIT](https://github.com/leemunroe/motherplate/blob/master/LICENSE)) * [normalize](https://github.com/necolas/normalize.css) by @necolas ([MIT](https://github.com/necolas/normalize.css/blob/master/LICENSE.md)) * [oh-my-css](https://github.com/egoist/oh-my-css) by @egoist ([MIT](https://github.com/egoist/oh-my-css/blob/gh-pages/LICENSE)) @@ -47,7 +52,13 @@ That's it! You should now be able to cycle through the different frameworks by c * [skeleton-plus](https://github.com/oltmannsdaniel/skeleton-plus) by @oltmannsdaniel ([MIT](https://github.com/oltmannsdaniel/skeleton-plus/blob/master/LICENSE)) * [thao](https://github.com/ThaoFramework/Thao/) by Giuseppe Sanfrancesco ([Apache](http://www.apache.org/licenses/LICENSE-2.0)) -Sample HTML5 markup based on [html5-kitchen-sink](https://github.com/dbox/html5-kitchen-sink) by @dbox (MIT) +## Acknowledgements + +* Sample HTML5 markup based on [html5-kitchen-sink](https://github.com/dbox/html5-kitchen-sink) by @dbox (MIT) +* Example images in the demo are by [MichaelMaggs](https://commons.wikimedia.org/wiki/User:MichaelMaggs) on [Wikimedia Commons](https://commons.wikimedia.org) +* Example videos provided by the [Blender Foundation](https://peach.blender.org/) via the [HTML5-Test-Videos](https://github.com/benhosmer/HTML5-Test-Videos) project +* Embedded audio by [John Pazdan](http://ccmixter.org/files/flatwound/14476) at [ccMixter](http://ccmixter.org/files/flatwound/14476) +* Special thanks to [Tacit CSS](https://github.com/yegor256/tacit), which was the original inspiration for making this list to answer the question "Where can I find more frameworks like Tacit?" ## LICENSE diff --git a/vendor/monalisa.min.css b/vendor/monalisa.min.css deleted file mode 100644 index ae1dab2..0000000 --- a/vendor/monalisa.min.css +++ /dev/null @@ -1,879 +0,0 @@ -@charset "UTF-8";@-webkit-keyframes ellipsis{0%{width:0;margin-right:1em;} -100%{width:1em;} -} -@-moz-keyframes ellipsis{0%{width:0;margin-right:1em;} -100%{width:1em;} -} -@keyframes ellipsis{0%{width:0;margin-right:1em;} -100%{width:1em;} -} -@-webkit-keyframes spinner-circle{100%{stroke-dashoffset:-600;} -} -@-moz-keyframes spinner-circle{100%{stroke-dashoffset:-600;} -} -@keyframes spinner-circle{100%{stroke-dashoffset:-600;} -} -@-webkit-keyframes spin{100%{-webkit-transform:rotate(360deg);-ms-transform:rotate(360deg);transform:rotate(360deg);} -} -@-moz-keyframes spin{100%{-webkit-transform:rotate(360deg);-ms-transform:rotate(360deg);transform:rotate(360deg);} -} -@keyframes spin{100%{-webkit-transform:rotate(360deg);-ms-transform:rotate(360deg);transform:rotate(360deg);} -} -@-webkit-keyframes fa-spin{0%{-webkit-transform:rotate(0deg);transform:rotate(0deg);} -100%{-webkit-transform:rotate(359deg);transform:rotate(359deg);} -} -@keyframes fa-spin{0%{-webkit-transform:rotate(0deg);transform:rotate(0deg);} -100%{-webkit-transform:rotate(359deg);transform:rotate(359deg);} -} -@font-face{font-family:'FontAwesome';src:url("../fonts/fontawesome-webfont.eot?v=4.2.0");src:url("../fonts/fontawesome-webfont.eot?#iefix&v=4.2.0") format("embedded-opentype"), url("../fonts/fontawesome-webfont.woff?v=4.2.0") format("woff"), url("../fonts/fontawesome-webfont.ttf?v=4.2.0") format("truetype"), url("../fonts/fontawesome-webfont.svg?v=4.2.0#fontawesomeregular") format("svg");font-weight:normal;font-style:normal;} -.fa:before,.field-validation,.select,.switch-label:after,.switch-label:before{display:inline-block;font:normal normal normal 14px/1 FontAwesome;font-size:inherit;text-rendering:auto;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;} -.fa--lg:before{font-size:1.33333em;line-height:.75em;vertical-align:-15%;} -.fa--2x:before{font-size:2em;} -.fa--3x:before{font-size:3em;} -.fa--4x:before{font-size:4em;} -.fa--5x:before{font-size:5em;} -.fa--fw:before{width:1.28571em;text-align:center;} -.fa--ul:before{padding-left:0;margin-left:2.14286em;list-style-type:none;} -.fa--ul:before>li{position:relative;} -.fa--li:before{position:absolute;left:-2.14286em;width:2.14286em;top:.14286em;text-align:center;} -.fa--li:before.fa--lg:before{left:-1.85714em;} -.fa--border:before{padding:.2em .25em .15em;border:solid .08em #eee;border-radius:.1em;} -.fa--spin:before{-webkit-animation:fa-spin 2s infinite linear;animation:fa-spin 2s infinite linear;} -.fa--rotate90:before{-webkit-transform:rotate(90deg);-ms-transform:rotate(90deg);transform:rotate(90deg);} -.fa--rotate180:before{-webkit-transform:rotate(180deg);-ms-transform:rotate(180deg);transform:rotate(180deg);} -.fa--rotate270:before{-webkit-transform:rotate(270deg);-ms-transform:rotate(270deg);transform:rotate(270deg);} -.fa--flipHorizontal:before{-webkit-transform:scale(-1,1);-ms-transform:scale(-1,1);transform:scale(-1,1);} -.fa--flipVertical:before{-webkit-transform:scale(1,-1);-ms-transform:scale(1,-1);transform:scale(1,-1);} -:root .fa--rotate90:before,:root .fa--rotate180:before,:root .fa--rotate270:before,:root .fa--flipHorizontal:before,:root .fa--flipVertical:before{filter:none;} -.fa--stack:before{position:relative;display:inline-block;width:2em;height:2em;line-height:2em;vertical-align:middle;} -.fa--stack1x:before,.fa--stack2x:before{position:absolute;left:0;width:100%;text-align:center;} -.fa--stack1x:before{line-height:inherit;} -.fa--stack2x:before{font-size:2em;} -.fa--glass:before{content:"";} -.fa--music:before{content:"";} -.fa--search:before{content:"";} -.fa--envelopeO:before{content:"";} -.fa--heart:before{content:"";} -.fa--star:before{content:"";} -.fa--starO:before{content:"";} -.fa--user:before{content:"";} -.fa--film:before{content:"";} -.fa--thLarge:before{content:"";} -.fa--th:before{content:"";} -.fa--thList:before{content:"";} -.fa--check:before,label.switch input[type="checkbox"]~.switch-label:before{content:"";} -.fa--remove:before,.fa--close:before,.fa--times:before{content:"";} -.fa--searchPlus:before{content:"";} -.fa--searchMinus:before{content:"";} -.fa--powerOff:before{content:"";} -.fa--signal:before{content:"";} -.fa--gear:before,.fa--cog:before{content:"";} -.fa--trashO:before{content:"";} -.fa--home:before{content:"";} -.fa--fileO:before{content:"";} -.fa--clockO:before{content:"";} -.fa--road:before{content:"";} -.fa--download:before{content:"";} -.fa--arrowCircleODown:before{content:"";} -.fa--arrowCircleOUp:before{content:"";} -.fa--inbox:before{content:"";} -.fa--playCircleO:before{content:"";} -.fa--rotateRight:before,.fa--repeat:before{content:"";} -.fa--refresh:before{content:"";} -.fa--listAlt:before{content:"";} -.fa--lock:before{content:"";} -.fa--flag:before{content:"";} -.fa--headphones:before{content:"";} -.fa--volumeOff:before{content:"";} -.fa--volumeDown:before{content:"";} -.fa--volumeUp:before{content:"";} -.fa--qrcode:before{content:"";} -.fa--barcode:before{content:"";} -.fa--tag:before{content:"";} -.fa--tags:before{content:"";} -.fa--book:before{content:"";} -.fa--bookmark:before{content:"";} -.fa--print:before{content:"";} -.fa--camera:before{content:"";} -.fa--font:before{content:"";} -.fa--bold:before{content:"";} -.fa--italic:before{content:"";} -.fa--textHeight:before{content:"";} -.fa--textWidth:before{content:"";} -.fa--alignLeft:before{content:"";} -.fa--alignCenter:before{content:"";} -.fa--alignRight:before{content:"";} -.fa--alignJustify:before{content:"";} -.fa--list:before{content:"";} -.fa--dedent:before,.fa--outdent:before{content:"";} -.fa--indent:before{content:"";} -.fa--videoCamera:before{content:"";} -.fa--photo:before,.fa--image:before,.fa--pictureO:before{content:"";} -.fa--pencil:before{content:"";} -.fa--mapMarker:before{content:"";} -.fa--adjust:before{content:"";} -.fa--tint:before{content:"";} -.fa--edit:before,.fa--pencilSquareO:before{content:"";} -.fa--shareSquareO:before{content:"";} -.fa--checkSquareO:before{content:"";} -.fa--arrows:before{content:"";} -.fa--stepBackward:before{content:"";} -.fa--fastBackward:before{content:"";} -.fa--backward:before{content:"";} -.fa--play:before{content:"";} -.fa--pause:before{content:"";} -.fa--stop:before{content:"";} -.fa--forward:before{content:"";} -.fa--fastForward:before{content:"";} -.fa--stepForward:before{content:"";} -.fa--eject:before{content:"";} -.fa--chevronLeft:before{content:"";} -.fa--chevronRight:before{content:"";} -.fa--plusCircle:before{content:"";} -.fa--minusCircle:before{content:"";} -.fa--timesCircle:before{content:"";} -.fa--checkCircle:before,.alert--success i.fa:before,.field--success .field-validation:before{content:"";} -.fa--questionCircle:before,.alert--warning i.fa:before{content:"";} -.fa--infoCircle:before,.alert .fa:before{content:"";} -.fa--crosshairs:before{content:"";} -.fa--timesCircleO:before{content:"";} -.fa--checkCircleO:before{content:"";} -.fa--ban:before{content:"";} -.fa--arrowLeft:before{content:"";} -.fa--arrowRight:before{content:"";} -.fa--arrowUp:before{content:"";} -.fa--arrowDown:before{content:"";} -.fa--mailForward:before,.fa--share:before{content:"";} -.fa--expand:before{content:"";} -.fa--compress:before{content:"";} -.fa--plus:before{content:"";} -.fa--minus:before{content:"";} -.fa--asterisk:before{content:"";} -.fa--exclamationCircle:before,.alert--error i.fa:before,.field--error .field-validation:before{content:"";} -.fa--gift:before{content:"";} -.fa--leaf:before{content:"";} -.fa--fire:before{content:"";} -.fa--eye:before{content:"";} -.fa--eyeSlash:before{content:"";} -.fa--warning:before,.fa--exclamationTriangle:before{content:"";} -.fa--plane:before{content:"";} -.fa--calendar:before{content:"";} -.fa--random:before{content:"";} -.fa--comment:before{content:"";} -.fa--magnet:before{content:"";} -.fa--chevronUp:before{content:"";} -.fa--chevronDown:before{content:"";} -.fa--retweet:before{content:"";} -.fa--shoppingCart:before{content:"";} -.fa--folder:before{content:"";} -.fa--folderOpen:before{content:"";} -.fa--arrowsV:before{content:"";} -.fa--arrowsH:before{content:"";} -.fa--barChartO:before,.fa--barChart:before{content:"";} -.fa--twitterSquare:before{content:"";} -.fa--facebookSquare:before{content:"";} -.fa--cameraRetro:before{content:"";} -.fa--key:before{content:"";} -.fa--gears:before,.fa--cogs:before{content:"";} -.fa--comments:before{content:"";} -.fa--thumbsOUp:before{content:"";} -.fa--thumbsODown:before{content:"";} -.fa--starHalf:before{content:"";} -.fa--heartO:before{content:"";} -.fa--signOut:before{content:"";} -.fa--linkedinSquare:before{content:"";} -.fa--thumbTack:before{content:"";} -.fa--externalLink:before{content:"";} -.fa--signIn:before{content:"";} -.fa--trophy:before{content:"";} -.fa--githubSquare:before{content:"";} -.fa--upload:before{content:"";} -.fa--lemonO:before{content:"";} -.fa--phone:before{content:"";} -.fa--squareO:before{content:"";} -.fa--bookmarkO:before{content:"";} -.fa--phoneSquare:before{content:"";} -.fa--twitter:before{content:"";} -.fa--facebook:before{content:"";} -.fa--github:before{content:"";} -.fa--unlock:before{content:"";} -.fa--creditCard:before{content:"";} -.fa--rss:before{content:"";} -.fa--hddO:before{content:"";} -.fa--bullhorn:before{content:"";} -.fa--bell:before{content:"";} -.fa--certificate:before{content:"";} -.fa--handORight:before{content:"";} -.fa--handOLeft:before{content:"";} -.fa--handOUp:before{content:"";} -.fa--handODown:before{content:"";} -.fa--arrowCircleLeft:before{content:"";} -.fa--arrowCircleRight:before{content:"";} -.fa--arrowCircleUp:before{content:"";} -.fa--arrowCircleDown:before{content:"";} -.fa--globe:before{content:"";} -.fa--wrench:before{content:"";} -.fa--tasks:before{content:"";} -.fa--filter:before{content:"";} -.fa--briefcase:before{content:"";} -.fa--arrowsAlt:before{content:"";} -.fa--group:before,.fa--users:before{content:"";} -.fa--chain:before,.fa--link:before{content:"";} -.fa--cloud:before{content:"";} -.fa--flask:before{content:"";} -.fa--cut:before,.fa--scissors:before{content:"";} -.fa--copy:before,.fa--filesO:before{content:"";} -.fa--paperclip:before{content:"";} -.fa--save:before,.fa--floppyO:before{content:"";} -.fa--square:before{content:"";} -.fa--navicon:before,.fa--reorder:before,.fa--bars:before{content:"";} -.fa--listUl:before{content:"";} -.fa--listOl:before{content:"";} -.fa--strikethrough:before{content:"";} -.fa--underline:before{content:"";} -.fa--table:before{content:"";} -.fa--magic:before{content:"";} -.fa--truck:before{content:"";} -.fa--pinterest:before{content:"";} -.fa--pinterestSquare:before{content:"";} -.fa--googlePlusSquare:before{content:"";} -.fa--googlePlus:before{content:"";} -.fa--money:before{content:"";} -.fa--caretDown:before,.select:before{content:"";} -.fa--caretUp:before{content:"";} -.fa--caretLeft:before{content:"";} -.fa--caretRight:before{content:"";} -.fa--columns:before{content:"";} -.fa--unsorted:before,.fa--sort:before{content:"";} -.fa--sortDown:before,.fa--sortDesc:before{content:"";} -.fa--sortUp:before,.fa--sortAsc:before{content:"";} -.fa--envelope:before{content:"";} -.fa--linkedin:before{content:"";} -.fa--rotateLeft:before,.fa--undo:before{content:"";} -.fa--legal:before,.fa--gavel:before{content:"";} -.fa--dashboard:before,.fa--tachometer:before{content:"";} -.fa--commentO:before{content:"";} -.fa--commentsO:before{content:"";} -.fa--flash:before,.fa--bolt:before{content:"";} -.fa--sitemap:before{content:"";} -.fa--umbrella:before{content:"";} -.fa--paste:before,.fa--clipboard:before{content:"";} -.fa--lightbulbO:before{content:"";} -.fa--exchange:before{content:"";} -.fa--cloudDownload:before{content:"";} -.fa--cloudUpload:before{content:"";} -.fa--userMd:before{content:"";} -.fa--stethoscope:before{content:"";} -.fa--suitcase:before{content:"";} -.fa--bellO:before{content:"";} -.fa--coffee:before{content:"";} -.fa--cutlery:before{content:"";} -.fa--fileTextO:before{content:"";} -.fa--buildingO:before{content:"";} -.fa--hospitalO:before{content:"";} -.fa--ambulance:before{content:"";} -.fa--medkit:before{content:"";} -.fa--fighterJet:before{content:"";} -.fa--beer:before{content:"";} -.fa--hSquare:before{content:"";} -.fa--plusSquare:before{content:"";} -.fa--angleDoubleLeft:before{content:"";} -.fa--angleDoubleRight:before{content:"";} -.fa--angleDoubleUp:before{content:"";} -.fa--angleDoubleDown:before{content:"";} -.fa--angleLeft:before{content:"";} -.fa--angleRight:before{content:"";} -.fa--angleUp:before{content:"";} -.fa--angleDown:before{content:"";} -.fa--desktop:before{content:"";} -.fa--laptop:before{content:"";} -.fa--tablet:before{content:"";} -.fa--mobilePhone:before,.fa--mobile:before{content:"";} -.fa--circleO:before{content:"";} -.fa--quoteLeft:before{content:"";} -.fa--quoteRight:before{content:"";} -.fa--spinner:before{content:"";} -.fa--circle:before{content:"";} -.fa--mailReply:before,.fa--reply:before{content:"";} -.fa--githubAlt:before{content:"";} -.fa--folderO:before{content:"";} -.fa--folderOpenO:before{content:"";} -.fa--smileO:before{content:"";} -.fa--frownO:before{content:"";} -.fa--mehO:before{content:"";} -.fa--gamepad:before{content:"";} -.fa--keyboardO:before{content:"";} -.fa--flagO:before{content:"";} -.fa--flagCheckered:before{content:"";} -.fa--terminal:before{content:"";} -.fa--code:before{content:"";} -.fa--mailReplyAll:before,.fa--replyAll:before{content:"";} -.fa--starHalfEmpty:before,.fa--starHalfFull:before,.fa--starHalfO:before{content:"";} -.fa--locationArrow:before{content:"";} -.fa--crop:before{content:"";} -.fa--codeFork:before{content:"";} -.fa--unlink:before,.fa--chainBroken:before{content:"";} -.fa--question:before{content:"";} -.fa--info:before{content:"";} -.fa--exclamation:before{content:"";} -.fa--superscript:before{content:"";} -.fa--subscript:before{content:"";} -.fa--eraser:before{content:"";} -.fa--puzzlePiece:before{content:"";} -.fa--microphone:before{content:"";} -.fa--microphoneSlash:before{content:"";} -.fa--shield:before{content:"";} -.fa--calendarO:before{content:"";} -.fa--fireExtinguisher:before{content:"";} -.fa--rocket:before{content:"";} -.fa--maxcdn:before{content:"";} -.fa--chevronCircleLeft:before{content:"";} -.fa--chevronCircleRight:before{content:"";} -.fa--chevronCircleUp:before{content:"";} -.fa--chevronCircleDown:before{content:"";} -.fa--html5:before{content:"";} -.fa--css3:before{content:"";} -.fa--anchor:before{content:"";} -.fa--unlockAlt:before{content:"";} -.fa--bullseye:before{content:"";} -.fa--ellipsisH:before{content:"";} -.fa--ellipsisV:before{content:"";} -.fa--rssSquare:before{content:"";} -.fa--playCircle:before{content:"";} -.fa--ticket:before{content:"";} -.fa--minusSquare:before{content:"";} -.fa--minusSquareO:before{content:"";} -.fa--levelUp:before{content:"";} -.fa--levelDown:before{content:"";} -.fa--checkSquare:before{content:"";} -.fa--pencilSquare:before{content:"";} -.fa--externalLinkSquare:before{content:"";} -.fa--shareSquare:before{content:"";} -.fa--compass:before{content:"";} -.fa--toggleDown:before,.fa--caretSquareODown:before{content:"";} -.fa--toggleUp:before,.fa--caretSquareOUp:before{content:"";} -.fa--toggleRight:before,.fa--caretSquareORight:before{content:"";} -.fa--euro:before,.fa--eur:before{content:"";} -.fa--gbp:before{content:"";} -.fa--dollar:before,.fa--usd:before{content:"";} -.fa--rupee:before,.fa--inr:before{content:"";} -.fa--cny:before,.fa--rmb:before,.fa--yen:before,.fa--jpy:before{content:"";} -.fa--ruble:before,.fa--rouble:before,.fa--rub:before{content:"";} -.fa--won:before,.fa--krw:before{content:"";} -.fa--bitcoin:before,.fa--btc:before{content:"";} -.fa--file:before{content:"";} -.fa--fileText:before{content:"";} -.fa--sortAlphaAsc:before{content:"";} -.fa--sortAlphaDesc:before{content:"";} -.fa--sortAmountAsc:before{content:"";} -.fa--sortAmountDesc:before{content:"";} -.fa--sortNumericAsc:before{content:"";} -.fa--sortNumericDesc:before{content:"";} -.fa--thumbsUp:before{content:"";} -.fa--thumbsDown:before{content:"";} -.fa--youtubeSquare:before{content:"";} -.fa--youtube:before{content:"";} -.fa--xing:before{content:"";} -.fa--xingSquare:before{content:"";} -.fa--youtubePlay:before{content:"";} -.fa--dropbox:before{content:"";} -.fa--stackOverflow:before{content:"";} -.fa--instagram:before{content:"";} -.fa--flickr:before{content:"";} -.fa--adn:before{content:"";} -.fa--bitbucket:before{content:"";} -.fa--bitbucketSquare:before{content:"";} -.fa--tumblr:before{content:"";} -.fa--tumblrSquare:before{content:"";} -.fa--longArrowDown:before{content:"";} -.fa--longArrowUp:before{content:"";} -.fa--longArrowLeft:before{content:"";} -.fa--longArrowRight:before{content:"";} -.fa--apple:before{content:"";} -.fa--windows:before{content:"";} -.fa--android:before{content:"";} -.fa--linux:before{content:"";} -.fa--dribbble:before{content:"";} -.fa--skype:before{content:"";} -.fa--foursquare:before{content:"";} -.fa--trello:before{content:"";} -.fa--female:before{content:"";} -.fa--male:before{content:"";} -.fa--gittip:before{content:"";} -.fa--sunO:before{content:"";} -.fa--moonO:before{content:"";} -.fa--archive:before{content:"";} -.fa--bug:before{content:"";} -.fa--vk:before{content:"";} -.fa--weibo:before{content:"";} -.fa--renren:before{content:"";} -.fa--pagelines:before{content:"";} -.fa--stackExchange:before{content:"";} -.fa--arrowCircleORight:before{content:"";} -.fa--arrowCircleOLeft:before{content:"";} -.fa--toggleLeft:before,.fa--caretSquareOLeft:before{content:"";} -.fa--dotCircleO:before{content:"";} -.fa--wheelchair:before{content:"";} -.fa--vimeoSquare:before{content:"";} -.fa--turkishLira:before,.fa--try:before{content:"";} -.fa--plusSquareO:before{content:"";} -.fa--spaceShuttle:before{content:"";} -.fa--slack:before{content:"";} -.fa--envelopeSquare:before{content:"";} -.fa--wordpress:before{content:"";} -.fa--openid:before{content:"";} -.fa--institution:before,.fa--bank:before,.fa--university:before{content:"";} -.fa--mortarBoard:before,.fa--graduationCap:before{content:"";} -.fa--yahoo:before{content:"";} -.fa--google:before{content:"";} -.fa--reddit:before{content:"";} -.fa--redditSquare:before{content:"";} -.fa--stumbleuponCircle:before{content:"";} -.fa--stumbleupon:before{content:"";} -.fa--delicious:before{content:"";} -.fa--digg:before{content:"";} -.fa--piedPiper:before{content:"";} -.fa--piedPiperAlt:before{content:"";} -.fa--drupal:before{content:"";} -.fa--joomla:before{content:"";} -.fa--language:before{content:"";} -.fa--fax:before{content:"";} -.fa--building:before{content:"";} -.fa--child:before{content:"";} -.fa--paw:before{content:"";} -.fa--spoon:before{content:"";} -.fa--cube:before{content:"";} -.fa--cubes:before{content:"";} -.fa--behance:before{content:"";} -.fa--behanceSquare:before{content:"";} -.fa--steam:before{content:"";} -.fa--steamSquare:before{content:"";} -.fa--recycle:before{content:"";} -.fa--automobile:before,.fa--car:before{content:"";} -.fa--cab:before,.fa--taxi:before{content:"";} -.fa--tree:before{content:"";} -.fa--spotify:before{content:"";} -.fa--deviantart:before{content:"";} -.fa--soundcloud:before{content:"";} -.fa--database:before{content:"";} -.fa--filePdfO:before{content:"";} -.fa--fileWordO:before{content:"";} -.fa--fileExcelO:before{content:"";} -.fa--filePowerpointO:before{content:"";} -.fa--filePhotoO:before,.fa--filePictureO:before,.fa--fileImageO:before{content:"";} -.fa--fileZipO:before,.fa--fileArchiveO:before{content:"";} -.fa--fileSoundO:before,.fa--fileAudioO:before{content:"";} -.fa--fileMovieO:before,.fa--fileVideoO:before{content:"";} -.fa--fileCodeO:before{content:"";} -.fa--vine:before{content:"";} -.fa--codepen:before{content:"";} -.fa--jsfiddle:before{content:"";} -.fa--lifeBouy:before,.fa--lifeBuoy:before,.fa--lifeSaver:before,.fa--support:before,.fa--lifeRing:before{content:"";} -.fa--circleONotch:before{content:"";} -.fa--ra:before,.fa--rebel:before{content:"";} -.fa--ge:before,.fa--empire:before{content:"";} -.fa--gitSquare:before{content:"";} -.fa--git:before{content:"";} -.fa--hackerNews:before{content:"";} -.fa--tencentWeibo:before{content:"";} -.fa--qq:before{content:"";} -.fa--wechat:before,.fa--weixin:before{content:"";} -.fa--send:before,.fa--paperPlane:before{content:"";} -.fa--sendO:before,.fa--paperPlaneO:before{content:"";} -.fa--history:before{content:"";} -.fa--circleThin:before{content:"";} -.fa--header:before{content:"";} -.fa--paragraph:before{content:"";} -.fa--sliders:before{content:"";} -.fa--shareAlt:before{content:"";} -.fa--shareAltSquare:before{content:"";} -.fa--bomb:before{content:"";} -.fa--soccerBallO:before,.fa--futbolO:before{content:"";} -.fa--tty:before{content:"";} -.fa--binoculars:before{content:"";} -.fa--plug:before{content:"";} -.fa--slideshare:before{content:"";} -.fa--twitch:before{content:"";} -.fa--yelp:before{content:"";} -.fa--newspaperO:before{content:"";} -.fa--wifi:before{content:"";} -.fa--calculator:before{content:"";} -.fa--paypal:before{content:"";} -.fa--googleWallet:before{content:"";} -.fa--ccVisa:before{content:"";} -.fa--ccMastercard:before{content:"";} -.fa--ccDiscover:before{content:"";} -.fa--ccAmex:before{content:"";} -.fa--ccPaypal:before{content:"";} -.fa--ccStripe:before{content:"";} -.fa--bellSlash:before{content:"";} -.fa--bellSlashO:before{content:"";} -.fa--trash:before{content:"";} -.fa--copyright:before{content:"";} -.fa--at:before{content:"";} -.fa--eyedropper:before{content:"";} -.fa--paintBrush:before{content:"";} -.fa--birthdayCake:before{content:"";} -.fa--areaChart:before{content:"";} -.fa--pieChart:before{content:"";} -.fa--lineChart:before{content:"";} -.fa--lastfm:before{content:"";} -.fa--lastfmSquare:before{content:"";} -.fa--toggleOff:before{content:"";} -.fa--toggleOn:before{content:"";} -.fa--bicycle:before{content:"";} -.fa--bus:before{content:"";} -.fa--ioxhost:before{content:"";} -.fa--angellist:before{content:"";} -.fa--cc:before{content:"";} -.fa--shekel:before,.fa--sheqel:before,.fa--ils:before{content:"";} -.fa--meanpath:before{content:"";} -.fa--white:before{color:#fff;} -.fa--black:before{color:#000;} -.fa--gray:before,.select:before{color:#808080;} -.fa--blue:before{color:#0091ea;} -.fa--green:before,.field--success .field-validation:before{color:#7cb342;} -.fa--yellow:before{color:#ffb300;} -.fa--orange:before{color:#fb8c00;} -.fa--red:before,.field--error .field-validation:before{color:#f83c00;} -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,button{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;} -input,textarea,button{border:0;outline:0;} -button,select,input[type="button"],input[type="reset"],input[type="submit"]{background:transparent;} -button:focus,select:focus,input[type="button"]:focus,input[type="reset"]:focus,input[type="submit"]:focus{outline:0;} -html{font-family:sans-serif;-ms-text-size-adjust:100%;-webkit-text-size-adjust:100%;} -audio,canvas,progress,video{display:inline-block;vertical-align:baseline;} -audio:not([controls]){display:none;height:0;} -[hidden],template{display:none;} -a{background-color:transparent;} -a:active,a:hover{outline:0;} -abbr[title]{border-bottom:1px dotted;} -b,strong{font-weight:bold;} -dfn{font-style:italic;} -mark{background:#ff0;color:#000;} -small{font-size:80%;} -sub,sup{font-size:75%;line-height:0;position:relative;vertical-align:baseline;} -sup{top:-0.5em;} -sub{bottom:-0.25em;} -img{border:0;} -svg:not(:root){overflow:hidden;} -figure{margin:1em 40px;} -hr{-moz-box-sizing:content-box;box-sizing:content-box;height:0;} -pre{overflow:auto;} -code,kbd,pre,samp{font-family:monospace,monospace;font-size:1em;} -button,input,optgroup,select,textarea{color:inherit;font:inherit;margin:0;} -button{overflow:visible;} -button,select{text-transform:none;} -button,html input[type="button"],input[type="reset"],input[type="submit"]{-webkit-appearance:button;cursor:pointer;} -button::-moz-focus-inner,input::-moz-focus-inner{border:0;padding:0;} -input{line-height:normal;} -input[type="checkbox"],input[type="radio"]{box-sizing:border-box;padding:0;} -input[type="number"]::-webkit-inner-spin-button,input[type="number"]::-webkit-outer-spin-button{height:auto;} -input[type="search"]{-webkit-appearance:textfield;-moz-box-sizing:content-box;-webkit-box-sizing:content-box;box-sizing:content-box;} -input[type="search"]::-webkit-search-cancel-button,input[type="search"]::-webkit-search-decoration{-webkit-appearance:none;} -fieldset{border:1px solid #c0c0c0;margin:0 2px;padding:.35em .625em .75em;} -legend{border:0;padding:0;} -textarea{overflow:auto;} -optgroup{font-weight:bold;} -td,th{padding:0;} -html{box-sizing:border-box;} -*,*:before,*:after{box-sizing:inherit;} -::-webkit-input-placeholder{color:rgba(0,0,0,0.26);font-weight:light;} -:-moz-placeholder{color:rgba(0,0,0,0.26);font-weight:light;} -::-moz-placeholder{color:rgba(0,0,0,0.26);font-weight:light;} -:-ms-input-placeholder{color:rgba(0,0,0,0.26);font-weight:light;} -[disabled],label.switch input[type="checkbox"][disabled]~.switch-label,label.switch input[type="radio"][disabled]~.switch-label{cursor:not-allowed;opacity:.54;} -a{text-decoration:none;} -@font-face{font-family:'Roboto';font-style:normal;font-weight:300;src:local("Roboto Light"), local("Roboto-Light"), url(http://fonts.gstatic.com/s/roboto/v14/Hgo13k-tfSpn0qi1SFdUfYX0hVgzZQUfRDuZrPvH3D8.woff2) format("woff2");unicode-range:U+0000-00FF, U+0131, U+0152-0153, U+02C6, U+02DA, U+02DC, U+2000-206F, U+2074, U+20AC, U+2212, U+2215, U+E0FF, U+EFFD, U+F000;} -@font-face{font-family:'Roboto';font-style:italic;font-weight:300;src:local("Roboto Light Italic"), local("Roboto-LightItalic"), url(http://fonts.gstatic.com/s/roboto/v14/7m8l7TlFO-S3VkhHuR0at5QV2lvL5Ba9FjAYK6Lx0Qk.woff2) format("woff2");unicode-range:U+0000-00FF, U+0131, U+0152-0153, U+02C6, U+02DA, U+02DC, U+2000-206F, U+2074, U+20AC, U+2212, U+2215, U+E0FF, U+EFFD, U+F000;} -@font-face{font-family:'Roboto';font-style:normal;font-weight:700;src:local("Roboto Bold"), local("Roboto-Bold"), url(http://fonts.gstatic.com/s/roboto/v14/d-6IYplOFocCacKzxwXSOIX0hVgzZQUfRDuZrPvH3D8.woff2) format("woff2");unicode-range:U+0000-00FF, U+0131, U+0152-0153, U+02C6, U+02DA, U+02DC, U+2000-206F, U+2074, U+20AC, U+2212, U+2215, U+E0FF, U+EFFD, U+F000;} -@font-face{font-family:'Roboto';font-style:italic;font-weight:700;src:local("Roboto Bold Italic"), local("Roboto-BoldItalic"), url(http://fonts.gstatic.com/s/roboto/v14/t6Nd4cfPRhZP44Q5QAjcC5QV2lvL5Ba9FjAYK6Lx0Qk.woff2) format("woff2");unicode-range:U+0000-00FF, U+0131, U+0152-0153, U+02C6, U+02DA, U+02DC, U+2000-206F, U+2074, U+20AC, U+2212, U+2215, U+E0FF, U+EFFD, U+F000;} -@font-face{font-family:'Roboto';font-style:italic;font-weight:400;src:local("Roboto Italic"), local("Roboto-Italic"), url(http://fonts.gstatic.com/s/roboto/v14/vPcynSL0qHq_6dX7lKVByRkAz4rYn47Zy2rvigWQf6w.woff2) format("woff2");unicode-range:U+0000-00FF, U+0131, U+0152-0153, U+02C6, U+02DA, U+02DC, U+2000-206F, U+2074, U+20AC, U+2212, U+2215, U+E0FF, U+EFFD, U+F000;} -@font-face{font-family:'Roboto';font-style:normal;font-weight:400;src:local("Roboto Regular"), local("Roboto-Regular"), url(http://fonts.gstatic.com/s/roboto/v14/oMMgfZMQthOryQo9n22dcn-_kf6ByYO6CLYdB4HQE-Y.woff2) format("woff2");unicode-range:U+0000-00FF, U+0131, U+0152-0153, U+02C6, U+02DA, U+02DC, U+2000-206F, U+2074, U+20AC, U+2212, U+2215, U+E0FF, U+EFFD, U+F000;} -html{font-family:Roboto,sans-serif;font-weight:400;font-size:62.5%;} -.typography--light{font-weight:200;} -.typography-display1{font-size:5.6rem;line-height:5.48625rem;} -.typography-display2{font-size:4.5rem;line-height:3.99rem;} -.typography-display3{font-size:3.4rem;line-height:3.325rem;} -.typography-headline{font-size:2.4rem;line-height:2.66rem;} -.typography-title{font-size:2.0rem;line-height:2.66rem;} -.typography-head{font-size:1.8rem;line-height:2.3275rem;} -.typography-subhead,.typography-subtitle{font-size:1.6rem;line-height:2.3275rem;} -.typography-subhead{font-size:1.5rem;} -.typography-body-bold,.typography-button,.typography-body{font-size:1.4rem;line-height:1.995rem;} -.typography-body-bold{font-weight:700;} -.typography-button{text-transform:uppercase;} -.typography-caption{font-size:1.2rem;font-weight:400;line-height:1.49625rem;} -.truncate{white-space:nowrap;overflow:hidden;text-overflow:ellipsis;} -.alert,.button,.actionButton,.dialog,select,.modal-box,.outlineButton,.label,.outlineLabel{border-radius:2px;} -.alert,.button,.actionButton,.dialog,select,.modal-box{box-shadow:0 1px 2px 0 rgba(0,0,0,0.24),0 2px 2px 0 rgba(0,0,0,0.12);} -.grid-container{width:100%;max-width:960px;margin-left:auto;margin-right:auto;} -.grid-row:after,.grid-row:before{content:"";display:table;clear:both;} -[class*='grid-col']{float:left;min-height:1px;padding:8px;} -.grid-col-1{width:8.33333%;} -.grid-col-2{width:16.66667%;} -.grid-col-3{width:25%;} -.grid-col-4{width:33.33333%;} -.grid-col-5{width:41.66667%;} -.grid-col-6{width:50%;} -.grid-col-7{width:58.33333%;} -.grid-col-8{width:66.66667%;} -.grid-col-9{width:75%;} -.grid-col-10{width:83.33333%;} -.grid-col-11{width:91.66667%;} -.grid-col-12{width:100%;} -@media (min-width: 800px) and (max-width: 959px){.grid-col-md-1{width:8.33333%;} -.grid-col-md-2{width:16.66667%;} -.grid-col-md-3{width:25%;} -.grid-col-md-4{width:33.33333%;} -.grid-col-md-5{width:41.66667%;} -.grid-col-md-6{width:50%;} -.grid-col-md-7{width:58.33333%;} -.grid-col-md-8{width:66.66667%;} -.grid-col-md-9{width:75%;} -.grid-col-md-10{width:83.33333%;} -.grid-col-md-11{width:91.66667%;} -.grid-col-md-12{width:100%;} -} -@media (min-width: 960px){.grid-col-lg-1{width:8.33333%;} -.grid-col-lg-2{width:16.66667%;} -.grid-col-lg-3{width:25%;} -.grid-col-lg-4{width:33.33333%;} -.grid-col-lg-5{width:41.66667%;} -.grid-col-lg-6{width:50%;} -.grid-col-lg-7{width:58.33333%;} -.grid-col-lg-8{width:66.66667%;} -.grid-col-lg-9{width:75%;} -.grid-col-lg-10{width:83.33333%;} -.grid-col-lg-11{width:91.66667%;} -.grid-col-lg-12{width:100%;} -} -@media (min-width: 1600px){.grid-col-xlg-1{width:8.33333%;} -.grid-col-xlg-2{width:16.66667%;} -.grid-col-xlg-3{width:25%;} -.grid-col-xlg-4{width:33.33333%;} -.grid-col-xlg-5{width:41.66667%;} -.grid-col-xlg-6{width:50%;} -.grid-col-xlg-7{width:58.33333%;} -.grid-col-xlg-8{width:66.66667%;} -.grid-col-xlg-9{width:75%;} -.grid-col-xlg-10{width:83.33333%;} -.grid-col-xlg-11{width:91.66667%;} -.grid-col-xlg-12{width:100%;} -} -.alert{-webkit-transform:translate(-50%,-110%);-ms-transform:translate(-50%,-110%);transform:translate(-50%,-110%);-webkit-transition:-webkit-transform 0.6s ease-out;-moz-transition:-moz-transform 0.6s ease-out;transition:transform 0.6s ease-out;border-radius:0 0 2px 2px;display:table;color:rgba(255,255,255,0.87);background:#0091ea;overflow:hidden;position:fixed;z-index:3;top:0;left:50%;} -.alert .fa{float:left;height:48px;width:32px;line-height:48px;padding-left:16px;font-size:1.6rem;} -.alert .fa+.alert-message{padding-left:8px;width:calc(100% - 80px);} -.alert--on{-webkit-transform:translate(-50%,0);-ms-transform:translate(-50%,0);transform:translate(-50%,0);} -.alert--error{background:#f83c00;} -.alert--warning{background:#ffb300;} -.alert--success{background:#7cb342;} -.alert-message{padding:16px 8px 16px 16px;font-size:1.4rem;float:left;width:calc(100% - 48px);line-height:16px;} -.alert-close{width:48px;height:48px;line-height:48px;text-align:center;font-size:2.2rem;color:rgba(255,255,255,0.54);float:left;cursor:pointer;} -.alert-close:before{content:"×";} -.button,.actionButton,.outlineButton{height:48px;line-height:48px;font-size:16px;padding:0 20px;} -.button .fa,.actionButton .fa,.outlineButton .fa{margin-right:8px;} -.button--iconRight.button .fa,.button--iconRight.actionButton .fa,.button--iconRight.outlineButton .fa{margin:0 0 0 8px;float:right;} -.button,.actionButton{display:inline-block;text-align:center;color:#fff;} -.button:hover,.actionButton:hover{background:#666;} -.button:active,.actionButton:active{background:#4d4d4d;} -.button,.actionButton,.button[disabled],[disabled].actionButton,label.switch input[type="checkbox"][disabled]~.actionButton.switch-label,label.switch input[type="radio"][disabled]~.actionButton.switch-label,label.switch input[type="checkbox"][disabled]~.button.switch-label,label.switch input[type="radio"][disabled]~.button.switch-label{background:gray;} -.button--blue:hover,.actionButton--blue:hover{background:#0071b7;} -.button--blue:active,.actionButton--blue:active{background:#005284;} -.button--blue,.actionButton--blue,.button--blue[disabled],[disabled].actionButton--blue,label.switch input[type="checkbox"][disabled]~.actionButton--blue.switch-label,label.switch input[type="radio"][disabled]~.actionButton--blue.switch-label,label.switch input[type="checkbox"][disabled]~.button--blue.switch-label,label.switch input[type="radio"][disabled]~.button--blue.switch-label{background:#0091ea;} -.button--green:hover,.actionButton--green:hover{background:#628e34;} -.button--green:active,.actionButton--green:active{background:#486827;} -.button--green,.actionButton--green,.button--green[disabled],[disabled].actionButton--green,label.switch input[type="checkbox"][disabled]~.actionButton--green.switch-label,label.switch input[type="radio"][disabled]~.actionButton--green.switch-label,label.switch input[type="checkbox"][disabled]~.button--green.switch-label,label.switch input[type="radio"][disabled]~.button--green.switch-label{background:#7cb342;} -.button--yellow:hover,.actionButton--yellow:hover{background:#cc8f00;} -.button--yellow:active,.actionButton--yellow:active{background:#996b00;} -.button--yellow,.actionButton--yellow,.button--yellow[disabled],[disabled].actionButton--yellow,label.switch input[type="checkbox"][disabled]~.actionButton--yellow.switch-label,label.switch input[type="radio"][disabled]~.actionButton--yellow.switch-label,label.switch input[type="checkbox"][disabled]~.button--yellow.switch-label,label.switch input[type="radio"][disabled]~.button--yellow.switch-label{background:#ffb300;} -.button--orange:hover,.actionButton--orange:hover{background:#c87000;} -.button--orange:active,.actionButton--orange:active{background:#955300;} -.button--orange,.actionButton--orange,.button--orange[disabled],[disabled].actionButton--orange,label.switch input[type="checkbox"][disabled]~.actionButton--orange.switch-label,label.switch input[type="radio"][disabled]~.actionButton--orange.switch-label,label.switch input[type="checkbox"][disabled]~.button--orange.switch-label,label.switch input[type="radio"][disabled]~.button--orange.switch-label{background:#fb8c00;} -.button--red:hover,.actionButton--red:hover{background:#c53000;} -.button--red:active,.actionButton--red:active{background:#922300;} -.button--red,.actionButton--red,.button--red[disabled],[disabled].actionButton--red,label.switch input[type="checkbox"][disabled]~.actionButton--red.switch-label,label.switch input[type="radio"][disabled]~.actionButton--red.switch-label,label.switch input[type="checkbox"][disabled]~.button--red.switch-label,label.switch input[type="radio"][disabled]~.button--red.switch-label{background:#f83c00;} -.button--medium,.actionButton--medium,.flatButton{height:40px;line-height:40px;font-size:14px;padding:0 16px;} -.button--medium .fa,.actionButton--medium .fa,.flatButton .fa{margin-right:6px;} -.button--medium.button--iconRight .fa,.button--iconRight.actionButton--medium .fa,.button--iconRight.flatButton .fa{margin:0 0 0 6px;} -.button--small,.actionButton--small{height:32px;line-height:32px;font-size:12px;padding:0 12px;} -.button--small .fa,.actionButton--small .fa{margin-right:4px;} -.button--small.button--iconRight .fa,.button--iconRight.actionButton--small .fa{margin:0 0 0 4px;} -.button--caps,.actionButton--caps{height:24px;line-height:24px;font-size:10px;padding:0 8px;text-transform:uppercase;} -.button--caps .fa,.actionButton--caps .fa{margin-right:4px;} -.button--caps.button--iconRight .fa,.button--iconRight.actionButton--caps .fa{margin:0 0 0 4px;} -.button--block{width:100%;} -.button--iconRight{float:right;} -.actionButton:before{content:attr(label);} -.actionButton .fa{float:left;} -.actionButton.button--iconRight .fa{float:right;} -.actionButton--loading:after{content:"\2026";overflow:hidden;display:inline-block;vertical-align:bottom;-webkit-animation:ellipsis 1s infinite;animation:ellipsis 1s infinite;} -.actionButton--loading:before{content:attr(label-loading);} -.actionButton--done:after{content:"!";} -.actionButton--done:before{content:attr(label-done);} -.outlineButton{border:1px solid rgba(0,0,0,0.87);color:rgba(0,0,0,0.87);} -.outlineButton:hover:not([disabled]){color:#000;border-color:currentColor;} -.outlineButton--light{border:1px solid rgba(255,255,255,0.87);color:rgba(255,255,255,0.87);} -.outlineButton--light:hover:not([disabled]){color:#fff;border-color:currentColor;} -.outlineButton--blue{border:1px solid #0091ea;color:#0091ea;} -.outlineButton--blue:hover:not([disabled]){color:#0071b7;border-color:currentColor;} -.outlineButton--green{border:1px solid #7cb342;color:#7cb342;} -.outlineButton--green:hover:not([disabled]){color:#628e34;border-color:currentColor;} -.outlineButton--yellow{border:1px solid #ffb300;color:#ffb300;} -.outlineButton--yellow:hover:not([disabled]){color:#cc8f00;border-color:currentColor;} -.outlineButton--orange{border:1px solid #fb8c00;color:#fb8c00;} -.outlineButton--orange:hover:not([disabled]){color:#c87000;border-color:currentColor;} -.outlineButton--red{border:1px solid #f83c00;color:#f83c00;} -.outlineButton--red:hover:not([disabled]){color:#c53000;border-color:currentColor;} -.flatButton{text-transform:uppercase;} -.flatButton:hover{color:#666;} -.flatButton:active{color:#4d4d4d;} -.flatButton,.flatButton[disabled],label.switch input[type="checkbox"][disabled]~.flatButton.switch-label,label.switch input[type="radio"][disabled]~.flatButton.switch-label{color:gray;} -.flatButton--blue:hover{color:#0071b7;} -.flatButton--blue:active{color:#005284;} -.flatButton--blue,.flatButton--blue[disabled],label.switch input[type="checkbox"][disabled]~.flatButton--blue.switch-label,label.switch input[type="radio"][disabled]~.flatButton--blue.switch-label{color:#0091ea;} -.flatButton--green:hover{color:#628e34;} -.flatButton--green:active{color:#486827;} -.flatButton--green,.flatButton--green[disabled],label.switch input[type="checkbox"][disabled]~.flatButton--green.switch-label,label.switch input[type="radio"][disabled]~.flatButton--green.switch-label{color:#7cb342;} -.flatButton--yellow:hover{color:#cc8f00;} -.flatButton--yellow:active{color:#996b00;} -.flatButton--yellow,.flatButton--yellow[disabled],label.switch input[type="checkbox"][disabled]~.flatButton--yellow.switch-label,label.switch input[type="radio"][disabled]~.flatButton--yellow.switch-label{color:#ffb300;} -.flatButton--orange:hover{color:#c87000;} -.flatButton--orange:active{color:#955300;} -.flatButton--orange,.flatButton--orange[disabled],label.switch input[type="checkbox"][disabled]~.flatButton--orange.switch-label,label.switch input[type="radio"][disabled]~.flatButton--orange.switch-label{color:#fb8c00;} -.flatButton--red:hover{color:#c53000;} -.flatButton--red:active{color:#922300;} -.flatButton--red,.flatButton--red[disabled],label.switch input[type="checkbox"][disabled]~.flatButton--red.switch-label,label.switch input[type="radio"][disabled]~.flatButton--red.switch-label{color:#f83c00;} -.dialog{background:#fff;position:absolute;overflow:hidden;z-index:3;height:0;width:0;opacity:0;transform-origin:top left;transition:all 0.3s linear;} -.dialog:target{opacity:1;width:300px;height:300px;} -.dialog-content{opacity:0;transition:opacity 0.3s linear 0.3s;} -.dialog--show .dialog-content{opacity:1;} -.field{display:inline-block;position:relative;} -.field .fa,.field .field-validation{font-size:18px;right:16px;text-align:right;position:absolute;top:50%;-webkit-transform:translateY(-50%);-ms-transform:translateY(-50%);transform:translateY(-50%);} -.field--small input[type="text"],.field--small input[type="email"],.field--small input[type="password"],.field--small input[type="number"],.field--small input[type="date"],.field--small select,.field--small textarea{height:32px;font-size:1.3rem;} -.field--small input[type="text"]{padding:0 8px;} -.field--small select{padding:0 24px 0 8px;} -.field--small textarea{height:80px;padding:8px;line-height:1.2em;} -.field--small .fa,.field--small .field-validation{font-size:1.2rem;right:8px;} -.field--block{display:block;} -.field--block input[type="text"],.field--block input[type="email"],.field--block input[type="password"],.field--block input[type="number"],.field--block input[type="date"],.field--block select,.field--block textarea{width:100%;} -.field--error:before,.field--success:before{display:none;} -.field--error .fa,.field--success .fa{display:none;} -.field--error input[type="text"],.field--error input[type="email"],.field--error input[type="password"],.field--error input[type="number"],.field--error input[type="date"],.field--error textarea{border-color:rgba(248,60,0,0.54);box-shadow:inset 0 1px 3px -1px rgba(248,60,0,0.87);} -.field--error select{border:1px solid rgba(248,60,0,0.54);box-shadow:0 1px 2px 0 rgba(248,60,0,0.24),0 2px 2px 0 rgba(248,60,0,0.12);} -.field--success input[type="text"],.field--success input[type="email"],.field--success input[type="password"],.field--success input[type="number"],.field--success input[type="date"],.field--success textarea{border-color:rgba(124,179,66,0.54);box-shadow:inset 0 1px 3px -1px rgba(124,179,66,0.87);} -.field--success select{border:1px solid rgba(124,179,66,0.54);box-shadow:0 1px 2px 0 rgba(124,179,66,0.24),0 2px 2px 0 rgba(124,179,66,0.12);} -input[type="text"],input[type="email"],input[type="password"],input[type="number"],input[type="date"],textarea{border-radius:2px;display:inline-block;color:rgba(0,0,0,0.87);background:#fff;border:1px solid rgba(0,0,0,0.12);box-shadow:inset 0 1px 3px -1px rgba(0,0,0,0.26);height:48px;font-size:1.6rem;padding:0 16px;} -input[type="text"]:focus,input[type="email"]:focus,input[type="password"]:focus,input[type="number"]:focus,input[type="date"]:focus,textarea:focus{border-color:rgba(0,145,234,0.54);box-shadow:inset 0 1px 3px -1px rgba(0,145,234,0.87);} -input[type="text"]:focus~.input-suggestions,input[type="email"]:focus~.input-suggestions,input[type="password"]:focus~.input-suggestions,input[type="number"]:focus~.input-suggestions,input[type="date"]:focus~.input-suggestions,textarea:focus~.input-suggestions{display:block;} -input[type="text"][disabled],label.switch input[type="checkbox"][disabled]~input[type="text"].switch-label,label.switch input[type="radio"][disabled]~input[type="text"].switch-label,input[type="email"][disabled],label.switch input[type="checkbox"][disabled]~input[type="email"].switch-label,label.switch input[type="radio"][disabled]~input[type="email"].switch-label,input[type="password"][disabled],label.switch input[type="checkbox"][disabled]~input[type="password"].switch-label,label.switch input[type="radio"][disabled]~input[type="password"].switch-label,input[type="number"][disabled],label.switch input[type="checkbox"][disabled]~input[type="number"].switch-label,label.switch input[type="radio"][disabled]~input[type="number"].switch-label,input[type="date"][disabled],label.switch input[type="checkbox"][disabled]~input[type="date"].switch-label,label.switch input[type="radio"][disabled]~input[type="date"].switch-label,textarea[disabled],label.switch input[type="checkbox"][disabled]~textarea.switch-label,label.switch input[type="radio"][disabled]~textarea.switch-label{background:#f2f2f2;} -textarea{height:112px;padding:16px;resize:none;line-height:1.5em;} -.input-suggestions{display:none;background:#fff;border:1px solid rgba(0,0,0,0.12);border-radius:0 0 2px 2px;width:100%;max-height:216px;top:calc(100% - 2px);position:absolute;overflow-y:scroll;z-index:2;} -.input-suggestions:hover{display:inline-block;} -.field--small .input-suggestions{max-height:144px;} -.input-suggestions-item{color:rgba(0,0,0,0.54);font-size:1.6rem;height:48px;line-height:32px;padding:8px 16px;overflow:hidden;} -.input-suggestions-item b,.input-suggestions-item strong{color:#0091ea;} -.field--small .input-suggestions-item{font-size:1.3rem;height:32px;line-height:16px;padding:8px;} -.input-suggestions-item-image{float:left;border-radius:2px;width:32px;height:32px;margin-right:8px;} -.field--small .input-suggestions-item-image{height:24px;width:24px;} -.input-suggestions-item-wrapper{float:left;width:calc(100% - 40px);} -.field--small .input-suggestions-item-wrapper{width:calc(100% - 32px);} -.input-suggestions-item-title{line-height:16px;} -.field--small .input-suggestions-item-title{line-height:12px;} -.input-suggestions-item-description{color:rgba(0,0,0,0.26);font-size:1.2rem;line-height:16px;} -.field--small .input-suggestions-item-description{font-size:1.1rem;line-height:12px;} -select{cursor:pointer;background:#fff;border:0;height:48px;font-size:1.6rem;font-family:Roboto,sans-serif;padding:0 48px 0 16px;color:rgba(0,0,0,0.87);-webkit-appearance:none;-moz-appearance:none;appearance:none;} -.select:before{position:absolute;font-size:1.8rem;} -.select:before,.select .field-validation:before{line-height:48px;width:48px;right:0;padding-right:16px;text-align:right;cursor:pointer;pointer-events:none;border-radius:0 2px 2px 0;} -.select .field-validation{right:0;} -.select.field--small:before,.select.field--small .field-validation:before{font-size:1.2rem;line-height:32px;width:32px;padding-right:8px;} -.label,.outlineLabel{display:inline-block;color:#fff;height:24px;line-height:25px;font-size:15px;padding:0 8px;background:#808080;} -.label--medium{height:20px;line-height:21px;font-size:13px;padding:0 6px;} -.label--small{height:16px;line-height:15px;font-size:11px;padding:0 4px;} -.label--blue{background:#0091ea;} -.label--green{background:#7cb342;} -.label--yellow{background:#ffb300;} -.label--orange{background:#fb8c00;} -.label--red{background:#f83c00;} -.outlineLabel{background:0;color:#808080;border:1px solid currentColor;} -.outlineLabel--blue{color:#0091ea;} -.outlineLabel--green{color:#7cb342;} -.outlineLabel--yellow{color:#ffb300;} -.outlineLabel--orange{color:#fb8c00;} -.outlineLabel--red{color:#f83c00;} -.link{color:#0091ea;} -.link:hover{color:#0071b7;} -.link:active{color:#005284;} -.link--green{color:#7cb342;} -.link--green:hover{color:#628e34;} -.link--green:active{color:#486827;} -.link--yellow{color:#ffb300;} -.link--yellow:hover{color:#cc8f00;} -.link--yellow:active{color:#996b00;} -.link--orange{color:#fb8c00;} -.link--orange:hover{color:#c87000;} -.link--orange:active{color:#955300;} -.link--red{color:#f83c00;} -.link--red:hover{color:#c53000;} -.link--red:active{color:#922300;} -.link--white{color:rgba(255,255,255,0.87);} -.link--white:hover{color:#fff;} -.link--white:active{color:#fff;} -.link--gray{color:gray;} -.link--gray:hover{color:#666;} -.link--gray:active{color:#4d4d4d;} -.link--black{color:#333;} -.link--black:hover{color:#1a1a1a;} -.link--black:active{color:#1a1a1a;} -.modal:before{content:"";display:none;background:rgba(0,0,0,0.6);position:fixed;top:0;left:0;right:0;bottom:0;z-index:4;} -.modal--open:before,.modal:target:before{display:block;} -.modal--open .modal-box,.modal:target .modal-box{-webkit-transform:translate(-50%,0);-ms-transform:translate(-50%,0);transform:translate(-50%,0);top:0;} -.modal-box{-webkit-transform:translate(-50%,-100%);-ms-transform:translate(-50%,-100%);transform:translate(-50%,-100%);-webkit-transition:-webkit-transform 0.3s cubic-bezier(0.18,0.89,0.32,1.28);-moz-transition:-moz-transform 0.3s cubic-bezier(0.18,0.89,0.32,1.28);transition:transform 0.3s cubic-bezier(0.18,0.89,0.32,1.28);top:-1000px;width:100%;height:100%;background:#fff;overflow:hidden;position:fixed;left:50%;z-index:5;} -.modal-box-footer{padding:4px;height:48px;background:#fff;box-shadow:0 1px 7px 0 rgba(0,0,0,0.3);position:absolute;bottom:0;width:100%;text-align:right;} -.modal-box-footer~.modal-box-content{height:calc(100% - 48px);} -.modal-box-close{width:48px;height:48px;line-height:48px;text-align:center;font-size:2.2rem;color:rgba(0,0,0,0.54);cursor:pointer;position:absolute;top:0;right:0;} -.modal-box-close:before{content:"×";} -.modal-box-close~.modal-box-content{padding-right:64px;} -.modal-box-content{padding:16px;font-size:1.4rem;line-height:20px;overflow-y:scroll;height:100%;} -@media (min-width: 801px){.modal--open .modal-box,.modal:target .modal-box{top:calc((100% - 608px)/2);} -.modal-box{max-width:536px;max-height:608px;} -} -.spinner{height:48px;width:48px;padding:8px;border-radius:32px;-webkit-box-shadow:0 1px 4px 0 rgba(0,0,0,0.54);-ms-box-shadow:0 1px 4px 0 rgba(0,0,0,0.54);box-shadow:0 1px 4px 0 rgba(0,0,0,0.54);} -svg.spinner-inner{width:32px;-webkit-animation:spin 3s linear infinite;-moz-animation:spin 3s linear infinite;animation:spin 3s linear infinite;} -circle.spinner-inner-circle{stroke:#7cb342;fill:transparent;-webkit-animation:spinner-circle 3s linear infinite;-moz-animation:spinner-circle 3s linear infinite;animation:spinner-circle 3s linear infinite;stroke-width:24px;stroke-linecap:round;stroke-dasharray:300;stroke-miterlimit:10;stroke-dashoffset:0;} -.steps{width:100%;display:inline-block;position:relative;} -.steps--count3 .step{margin-left:calc(((100% - 144px) / 2));} -.steps--count3 .step:after{width:calc(((100% - 144px) / 2) + (24px));} -.steps--count4 .step{margin-left:calc(((100% - 192px) / 3));} -.steps--count4 .step:after{width:calc(((100% - 192px) / 3) + (24px));} -.steps--count5 .step{margin-left:calc(((100% - 240px) / 4));} -.steps--count5 .step:after{width:calc(((100% - 240px) / 4) + (24px));} -.step{width:48px;height:48px;float:left;} -.step:before{content:attr(data-step);width:24px;height:24px;position:absolute;margin:calc((48px - 24px) / 2);border-radius:50%;font-size:1.5rem;line-height:1.5em;color:#fff;text-align:center;background:#7cb342;} -.step:after{content:"";position:absolute;height:2px;display:block;margin:calc(23px) 0 0 calc(48px - ((48px - 24px) / 2));background:#7cb342;} -.step:first-child{margin-left:0;} -.step:last-child:after{width:0;} -.step--current:before{width:32px;height:32px;margin:calc((48px - 32px) / 2);z-index:0;font-size:1.8rem;line-height:1.8em;background:#0091ea;} -.step--current:after{z-index:-1;background:rgba(0,0,0,0.12);} -.step--current~.step:before{background:#b7c6cd;} -.step--current~.step:after{background:rgba(0,0,0,0.12);} -label.switch{position:relative;cursor:pointer;font-size:1.4em;} -label.switch input[type="checkbox"],label.switch input[type="radio"]{position:absolute;overflow:hidden;clip:rect(0 0 0 0);height:1px;width:1px;padding:0;border:0;} -label.switch input[type="checkbox"]:checked~.switch-label:before,label.switch input[type="radio"]:checked~.switch-label:before{opacity:1;} -label.switch input[type="checkbox"]:checked~.switch-label:after,label.switch input[type="radio"]:checked~.switch-label:after{background:#0091ea;} -label.switch input[type="checkbox"]~.switch-label:after{border-radius:2px;} -label.switch input[type="radio"]~.switch-label:after,label.switch input[type="radio"]~.switch-label:before{border-radius:50%;} -label.switch input[type="radio"]~.switch-label:before{content:"";background-color:currentColor;width:.61em;height:.61em;top:.305em;left:.305em;} -.switch-label{padding-left:1.83em;line-height:1.22em;position:relative;display:inline-block;} -.switch-label:after,.switch-label:before{position:absolute;left:0;top:0;width:1.22em;height:1.22em;line-height:1.22em;} -.switch-label:after{content:'';background:#fff;border:1px solid rgba(128,128,128,0.26);z-index:1;} -.switch-label:before{color:#fff;opacity:0;text-align:center;z-index:2;} -[tooltip]{z-index:1;position:relative;} -[tooltip]:after{font-family:Roboto,sans-serif;background-color:rgba(0,0,0,0.87);border-radius:2px;color:#fff;content:attr(tooltip);display:none;font-size:1.3rem;line-height:1.6rem;max-width:250px;min-width:150px;padding:8px;text-align:center;top:100%;position:absolute;left:50%;-webkit-transform:translateX(-50%);-ms-transform:translateX(-50%);transform:translateX(-50%);} -[tooltip]:hover{cursor:default;} -[tooltip]:hover:after{display:inline-block;}