spuit 0.0.14.2 → 0.1.0

Sign up to get free protection for your applications and to get access to all the features.
Files changed (51) hide show
  1. checksums.yaml +4 -4
  2. data/.npmignore +10 -6
  3. data/Gemfile.lock +1 -1
  4. data/README.md +20 -1
  5. data/assets/html/index.ejs +328 -0
  6. data/assets/javascripts/scripts.js +3 -3
  7. data/assets/stylesheets/styles.scss +8 -3
  8. data/dist/favicon.ico +0 -0
  9. data/dist/index.html +1 -323
  10. data/dist/javascripts/scripts.js +1 -1
  11. data/dist/stylesheets/styles.css +2 -2
  12. data/lib/spuit/version.rb +1 -1
  13. data/package.json +19 -18
  14. data/scss/{components → _}/_body.sass +0 -0
  15. data/scss/{components → _}/_form.sass +0 -0
  16. data/scss/{components → _}/_gist.sass +0 -0
  17. data/scss/{components → _}/_grids.sass +0 -0
  18. data/scss/{components → _}/_markdown.sass +0 -0
  19. data/scss/components/_button.scss +140 -0
  20. data/scss/components/_messages.scss +23 -0
  21. data/scss/components/{_shoulder.sass → _shoulder.scss} +6 -5
  22. data/scss/components/_split.scss +45 -0
  23. data/scss/components/_triangle.scss +50 -0
  24. data/scss/components/_wordwrap-fadeout.scss +22 -0
  25. data/scss/components/_wrap.scss +27 -0
  26. data/scss/elements/_dl.scss +40 -0
  27. data/scss/elements/_fieldset.scss +63 -0
  28. data/scss/elements/_hr.scss +39 -0
  29. data/scss/elements/_input.scss +35 -0
  30. data/scss/elements/_table.scss +102 -0
  31. data/scss/{components → includes}/_icon.scss +0 -0
  32. data/scss/spuit.scss +1 -4
  33. data/scss/variables/_timing-functions.scss +37 -0
  34. data/spuit.scss +1 -46
  35. data/webpack/css.webpack.config.js +37 -5
  36. data/webpack/js.webpack.config.js +13 -8
  37. data/yarn.lock +3390 -4480
  38. metadata +23 -22
  39. data/.editorconfig +0 -11
  40. data/scss/components/_button.sass +0 -116
  41. data/scss/components/_messages.sass +0 -18
  42. data/scss/components/_split.sass +0 -32
  43. data/scss/components/_triangle.sass +0 -40
  44. data/scss/components/_wordwrap-fadeout.sass +0 -19
  45. data/scss/components/_wrap.sass +0 -22
  46. data/scss/elements/_dl.sass +0 -30
  47. data/scss/elements/_fieldset.sass +0 -46
  48. data/scss/elements/_hr.sass +0 -36
  49. data/scss/elements/_input.sass +0 -27
  50. data/scss/elements/_table.sass +0 -58
  51. data/scss/variables/_timing-functions.sass +0 -37
@@ -1 +1 @@
1
- !function(e){var n={};function t(r){if(n[r])return n[r].exports;var o=n[r]={i:r,l:!1,exports:{}};return e[r].call(o.exports,o,o.exports,t),o.l=!0,o.exports}t.m=e,t.c=n,t.d=function(e,n,r){t.o(e,n)||Object.defineProperty(e,n,{configurable:!1,enumerable:!0,get:r})},t.r=function(e){Object.defineProperty(e,"__esModule",{value:!0})},t.n=function(e){var n=e&&e.__esModule?function(){return e.default}:function(){return e};return t.d(n,"a",n),n},t.o=function(e,n){return Object.prototype.hasOwnProperty.call(e,n)},t.p="",t(t.s=0)}([function(e,n){$(function(){})}]);
1
+ !function(e){var t={};function r(n){if(t[n])return t[n].exports;var o=t[n]={i:n,l:!1,exports:{}};return e[n].call(o.exports,o,o.exports,r),o.l=!0,o.exports}r.m=e,r.c=t,r.d=function(e,t,n){r.o(e,t)||Object.defineProperty(e,t,{enumerable:!0,get:n})},r.r=function(e){"undefined"!=typeof Symbol&&Symbol.toStringTag&&Object.defineProperty(e,Symbol.toStringTag,{value:"Module"}),Object.defineProperty(e,"__esModule",{value:!0})},r.t=function(e,t){if(1&t&&(e=r(e)),8&t)return e;if(4&t&&"object"==typeof e&&e&&e.__esModule)return e;var n=Object.create(null);if(r.r(n),Object.defineProperty(n,"default",{enumerable:!0,value:e}),2&t&&"string"!=typeof e)for(var o in e)r.d(n,o,function(t){return e[t]}.bind(null,o));return n},r.n=function(e){var t=e&&e.__esModule?function(){return e.default}:function(){return e};return r.d(t,"a",t),t},r.o=function(e,t){return Object.prototype.hasOwnProperty.call(e,t)},r.p="",r(r.s=0)}([function(e,t){}]);
@@ -1,3 +1,3 @@
1
- @import url(//fonts.googleapis.com/css?family=Open+Sans:400,300,700);@keyframes anim-spin{0%{transform:rotate(0deg)}to{transform:rotate(359deg)}}@keyframes anim-float{0%{transform:translateY(0)}50%{transform:translateY(20%)}to{transform:translateY(0)}}@keyframes anim-arrow{0%{transform:translateX(0)}50%{transform:translateX(20%)}to{transform:translateX(0)}}@keyframes anim-scale{0%{transform:scale(1)}50%{transform:scale(1.2)}to{transform:scale(1)}}
1
+ @charset "UTF-8";@import url(//fonts.googleapis.com/css?family=Open+Sans:400,300,700);@keyframes anim-spin{0%{transform:rotate(0deg)}to{transform:rotate(359deg)}}@keyframes anim-float{0%{transform:translateY(0)}50%{transform:translateY(20%)}to{transform:translateY(0)}}@keyframes anim-arrow{0%{transform:translateX(0)}50%{transform:translateX(20%)}to{transform:translateX(0)}}@keyframes anim-scale{0%{transform:scale(1)}50%{transform:scale(1.2)}to{transform:scale(1)}}
2
2
 
3
- /*! normalize.css v5.0.0 | MIT License | github.com/necolas/normalize.css */html{font-family:sans-serif;line-height:1.15;-ms-text-size-adjust:100%;-webkit-text-size-adjust:100%}body{margin:0}article,aside,footer,header,nav,section{display:block}h1{font-size:2em;margin:.67em 0}figcaption,figure,main{display:block}figure{margin:1em 40px}hr{box-sizing:content-box;height:0;overflow:visible}pre{font-family:monospace,monospace;font-size:1em}a{background-color:transparent;-webkit-text-decoration-skip:objects}a:active,a:hover{outline-width:0}abbr[title]{border-bottom:none;text-decoration:underline;text-decoration:underline dotted}b,strong{font-weight:inherit;font-weight:bolder}code,kbd,samp{font-family:monospace,monospace;font-size:1em}dfn{font-style:italic}mark{background-color:#ff0;color:#000}small{font-size:80%}sub,sup{font-size:75%;line-height:0;position:relative;vertical-align:baseline}sub{bottom:-.25em}sup{top:-.5em}audio,video{display:inline-block}audio:not([controls]){display:none;height:0}img{border-style:none}svg:not(:root){overflow:hidden}button,input,optgroup,select,textarea{font-family:sans-serif;font-size:100%;line-height:1.15;margin:0}button,input{overflow:visible}button,select{text-transform:none}[type=reset],[type=submit],button,html [type=button]{-webkit-appearance:button}[type=button]::-moz-focus-inner,[type=reset]::-moz-focus-inner,[type=submit]::-moz-focus-inner,button::-moz-focus-inner{border-style:none;padding:0}[type=button]:-moz-focusring,[type=reset]:-moz-focusring,[type=submit]:-moz-focusring,button:-moz-focusring{outline:1px dotted ButtonText}fieldset{border:1px solid silver;margin:0 2px;padding:.35em .625em .75em}legend{box-sizing:border-box;color:inherit;display:table;max-width:100%;padding:0;white-space:normal}progress{display:inline-block;vertical-align:baseline}textarea{overflow:auto}[type=checkbox],[type=radio]{box-sizing:border-box;padding:0}[type=number]::-webkit-inner-spin-button,[type=number]::-webkit-outer-spin-button{height:auto}[type=search]{-webkit-appearance:textfield;outline-offset:-2px}[type=search]::-webkit-search-cancel-button,[type=search]::-webkit-search-decoration{-webkit-appearance:none}::-webkit-file-upload-button{-webkit-appearance:button;font:inherit}details,menu{display:block}summary{display:list-item}canvas{display:inline-block}[hidden],template{display:none}.container{position:relative;margin-right:auto;margin-left:auto;box-sizing:border-box;padding-right:15px;padding-left:15px}@media (min-width:34em){.container{padding-right:15px;padding-left:15px}}@media (min-width:48em){.container{padding-right:15px;padding-left:15px}}@media (min-width:62em){.container{padding-right:15px;padding-left:15px}}@media (min-width:75em){.container{padding-right:15px;padding-left:15px}}@media (min-width:34em){.container{width:540px;max-width:100%;box-sizing:border-box}}@media (min-width:48em){.container{width:720px;max-width:100%;box-sizing:border-box}}@media (min-width:62em){.container{width:960px;max-width:100%;box-sizing:border-box}}@media (min-width:75em){.container{width:1140px;max-width:100%;box-sizing:border-box}}.container-fluid{position:relative;margin-right:auto;margin-left:auto;box-sizing:border-box;padding-right:15px;padding-left:15px}@media (min-width:34em){.container-fluid{padding-right:15px;padding-left:15px}}@media (min-width:48em){.container-fluid{padding-right:15px;padding-left:15px}}@media (min-width:62em){.container-fluid{padding-right:15px;padding-left:15px}}@media (min-width:75em){.container-fluid{padding-right:15px;padding-left:15px}}.row{display:flex;flex-wrap:wrap;box-sizing:border-box;margin-right:-15px;margin-left:-15px}@media (min-width:34em){.row{margin-right:-15px;margin-left:-15px}}@media (min-width:48em){.row{margin-right:-15px;margin-left:-15px}}@media (min-width:62em){.row{margin-right:-15px;margin-left:-15px}}@media (min-width:75em){.row{margin-right:-15px;margin-left:-15px}}.no-gutters{margin-right:0;margin-left:0}.no-gutters>.col,.no-gutters>[class*=col-]{padding-right:0;padding-left:0}.col,.col-1,.col-2,.col-3,.col-4,.col-5,.col-6,.col-7,.col-8,.col-9,.col-10,.col-11,.col-12,.col-lg,.col-lg-1,.col-lg-2,.col-lg-3,.col-lg-4,.col-lg-5,.col-lg-6,.col-lg-7,.col-lg-8,.col-lg-9,.col-lg-10,.col-lg-11,.col-lg-12,.col-md,.col-md-1,.col-md-2,.col-md-3,.col-md-4,.col-md-5,.col-md-6,.col-md-7,.col-md-8,.col-md-9,.col-md-10,.col-md-11,.col-md-12,.col-sm,.col-sm-1,.col-sm-2,.col-sm-3,.col-sm-4,.col-sm-5,.col-sm-6,.col-sm-7,.col-sm-8,.col-sm-9,.col-sm-10,.col-sm-11,.col-sm-12,.col-xl,.col-xl-1,.col-xl-2,.col-xl-3,.col-xl-4,.col-xl-5,.col-xl-6,.col-xl-7,.col-xl-8,.col-xl-9,.col-xl-10,.col-xl-11,.col-xl-12{position:relative;width:100%;min-height:1px;padding-right:15px;padding-left:15px;box-sizing:border-box}@media (min-width:34em){.col,.col-1,.col-2,.col-3,.col-4,.col-5,.col-6,.col-7,.col-8,.col-9,.col-10,.col-11,.col-12,.col-lg,.col-lg-1,.col-lg-2,.col-lg-3,.col-lg-4,.col-lg-5,.col-lg-6,.col-lg-7,.col-lg-8,.col-lg-9,.col-lg-10,.col-lg-11,.col-lg-12,.col-md,.col-md-1,.col-md-2,.col-md-3,.col-md-4,.col-md-5,.col-md-6,.col-md-7,.col-md-8,.col-md-9,.col-md-10,.col-md-11,.col-md-12,.col-sm,.col-sm-1,.col-sm-2,.col-sm-3,.col-sm-4,.col-sm-5,.col-sm-6,.col-sm-7,.col-sm-8,.col-sm-9,.col-sm-10,.col-sm-11,.col-sm-12,.col-xl,.col-xl-1,.col-xl-2,.col-xl-3,.col-xl-4,.col-xl-5,.col-xl-6,.col-xl-7,.col-xl-8,.col-xl-9,.col-xl-10,.col-xl-11,.col-xl-12{padding-right:15px;padding-left:15px;box-sizing:border-box}}@media (min-width:48em){.col,.col-1,.col-2,.col-3,.col-4,.col-5,.col-6,.col-7,.col-8,.col-9,.col-10,.col-11,.col-12,.col-lg,.col-lg-1,.col-lg-2,.col-lg-3,.col-lg-4,.col-lg-5,.col-lg-6,.col-lg-7,.col-lg-8,.col-lg-9,.col-lg-10,.col-lg-11,.col-lg-12,.col-md,.col-md-1,.col-md-2,.col-md-3,.col-md-4,.col-md-5,.col-md-6,.col-md-7,.col-md-8,.col-md-9,.col-md-10,.col-md-11,.col-md-12,.col-sm,.col-sm-1,.col-sm-2,.col-sm-3,.col-sm-4,.col-sm-5,.col-sm-6,.col-sm-7,.col-sm-8,.col-sm-9,.col-sm-10,.col-sm-11,.col-sm-12,.col-xl,.col-xl-1,.col-xl-2,.col-xl-3,.col-xl-4,.col-xl-5,.col-xl-6,.col-xl-7,.col-xl-8,.col-xl-9,.col-xl-10,.col-xl-11,.col-xl-12{padding-right:15px;padding-left:15px;box-sizing:border-box}}@media (min-width:62em){.col,.col-1,.col-2,.col-3,.col-4,.col-5,.col-6,.col-7,.col-8,.col-9,.col-10,.col-11,.col-12,.col-lg,.col-lg-1,.col-lg-2,.col-lg-3,.col-lg-4,.col-lg-5,.col-lg-6,.col-lg-7,.col-lg-8,.col-lg-9,.col-lg-10,.col-lg-11,.col-lg-12,.col-md,.col-md-1,.col-md-2,.col-md-3,.col-md-4,.col-md-5,.col-md-6,.col-md-7,.col-md-8,.col-md-9,.col-md-10,.col-md-11,.col-md-12,.col-sm,.col-sm-1,.col-sm-2,.col-sm-3,.col-sm-4,.col-sm-5,.col-sm-6,.col-sm-7,.col-sm-8,.col-sm-9,.col-sm-10,.col-sm-11,.col-sm-12,.col-xl,.col-xl-1,.col-xl-2,.col-xl-3,.col-xl-4,.col-xl-5,.col-xl-6,.col-xl-7,.col-xl-8,.col-xl-9,.col-xl-10,.col-xl-11,.col-xl-12{padding-right:15px;padding-left:15px;box-sizing:border-box}}@media (min-width:75em){.col,.col-1,.col-2,.col-3,.col-4,.col-5,.col-6,.col-7,.col-8,.col-9,.col-10,.col-11,.col-12,.col-lg,.col-lg-1,.col-lg-2,.col-lg-3,.col-lg-4,.col-lg-5,.col-lg-6,.col-lg-7,.col-lg-8,.col-lg-9,.col-lg-10,.col-lg-11,.col-lg-12,.col-md,.col-md-1,.col-md-2,.col-md-3,.col-md-4,.col-md-5,.col-md-6,.col-md-7,.col-md-8,.col-md-9,.col-md-10,.col-md-11,.col-md-12,.col-sm,.col-sm-1,.col-sm-2,.col-sm-3,.col-sm-4,.col-sm-5,.col-sm-6,.col-sm-7,.col-sm-8,.col-sm-9,.col-sm-10,.col-sm-11,.col-sm-12,.col-xl,.col-xl-1,.col-xl-2,.col-xl-3,.col-xl-4,.col-xl-5,.col-xl-6,.col-xl-7,.col-xl-8,.col-xl-9,.col-xl-10,.col-xl-11,.col-xl-12{padding-right:15px;padding-left:15px;box-sizing:border-box}}.col{flex-basis:0;flex-grow:1;max-width:100%}.col-auto{flex:0 0 auto;width:auto}.col-1{flex:0 0 8.33333%;max-width:8.33333%}.col-2{flex:0 0 16.66667%;max-width:16.66667%}.col-3{flex:0 0 25%;max-width:25%}.col-4{flex:0 0 33.33333%;max-width:33.33333%}.col-5{flex:0 0 41.66667%;max-width:41.66667%}.col-6{flex:0 0 50%;max-width:50%}.col-7{flex:0 0 58.33333%;max-width:58.33333%}.col-8{flex:0 0 66.66667%;max-width:66.66667%}.col-9{flex:0 0 75%;max-width:75%}.col-10{flex:0 0 83.33333%;max-width:83.33333%}.col-11{flex:0 0 91.66667%;max-width:91.66667%}.col-12{flex:0 0 100%;max-width:100%}.pull-0{right:auto}.pull-1{right:8.33333%}.pull-2{right:16.66667%}.pull-3{right:25%}.pull-4{right:33.33333%}.pull-5{right:41.66667%}.pull-6{right:50%}.pull-7{right:58.33333%}.pull-8{right:66.66667%}.pull-9{right:75%}.pull-10{right:83.33333%}.pull-11{right:91.66667%}.pull-12{right:100%}.push-0{left:auto}.push-1{left:8.33333%}.push-2{left:16.66667%}.push-3{left:25%}.push-4{left:33.33333%}.push-5{left:41.66667%}.push-6{left:50%}.push-7{left:58.33333%}.push-8{left:66.66667%}.push-9{left:75%}.push-10{left:83.33333%}.push-11{left:91.66667%}.push-12{left:100%}.offset-1{margin-left:8.33333%}.offset-2{margin-left:16.66667%}.offset-3{margin-left:25%}.offset-4{margin-left:33.33333%}.offset-5{margin-left:41.66667%}.offset-6{margin-left:50%}.offset-7{margin-left:58.33333%}.offset-8{margin-left:66.66667%}.offset-9{margin-left:75%}.offset-10{margin-left:83.33333%}.offset-11{margin-left:91.66667%}@media (min-width:34em){.col-sm{flex-basis:0;flex-grow:1;max-width:100%}.col-sm-auto{flex:0 0 auto;width:auto}.col-sm-1{flex:0 0 8.33333%;max-width:8.33333%}.col-sm-2{flex:0 0 16.66667%;max-width:16.66667%}.col-sm-3{flex:0 0 25%;max-width:25%}.col-sm-4{flex:0 0 33.33333%;max-width:33.33333%}.col-sm-5{flex:0 0 41.66667%;max-width:41.66667%}.col-sm-6{flex:0 0 50%;max-width:50%}.col-sm-7{flex:0 0 58.33333%;max-width:58.33333%}.col-sm-8{flex:0 0 66.66667%;max-width:66.66667%}.col-sm-9{flex:0 0 75%;max-width:75%}.col-sm-10{flex:0 0 83.33333%;max-width:83.33333%}.col-sm-11{flex:0 0 91.66667%;max-width:91.66667%}.col-sm-12{flex:0 0 100%;max-width:100%}.pull-sm-0{right:auto}.pull-sm-1{right:8.33333%}.pull-sm-2{right:16.66667%}.pull-sm-3{right:25%}.pull-sm-4{right:33.33333%}.pull-sm-5{right:41.66667%}.pull-sm-6{right:50%}.pull-sm-7{right:58.33333%}.pull-sm-8{right:66.66667%}.pull-sm-9{right:75%}.pull-sm-10{right:83.33333%}.pull-sm-11{right:91.66667%}.pull-sm-12{right:100%}.push-sm-0{left:auto}.push-sm-1{left:8.33333%}.push-sm-2{left:16.66667%}.push-sm-3{left:25%}.push-sm-4{left:33.33333%}.push-sm-5{left:41.66667%}.push-sm-6{left:50%}.push-sm-7{left:58.33333%}.push-sm-8{left:66.66667%}.push-sm-9{left:75%}.push-sm-10{left:83.33333%}.push-sm-11{left:91.66667%}.push-sm-12{left:100%}.offset-sm-0{margin-left:0}.offset-sm-1{margin-left:8.33333%}.offset-sm-2{margin-left:16.66667%}.offset-sm-3{margin-left:25%}.offset-sm-4{margin-left:33.33333%}.offset-sm-5{margin-left:41.66667%}.offset-sm-6{margin-left:50%}.offset-sm-7{margin-left:58.33333%}.offset-sm-8{margin-left:66.66667%}.offset-sm-9{margin-left:75%}.offset-sm-10{margin-left:83.33333%}.offset-sm-11{margin-left:91.66667%}}@media (min-width:48em){.col-md{flex-basis:0;flex-grow:1;max-width:100%}.col-md-auto{flex:0 0 auto;width:auto}.col-md-1{flex:0 0 8.33333%;max-width:8.33333%}.col-md-2{flex:0 0 16.66667%;max-width:16.66667%}.col-md-3{flex:0 0 25%;max-width:25%}.col-md-4{flex:0 0 33.33333%;max-width:33.33333%}.col-md-5{flex:0 0 41.66667%;max-width:41.66667%}.col-md-6{flex:0 0 50%;max-width:50%}.col-md-7{flex:0 0 58.33333%;max-width:58.33333%}.col-md-8{flex:0 0 66.66667%;max-width:66.66667%}.col-md-9{flex:0 0 75%;max-width:75%}.col-md-10{flex:0 0 83.33333%;max-width:83.33333%}.col-md-11{flex:0 0 91.66667%;max-width:91.66667%}.col-md-12{flex:0 0 100%;max-width:100%}.pull-md-0{right:auto}.pull-md-1{right:8.33333%}.pull-md-2{right:16.66667%}.pull-md-3{right:25%}.pull-md-4{right:33.33333%}.pull-md-5{right:41.66667%}.pull-md-6{right:50%}.pull-md-7{right:58.33333%}.pull-md-8{right:66.66667%}.pull-md-9{right:75%}.pull-md-10{right:83.33333%}.pull-md-11{right:91.66667%}.pull-md-12{right:100%}.push-md-0{left:auto}.push-md-1{left:8.33333%}.push-md-2{left:16.66667%}.push-md-3{left:25%}.push-md-4{left:33.33333%}.push-md-5{left:41.66667%}.push-md-6{left:50%}.push-md-7{left:58.33333%}.push-md-8{left:66.66667%}.push-md-9{left:75%}.push-md-10{left:83.33333%}.push-md-11{left:91.66667%}.push-md-12{left:100%}.offset-md-0{margin-left:0}.offset-md-1{margin-left:8.33333%}.offset-md-2{margin-left:16.66667%}.offset-md-3{margin-left:25%}.offset-md-4{margin-left:33.33333%}.offset-md-5{margin-left:41.66667%}.offset-md-6{margin-left:50%}.offset-md-7{margin-left:58.33333%}.offset-md-8{margin-left:66.66667%}.offset-md-9{margin-left:75%}.offset-md-10{margin-left:83.33333%}.offset-md-11{margin-left:91.66667%}}@media (min-width:62em){.col-lg{flex-basis:0;flex-grow:1;max-width:100%}.col-lg-auto{flex:0 0 auto;width:auto}.col-lg-1{flex:0 0 8.33333%;max-width:8.33333%}.col-lg-2{flex:0 0 16.66667%;max-width:16.66667%}.col-lg-3{flex:0 0 25%;max-width:25%}.col-lg-4{flex:0 0 33.33333%;max-width:33.33333%}.col-lg-5{flex:0 0 41.66667%;max-width:41.66667%}.col-lg-6{flex:0 0 50%;max-width:50%}.col-lg-7{flex:0 0 58.33333%;max-width:58.33333%}.col-lg-8{flex:0 0 66.66667%;max-width:66.66667%}.col-lg-9{flex:0 0 75%;max-width:75%}.col-lg-10{flex:0 0 83.33333%;max-width:83.33333%}.col-lg-11{flex:0 0 91.66667%;max-width:91.66667%}.col-lg-12{flex:0 0 100%;max-width:100%}.pull-lg-0{right:auto}.pull-lg-1{right:8.33333%}.pull-lg-2{right:16.66667%}.pull-lg-3{right:25%}.pull-lg-4{right:33.33333%}.pull-lg-5{right:41.66667%}.pull-lg-6{right:50%}.pull-lg-7{right:58.33333%}.pull-lg-8{right:66.66667%}.pull-lg-9{right:75%}.pull-lg-10{right:83.33333%}.pull-lg-11{right:91.66667%}.pull-lg-12{right:100%}.push-lg-0{left:auto}.push-lg-1{left:8.33333%}.push-lg-2{left:16.66667%}.push-lg-3{left:25%}.push-lg-4{left:33.33333%}.push-lg-5{left:41.66667%}.push-lg-6{left:50%}.push-lg-7{left:58.33333%}.push-lg-8{left:66.66667%}.push-lg-9{left:75%}.push-lg-10{left:83.33333%}.push-lg-11{left:91.66667%}.push-lg-12{left:100%}.offset-lg-0{margin-left:0}.offset-lg-1{margin-left:8.33333%}.offset-lg-2{margin-left:16.66667%}.offset-lg-3{margin-left:25%}.offset-lg-4{margin-left:33.33333%}.offset-lg-5{margin-left:41.66667%}.offset-lg-6{margin-left:50%}.offset-lg-7{margin-left:58.33333%}.offset-lg-8{margin-left:66.66667%}.offset-lg-9{margin-left:75%}.offset-lg-10{margin-left:83.33333%}.offset-lg-11{margin-left:91.66667%}}@media (min-width:75em){.col-xl{flex-basis:0;flex-grow:1;max-width:100%}.col-xl-auto{flex:0 0 auto;width:auto}.col-xl-1{flex:0 0 8.33333%;max-width:8.33333%}.col-xl-2{flex:0 0 16.66667%;max-width:16.66667%}.col-xl-3{flex:0 0 25%;max-width:25%}.col-xl-4{flex:0 0 33.33333%;max-width:33.33333%}.col-xl-5{flex:0 0 41.66667%;max-width:41.66667%}.col-xl-6{flex:0 0 50%;max-width:50%}.col-xl-7{flex:0 0 58.33333%;max-width:58.33333%}.col-xl-8{flex:0 0 66.66667%;max-width:66.66667%}.col-xl-9{flex:0 0 75%;max-width:75%}.col-xl-10{flex:0 0 83.33333%;max-width:83.33333%}.col-xl-11{flex:0 0 91.66667%;max-width:91.66667%}.col-xl-12{flex:0 0 100%;max-width:100%}.pull-xl-0{right:auto}.pull-xl-1{right:8.33333%}.pull-xl-2{right:16.66667%}.pull-xl-3{right:25%}.pull-xl-4{right:33.33333%}.pull-xl-5{right:41.66667%}.pull-xl-6{right:50%}.pull-xl-7{right:58.33333%}.pull-xl-8{right:66.66667%}.pull-xl-9{right:75%}.pull-xl-10{right:83.33333%}.pull-xl-11{right:91.66667%}.pull-xl-12{right:100%}.push-xl-0{left:auto}.push-xl-1{left:8.33333%}.push-xl-2{left:16.66667%}.push-xl-3{left:25%}.push-xl-4{left:33.33333%}.push-xl-5{left:41.66667%}.push-xl-6{left:50%}.push-xl-7{left:58.33333%}.push-xl-8{left:66.66667%}.push-xl-9{left:75%}.push-xl-10{left:83.33333%}.push-xl-11{left:91.66667%}.push-xl-12{left:100%}.offset-xl-0{margin-left:0}.offset-xl-1{margin-left:8.33333%}.offset-xl-2{margin-left:16.66667%}.offset-xl-3{margin-left:25%}.offset-xl-4{margin-left:33.33333%}.offset-xl-5{margin-left:41.66667%}.offset-xl-6{margin-left:50%}.offset-xl-7{margin-left:58.33333%}.offset-xl-8{margin-left:66.66667%}.offset-xl-9{margin-left:75%}.offset-xl-10{margin-left:83.33333%}.offset-xl-11{margin-left:91.66667%}}html{font-size:100%}@media (max-width:48em){html{font-size:80%}}body{font-family:Open Sans,\\30D2\30E9\30AE\30CE\89D2\30B4 Pro W3,Hiragino Kaku Gothic Pro,\\30E1\30A4\30EA\30AA,Meiryo,"\FF2D\FF33 \FF30\30B4\30B7\30C3\30AF",sans-serif;font-size:1rem;font-weight:400;line-height:normal}.demo-styles,body{color:#444}.demo-styles h1{font-size:2.8rem}.demo-styles h1,.demo-styles h2{font-family:Open Sans,\\30D2\30E9\30AE\30CE\89D2\30B4 Pro W3,Hiragino Kaku Gothic Pro,\\30E1\30A4\30EA\30AA,Meiryo,"\FF2D\FF33 \FF30\30B4\30B7\30C3\30AF",sans-serif;font-weight:400;line-height:normal;font-weight:300}.demo-styles h2{font-size:2rem}.demo-styles h3{font-size:1.6rem}.demo-styles h3,.demo-styles h4{font-family:Open Sans,\\30D2\30E9\30AE\30CE\89D2\30B4 Pro W3,Hiragino Kaku Gothic Pro,\\30E1\30A4\30EA\30AA,Meiryo,"\FF2D\FF33 \FF30\30B4\30B7\30C3\30AF",sans-serif;font-weight:400;line-height:normal}.demo-styles h4{font-size:1.5rem}.demo-styles h5{font-size:1.3rem}.demo-styles h5,.demo-styles h6{font-family:Open Sans,\\30D2\30E9\30AE\30CE\89D2\30B4 Pro W3,Hiragino Kaku Gothic Pro,\\30E1\30A4\30EA\30AA,Meiryo,"\FF2D\FF33 \FF30\30B4\30B7\30C3\30AF",sans-serif;font-weight:400;line-height:normal}.demo-styles h6{font-size:1.2rem}.demo-styles form,.demo-styles input[type=text],.demo-styles p{font-family:Open Sans,\\30D2\30E9\30AE\30CE\89D2\30B4 Pro W3,Hiragino Kaku Gothic Pro,\\30E1\30A4\30EA\30AA,Meiryo,"\FF2D\FF33 \FF30\30B4\30B7\30C3\30AF",sans-serif;font-size:1rem;font-weight:400;line-height:normal}.demo-styles input[type=text]{margin:0;padding:0;border-radius:0;background-image:linear-gradient(transparent,transparent);background:transparent;appearance:none;border:none;outline:none;text-decoration:none;font-size:inherit;display:inline-block;width:100%;padding:10px;box-sizing:border-box;line-height:1;border:1px solid #ddd}.demo-styles input[type=text]:focus{border:none;outline:none}.demo-styles input[type=text]::placeholder{font-size:inherit}.demo-styles input[type=text]:focus{outline:0}.demo-styles input[type=text]::placeholder{color:#ddd}.demo-styles input[type=text]:focus{border:1px solid rgba(82,158,246,.5);background:#fffff2}.demo-styles textarea{font-family:Open Sans,\\30D2\30E9\30AE\30CE\89D2\30B4 Pro W3,Hiragino Kaku Gothic Pro,\\30E1\30A4\30EA\30AA,Meiryo,"\FF2D\FF33 \FF30\30B4\30B7\30C3\30AF",sans-serif;font-size:1rem;font-weight:400;line-height:normal;margin:0;padding:0;border-radius:0;background-image:linear-gradient(transparent,transparent);background:transparent;appearance:none;border:none;outline:none;text-decoration:none;font-size:inherit;display:inline-block;width:100%;padding:10px;box-sizing:border-box;line-height:1;border:1px solid #ddd;line-height:1.6rem;height:120px}.demo-styles textarea:focus{border:none;outline:none}.demo-styles textarea::placeholder{font-size:inherit}.demo-styles textarea:focus{outline:0}.demo-styles textarea::placeholder{color:#ddd}.demo-styles textarea:focus{border:1px solid rgba(82,158,246,.5);background:#fffff2}.demo-styles legend{font-family:Open Sans,\\30D2\30E9\30AE\30CE\89D2\30B4 Pro W3,Hiragino Kaku Gothic Pro,\\30E1\30A4\30EA\30AA,Meiryo,"\FF2D\FF33 \FF30\30B4\30B7\30C3\30AF",sans-serif;font-size:inherit;font-weight:400;line-height:normal}.demo-styles .radio{margin:0;display:inline-block;vertical-align:top}.demo-styles .radio input[type=radio]{display:inline-block;margin:0 4px 0 0}.demo-styles .radio label{margin:0;padding:0;line-height:1;cursor:pointer;display:inline-block}.demo-styles .radio label:before{content:url("data:image/svg+xml;base64,DQo8c3ZnIHdpZHRoPSI2cHgiIGhlaWdodD0iNnB4IiB2aWV3Qm94PSIxMTEgMjMwIDYgNiIgdmVyc2lvbj0iMS4xIiB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHhtbG5zOnhsaW5rPSJodHRwOi8vd3d3LnczLm9yZy8xOTk5L3hsaW5rIj4NCiAgICA8IS0tIEdlbmVyYXRvcjogU2tldGNoIDQyICgzNjc4MSkgLSBodHRwOi8vd3d3LmJvaGVtaWFuY29kaW5nLmNvbS9za2V0Y2ggLS0+DQogICAgPGRlc2M+Q3JlYXRlZCB3aXRoIFNrZXRjaC48L2Rlc2M+DQogICAgPGRlZnM+PC9kZWZzPg0KICAgIDxyZWN0IGlkPSJjaXJjbGUiIHN0cm9rZT0ibm9uZSIgZmlsbD0iI0ZGRkZGRiIgZmlsbC1ydWxlPSJldmVub2RkIiB4PSIxMTEiIHk9IjIzMCIgd2lkdGg9IjYiIGhlaWdodD0iNiIgcng9IjMiPjwvcmVjdD4NCjwvc3ZnPg==");vertical-align:middle;box-sizing:border-box;text-align:center;background:#fff;width:18px;height:18px;line-height:10px;padding:0;border:1px solid #ddd;display:inline-block;border-radius:18px}.demo-styles .radio label:hover:before{border-color:#529ef6}.demo-styles .radio input[type=radio]{display:none}.demo-styles .radio input[type=radio]:checked+label:before{background-color:#529ef6}.demo-styles .radio-inside{margin:0;display:inline-block;vertical-align:top}.demo-styles .radio-inside input[type=radio]{display:inline-block;margin:0 4px 0 0}.demo-styles .radio-inside label{cursor:pointer;margin:0}.demo-styles .radio-inside span{margin:0;padding:0;line-height:1;cursor:pointer;display:inline-block}.demo-styles .radio-inside span:before{content:url("data:image/svg+xml;base64,DQo8c3ZnIHdpZHRoPSI2cHgiIGhlaWdodD0iNnB4IiB2aWV3Qm94PSIxMTEgMjMwIDYgNiIgdmVyc2lvbj0iMS4xIiB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHhtbG5zOnhsaW5rPSJodHRwOi8vd3d3LnczLm9yZy8xOTk5L3hsaW5rIj4NCiAgICA8IS0tIEdlbmVyYXRvcjogU2tldGNoIDQyICgzNjc4MSkgLSBodHRwOi8vd3d3LmJvaGVtaWFuY29kaW5nLmNvbS9za2V0Y2ggLS0+DQogICAgPGRlc2M+Q3JlYXRlZCB3aXRoIFNrZXRjaC48L2Rlc2M+DQogICAgPGRlZnM+PC9kZWZzPg0KICAgIDxyZWN0IGlkPSJjaXJjbGUiIHN0cm9rZT0ibm9uZSIgZmlsbD0iI0ZGRkZGRiIgZmlsbC1ydWxlPSJldmVub2RkIiB4PSIxMTEiIHk9IjIzMCIgd2lkdGg9IjYiIGhlaWdodD0iNiIgcng9IjMiPjwvcmVjdD4NCjwvc3ZnPg==");vertical-align:middle;box-sizing:border-box;text-align:center;background:#fff;width:18px;height:18px;line-height:10px;padding:0;border:1px solid #ddd;display:inline-block;border-radius:18px}.demo-styles .radio-inside span:hover:before{border-color:#529ef6}.demo-styles .radio-inside input[type=radio]{display:none}.demo-styles .radio-inside input[type=radio]:checked+span:before{background-color:#529ef6}.demo-styles .checkbox{margin:0;display:inline-block;vertical-align:top}.demo-styles .checkbox input[type=checkbox]{display:inline-block;margin:0 4px 0 0}.demo-styles .checkbox label{margin:0;padding:0;line-height:1;cursor:pointer}.demo-styles .checkbox label:before{content:url("data:image/svg+xml;base64,DQo8c3ZnIHdpZHRoPSIxMXB4IiBoZWlnaHQ9IjExcHgiIHZpZXdCb3g9Ijg2IDIyNiAxMSAxMSIgdmVyc2lvbj0iMS4xIiB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHhtbG5zOnhsaW5rPSJodHRwOi8vd3d3LnczLm9yZy8xOTk5L3hsaW5rIj4NCiAgICA8IS0tIEdlbmVyYXRvcjogU2tldGNoIDQyICgzNjc4MSkgLSBodHRwOi8vd3d3LmJvaGVtaWFuY29kaW5nLmNvbS9za2V0Y2ggLS0+DQogICAgPGRlc2M+Q3JlYXRlZCB3aXRoIFNrZXRjaC48L2Rlc2M+DQogICAgPGRlZnM+PC9kZWZzPg0KICAgIDxwYXRoIGQ9Ik04OS4yOTI4OTMyLDIzMi43MDcxMDcgTDk1LjI5Mjg5MzIsMjMyLjcwNzEwNyBMOTUuMjkyODkzMiwyMzQuNzA3MTA3IEw4Ny4yOTI4OTMyLDIzNC43MDcxMDcgTDg3LjI5Mjg5MzIsMjMzLjcwNzEwNyBMODcuMjkyODkzMiwyMjguNzA3MTA3IEw4OS4yOTI4OTMyLDIyOC43MDcxMDcgTDg5LjI5Mjg5MzIsMjMyLjcwNzEwNyBaIiBpZD0iY2hlY2siIHN0cm9rZT0ibm9uZSIgZmlsbD0iI0ZGRkZGRiIgZmlsbC1ydWxlPSJldmVub2RkIiB0cmFuc2Zvcm09InRyYW5zbGF0ZSg5MS4yOTI4OTMsIDIzMS43MDcxMDcpIHJvdGF0ZSgtNDUuMDAwMDAwKSB0cmFuc2xhdGUoLTkxLjI5Mjg5MywgLTIzMS43MDcxMDcpICI+PC9wYXRoPg0KPC9zdmc+");vertical-align:middle;box-sizing:border-box;text-align:center;background:#fff;width:18px;height:18px;line-height:13px;padding:0 0 0 1px;border:1px solid #ddd;display:inline-block;border-radius:3px}.demo-styles .checkbox label:hover:before{border-color:#529ef6}.demo-styles .checkbox input[type=checkbox]{display:none}.demo-styles .checkbox input[type=checkbox]:checked+label:before{background:#529ef6}.demo-styles .checkbox-inside{margin:0;display:inline-block;vertical-align:top}.demo-styles .checkbox-inside input[type=checkbox]{display:inline-block;margin:0 4px 0 0}.demo-styles .checkbox-inside label{cursor:pointer;margin:0}.demo-styles .checkbox-inside span{margin:0;padding:0;line-height:1;cursor:pointer}.demo-styles .checkbox-inside span:before{content:url("data:image/svg+xml;base64,DQo8c3ZnIHdpZHRoPSIxMXB4IiBoZWlnaHQ9IjExcHgiIHZpZXdCb3g9Ijg2IDIyNiAxMSAxMSIgdmVyc2lvbj0iMS4xIiB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHhtbG5zOnhsaW5rPSJodHRwOi8vd3d3LnczLm9yZy8xOTk5L3hsaW5rIj4NCiAgICA8IS0tIEdlbmVyYXRvcjogU2tldGNoIDQyICgzNjc4MSkgLSBodHRwOi8vd3d3LmJvaGVtaWFuY29kaW5nLmNvbS9za2V0Y2ggLS0+DQogICAgPGRlc2M+Q3JlYXRlZCB3aXRoIFNrZXRjaC48L2Rlc2M+DQogICAgPGRlZnM+PC9kZWZzPg0KICAgIDxwYXRoIGQ9Ik04OS4yOTI4OTMyLDIzMi43MDcxMDcgTDk1LjI5Mjg5MzIsMjMyLjcwNzEwNyBMOTUuMjkyODkzMiwyMzQuNzA3MTA3IEw4Ny4yOTI4OTMyLDIzNC43MDcxMDcgTDg3LjI5Mjg5MzIsMjMzLjcwNzEwNyBMODcuMjkyODkzMiwyMjguNzA3MTA3IEw4OS4yOTI4OTMyLDIyOC43MDcxMDcgTDg5LjI5Mjg5MzIsMjMyLjcwNzEwNyBaIiBpZD0iY2hlY2siIHN0cm9rZT0ibm9uZSIgZmlsbD0iI0ZGRkZGRiIgZmlsbC1ydWxlPSJldmVub2RkIiB0cmFuc2Zvcm09InRyYW5zbGF0ZSg5MS4yOTI4OTMsIDIzMS43MDcxMDcpIHJvdGF0ZSgtNDUuMDAwMDAwKSB0cmFuc2xhdGUoLTkxLjI5Mjg5MywgLTIzMS43MDcxMDcpICI+PC9wYXRoPg0KPC9zdmc+");vertical-align:middle;box-sizing:border-box;text-align:center;background:#fff;width:18px;height:18px;line-height:13px;padding:0 0 0 1px;border:1px solid #ddd;display:inline-block;border-radius:3px}.demo-styles .checkbox-inside span:hover:before{border-color:#529ef6}.demo-styles .checkbox-inside input[type=checkbox]{display:none}.demo-styles .checkbox-inside input[type=checkbox]:checked+span:before{background:#529ef6}.demo-styles .select{padding:0;margin:0;border:1px solid #ccc;width:200px;border-radius:3px;overflow:hidden;background-color:#fff;background-image:url("data:image/svg+xml;base64,DQo8c3ZnIHdpZHRoPSI2cHgiIGhlaWdodD0iMTBweCIgdmlld0JveD0iMTQ3IDIyNSA2IDEwIiB2ZXJzaW9uPSIxLjEiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyIgeG1sbnM6eGxpbms9Imh0dHA6Ly93d3cudzMub3JnLzE5OTkveGxpbmsiPg0KICAgIDwhLS0gR2VuZXJhdG9yOiBTa2V0Y2ggNDIgKDM2NzgxKSAtIGh0dHA6Ly93d3cuYm9oZW1pYW5jb2RpbmcuY29tL3NrZXRjaCAtLT4NCiAgICA8ZGVzYz5DcmVhdGVkIHdpdGggU2tldGNoLjwvZGVzYz4NCiAgICA8ZGVmcz48L2RlZnM+DQogICAgPHBhdGggZD0iTTE1MCwyMjUgTDE1MywyMjkgTDE0NywyMjkgTDE1MCwyMjUgWiBNMTUwLDIzNSBMMTQ3LDIzMSBMMTUzLDIzMSBMMTUwLDIzNSBaIiBpZD0iQ29tYmluZWQtU2hhcGUiIHN0cm9rZT0ibm9uZSIgZmlsbD0iIzAwMDAwMCIgZmlsbC1ydWxlPSJldmVub2RkIj48L3BhdGg+DQo8L3N2Zz4=");background-repeat:no-repeat;background-position:right 12px top 15px;background-size:6px 10px}.demo-styles .select select{padding:5px 12px;width:130%;height:40px;border:none;box-shadow:none;background-color:transparent;background-image:none;appearance:none;cursor:pointer}.demo-styles .select select:focus{outline:none}.demo-styles .table{font-family:Open Sans,\\30D2\30E9\30AE\30CE\89D2\30B4 Pro W3,Hiragino Kaku Gothic Pro,\\30E1\30A4\30EA\30AA,Meiryo,"\FF2D\FF33 \FF30\30B4\30B7\30C3\30AF",sans-serif;font-size:1rem;font-weight:400;line-height:normal;width:100%;border-collapse:collapse;margin-bottom:0;border-top:1px solid #eee;margin-bottom:10px}.demo-styles .table th{font-weight:700}.demo-styles .table td,.demo-styles .table th{padding:5px 10px}.demo-styles .table thead tr td,.demo-styles .table thead tr th{font-size:.8rem;border:1px solid #eee;border-bottom:2px solid #eee}.demo-styles .table tbody tr:first-child td,.demo-styles .table tbody tr:first-child th{border-top:none}.demo-styles .table tbody th{border:1px solid #eee;border-bottom:2px solid #eee}.demo-styles .table tbody td{border:1px solid #eee}.demo-styles .table-line{width:100%;border-collapse:collapse;margin-bottom:0;margin-bottom:10px}.demo-styles .table-line th{font-weight:700}.demo-styles .table-line td,.demo-styles .table-line th{padding:5px 10px}.demo-styles .table-line thead tr td,.demo-styles .table-line thead tr th{border-bottom:2px solid #eee}.demo-styles .table-line tr:first-child td,.demo-styles .table-line tr:first-child th{border-top:none}.demo-styles .table-line td,.demo-styles .table-line th{border-top:1px solid #eee}.demo-styles .table-stripe{width:100%;border-collapse:collapse;margin-bottom:0;margin-bottom:10px}.demo-styles .table-stripe th{font-weight:700}.demo-styles .table-stripe td,.demo-styles .table-stripe th{padding:5px 10px}.demo-styles .table-stripe thead tr{background-color:#fff}.demo-styles .table-stripe tbody tr:nth-child(2n){background-color:#eee}.demo-styles .table-stripe tbody tr:nth-child(odd){background-color:#f8f8f8}.demo-styles .fieldset{display:flex;justify-content:space-between;align-items:center;min-width:0;padding:0;margin:0 0 10px;border:0}.demo-styles .fieldset:last-child,.demo-styles .fieldset label,.demo-styles .fieldset legend{margin-bottom:0}.demo-styles .fieldset>legend{width:30%;padding-right:20px}.demo-styles .fieldset>:not(legend){flex:1}.demo-styles .button{font-family:Open Sans,\\30D2\30E9\30AE\30CE\89D2\30B4 Pro W3,Hiragino Kaku Gothic Pro,\\30E1\30A4\30EA\30AA,Meiryo,"\FF2D\FF33 \FF30\30B4\30B7\30C3\30AF",sans-serif;font-size:1rem;line-height:normal;box-sizing:border-box;box-shadow:none;appearance:none;display:inline-block;border-radius:0;background-color:transparent;background-image:linear-gradient(0deg,transparent,transparent);position:relative;cursor:pointer;text-align:center;font-weight:400;margin:0;padding:0;border:none;outline:none;border-radius:2px;border:1px solid #529ef6;background-color:#529ef6;color:#fff;padding:10px;line-height:1}.demo-styles .button:active,.demo-styles .button:hover,.demo-styles .button:link,.demo-styles .button:visited{text-decoration:none}.demo-styles .button:focus{outline:none}.demo-styles .button.is-disabled,.demo-styles .button:disabled{cursor:default;pointer-events:none;opacity:.2}.demo-styles .button:focus{background-color:#529ef6}.demo-styles .button.is-current,.demo-styles .button:active,.demo-styles .button:hover{background-color:#2283f3;color:#fff;border-color:#529ef6}.demo-styles .button-semiflat{font-family:Open Sans,\\30D2\30E9\30AE\30CE\89D2\30B4 Pro W3,Hiragino Kaku Gothic Pro,\\30E1\30A4\30EA\30AA,Meiryo,"\FF2D\FF33 \FF30\30B4\30B7\30C3\30AF",sans-serif;font-size:1rem;line-height:normal;box-sizing:border-box;box-shadow:none;appearance:none;display:inline-block;border-radius:0;background-color:transparent;background-image:linear-gradient(0deg,transparent,transparent);position:relative;cursor:pointer;text-align:center;font-weight:400;margin:0;padding:0;border:none;outline:none;border-radius:4px;background-color:#529ef6;background-image:linear-gradient(0deg,#529ef6,#6aacf7);border:1px solid #6aacf7;color:#fff;padding:10px;line-height:1}.demo-styles .button-semiflat:active,.demo-styles .button-semiflat:hover,.demo-styles .button-semiflat:link,.demo-styles .button-semiflat:visited{text-decoration:none}.demo-styles .button-semiflat:focus{outline:none}.demo-styles .button-semiflat.is-disabled,.demo-styles .button-semiflat:disabled{cursor:default;pointer-events:none;opacity:.2}.demo-styles .button-semiflat:focus{background-color:#529ef6;background-image:linear-gradient(0deg,#529ef6,#6aacf7)}.demo-styles .button-semiflat.is-current,.demo-styles .button-semiflat:active,.demo-styles .button-semiflat:hover{background-color:#3a90f5;background-image:linear-gradient(0deg,#3a90f5,#529ef6)}.demo-styles .button-border{font-family:Open Sans,\\30D2\30E9\30AE\30CE\89D2\30B4 Pro W3,Hiragino Kaku Gothic Pro,\\30E1\30A4\30EA\30AA,Meiryo,"\FF2D\FF33 \FF30\30B4\30B7\30C3\30AF",sans-serif;font-size:1rem;line-height:normal;box-sizing:border-box;box-shadow:none;appearance:none;display:inline-block;border-radius:0;background-image:linear-gradient(0deg,transparent,transparent);position:relative;cursor:pointer;text-align:center;font-weight:400;margin:0;padding:0;border:none;outline:none;border-radius:2px;background-color:transparent;padding:10px;border:1px solid #529ef6;color:#529ef6;line-height:1}.demo-styles .button-border:active,.demo-styles .button-border:hover,.demo-styles .button-border:link,.demo-styles .button-border:visited{text-decoration:none}.demo-styles .button-border:focus{outline:none}.demo-styles .button-border.is-disabled,.demo-styles .button-border:disabled{cursor:default;pointer-events:none;opacity:.2}.demo-styles .button-border:focus{background-color:transparent;border:1px solid #529ef6}.demo-styles .button-border.is-current,.demo-styles .button-border:active,.demo-styles .button-border:hover{background-color:#529ef6;color:#fff;border-color:transparet}.demo-styles .button-emboss{font-family:Open Sans,\\30D2\30E9\30AE\30CE\89D2\30B4 Pro W3,Hiragino Kaku Gothic Pro,\\30E1\30A4\30EA\30AA,Meiryo,"\FF2D\FF33 \FF30\30B4\30B7\30C3\30AF",sans-serif;font-size:1rem;line-height:normal;box-sizing:border-box;box-shadow:none;appearance:none;display:inline-block;border-radius:0;background-color:transparent;background-image:linear-gradient(0deg,transparent,transparent);position:relative;cursor:pointer;text-align:center;font-weight:400;margin:0;padding:0;border:none;outline:none;transition:all .05s ease-out;transform:translateY(-6px);box-shadow:0 6px 0 #2283f3;border-radius:4px;background-color:#529ef6;color:#fff;padding:10px;line-height:1}.demo-styles .button-emboss:active,.demo-styles .button-emboss:hover,.demo-styles .button-emboss:link,.demo-styles .button-emboss:visited{text-decoration:none}.demo-styles .button-emboss:focus{outline:none}.demo-styles .button-emboss.is-disabled,.demo-styles .button-emboss:disabled{cursor:default;pointer-events:none;opacity:.2}.demo-styles .button-emboss:focus{background-color:#529ef6;box-shadow:0 6px 0 #2283f3}.demo-styles .button-emboss.is-current,.demo-styles .button-emboss:active,.demo-styles .button-emboss:hover{transform:translateY(0);box-shadow:0 0 0 #529ef6;background-color:#2283f3}.demo-styles .button-group{display:flex;justify-content:space-between}.demo-styles .button-group>*{width:100%;border-radius:0}.demo-styles .button-group>:first-child{border-radius:3px 0 0 3px}.demo-styles .button-group>:last-child{border-radius:0 3px 3px 0}.demo-styles .switch input[type=checkbox]{display:none}.demo-styles .switch label{cursor:pointer;text-indent:-9999px;width:38px;height:20px;background:grey;display:block;border-radius:20px;position:relative}.demo-styles .switch label:after{content:"";position:absolute;top:2px;left:2px;width:16px;height:16px;background:#fff;border-radius:16px;transition:.3s}.demo-styles .switch input:checked+label{background:#529ef6}.demo-styles .switch input:checked+label:after{left:calc(100% - 2px);transform:translateX(-100%)}.demo-styles .switch label:active:after{width:20px}.demo-styles .reset-ul{margin:0;padding:0;list-style:none;display:inline-block}.demo-styles .reset-ul>li{display:inline-block}.demo-styles .word-break{white-space:normal;word-break:break-all;word-wrap:break-word}.demo-styles .word-break,.demo-styles .word-break-none{display:inline-block;width:100px;background:#f8f8f8;padding:10px}.demo-styles .word-break-none{white-space:nowrap;word-break:keep-all;word-wrap:normal}.demo-styles .text-overflow{overflow:hidden;white-space:nowrap;text-overflow:ellipsis;display:inline-block;width:100px;background:#f8f8f8;padding:10px}.demo-styles .icon-hamburger:before{background-color:#000;background-image:url("data:image/svg+xml;charset=utf-8,%3Csvg width='28' height='24' viewBox='6 8 28 24' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath fill='%23FFF' fill-rule='evenodd' d='M6 8h28v4H6zM6 18h28v4H6zM6 28h28v4H6z'/%3E%3C/svg%3E");background-size:45% 45%}.demo-styles .icon-hamburger:before,.demo-styles .icon-twitter:before{content:"";width:40px;height:40px;display:inline-block;background-repeat:no-repeat;background-position:50%}.demo-styles .icon-twitter:before{background-color:#1da1f2;background-image:url("data:image/svg+xml;charset=utf-8,%3Csvg width='26' height='22' viewBox='8 9 26 22' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M16.27 30.611c9.622 0 14.885-7.972 14.885-14.886 0-.226 0-.451-.015-.676a10.645 10.645 0 0 0 2.61-2.708c-.955.423-1.968.7-3.005.823a5.25 5.25 0 0 0 2.3-2.894 10.485 10.485 0 0 1-3.322 1.27 5.237 5.237 0 0 0-8.916 4.772 14.853 14.853 0 0 1-10.782-5.466 5.236 5.236 0 0 0 1.62 6.984 5.193 5.193 0 0 1-2.375-.655v.066a5.234 5.234 0 0 0 4.197 5.129c-.77.21-1.578.24-2.362.09a5.238 5.238 0 0 0 4.888 3.633A10.498 10.498 0 0 1 8.25 28.26a14.811 14.811 0 0 0 8.02 2.346' fill='%23FFF'/%3E%3C/svg%3E");background-size:60% 60%}.demo-styles .icon-facebook:before{background-color:#3c5999;background-image:url("data:image/svg+xml;charset=utf-8,%3Csvg width='18' height='34' viewBox='16 6 18 34' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M27.485 39.984V24.558h5.178l.776-6.012h-5.954v-3.838c0-1.74.484-2.927 2.98-2.927l3.183-.001V6.403c-.55-.073-2.44-.237-4.639-.237-4.59 0-7.732 2.801-7.732 7.947v4.433h-5.191v6.012h5.191v15.426h6.208z' fill='%23FEFEFE' fill-rule='evenodd'/%3E%3C/svg%3E");background-size:60% 60%}.demo-styles .icon-facebook:before,.demo-styles .icon-hatena:before{content:"";width:40px;height:40px;display:inline-block;background-repeat:no-repeat;background-position:50%}.demo-styles .icon-hatena:before{background-color:#2d92ba;background-image:url("data:image/svg+xml;charset=utf-8,%3Csvg width='22' height='20' viewBox='9 10 22 20' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M17.915 25.366c-.484.298-1.318.444-2.489.444h-1.732v-3.973h1.807c1.202 0 2.033.152 2.475.454.45.302.67.836.67 1.602 0 .685-.242 1.178-.73 1.473zm-4.22-10.426h1.064c1.23 0 2.056.139 2.482.415.42.278.635.757.635 1.44 0 .657-.228 1.12-.68 1.392-.457.266-1.291.401-2.512.401h-.99V14.94zm8.558 5.708c-.724-.81-1.732-1.265-3.024-1.363 1.15-.313 1.984-.772 2.513-1.384.525-.604.786-1.425.786-2.457 0-.818-.179-1.54-.525-2.165a3.905 3.905 0 0 0-1.535-1.49c-.587-.323-1.284-.55-2.096-.684-.816-.13-2.245-.196-4.296-.196H9.091v18.182h5.136c2.064 0 3.552-.072 4.462-.21.909-.143 1.671-.384 2.289-.714a4.196 4.196 0 0 0 1.753-1.713c.41-.74.612-1.591.612-2.566 0-1.349-.363-2.432-1.09-3.24zM28.606 24.485a2.302 2.302 0 1 0-.002 4.604 2.302 2.302 0 0 0 .002-4.604M26.606 23.031h4V10.91h-4z' fill='%23FFF' fill-rule='evenodd'/%3E%3C/svg%3E");background-size:50% 50%}
3
+ /*! normalize.css v5.0.0 | MIT License | github.com/necolas/normalize.css */html{font-family:sans-serif;line-height:1.15;-ms-text-size-adjust:100%;-webkit-text-size-adjust:100%}body{margin:0}article,aside,footer,header,nav,section{display:block}h1{font-size:2em;margin:.67em 0}figcaption,figure,main{display:block}figure{margin:1em 40px}hr{box-sizing:content-box;height:0;overflow:visible}pre{font-family:monospace,monospace;font-size:1em}a{background-color:transparent;-webkit-text-decoration-skip:objects}a:active,a:hover{outline-width:0}abbr[title]{border-bottom:none;text-decoration:underline;text-decoration:underline dotted}b,strong{font-weight:inherit;font-weight:bolder}code,kbd,samp{font-family:monospace,monospace;font-size:1em}dfn{font-style:italic}mark{background-color:#ff0;color:#000}small{font-size:80%}sub,sup{font-size:75%;line-height:0;position:relative;vertical-align:baseline}sub{bottom:-.25em}sup{top:-.5em}audio,video{display:inline-block}audio:not([controls]){display:none;height:0}img{border-style:none}svg:not(:root){overflow:hidden}button,input,optgroup,select,textarea{font-family:sans-serif;font-size:100%;line-height:1.15;margin:0}button,input{overflow:visible}button,select{text-transform:none}[type=reset],[type=submit],button,html [type=button]{-webkit-appearance:button}[type=button]::-moz-focus-inner,[type=reset]::-moz-focus-inner,[type=submit]::-moz-focus-inner,button::-moz-focus-inner{border-style:none;padding:0}[type=button]:-moz-focusring,[type=reset]:-moz-focusring,[type=submit]:-moz-focusring,button:-moz-focusring{outline:1px dotted ButtonText}fieldset{border:1px solid silver;margin:0 2px;padding:.35em .625em .75em}legend{box-sizing:border-box;color:inherit;display:table;max-width:100%;padding:0;white-space:normal}progress{display:inline-block;vertical-align:baseline}textarea{overflow:auto}[type=checkbox],[type=radio]{box-sizing:border-box;padding:0}[type=number]::-webkit-inner-spin-button,[type=number]::-webkit-outer-spin-button{height:auto}[type=search]{-webkit-appearance:textfield;outline-offset:-2px}[type=search]::-webkit-search-cancel-button,[type=search]::-webkit-search-decoration{-webkit-appearance:none}::-webkit-file-upload-button{-webkit-appearance:button;font:inherit}details,menu{display:block}summary{display:list-item}canvas{display:inline-block}[hidden],template{display:none}.container{position:relative;margin-right:auto;margin-left:auto;box-sizing:border-box;padding-right:15px;padding-left:15px}@media (min-width:34em){.container{padding-right:15px;padding-left:15px}}@media (min-width:48em){.container{padding-right:15px;padding-left:15px}}@media (min-width:62em){.container{padding-right:15px;padding-left:15px}}@media (min-width:75em){.container{padding-right:15px;padding-left:15px}}@media (min-width:34em){.container{width:540px;max-width:100%;box-sizing:border-box}}@media (min-width:48em){.container{width:720px;max-width:100%;box-sizing:border-box}}@media (min-width:62em){.container{width:960px;max-width:100%;box-sizing:border-box}}@media (min-width:75em){.container{width:1140px;max-width:100%;box-sizing:border-box}}.container-fluid{position:relative;margin-right:auto;margin-left:auto;box-sizing:border-box;padding-right:15px;padding-left:15px}@media (min-width:34em){.container-fluid{padding-right:15px;padding-left:15px}}@media (min-width:48em){.container-fluid{padding-right:15px;padding-left:15px}}@media (min-width:62em){.container-fluid{padding-right:15px;padding-left:15px}}@media (min-width:75em){.container-fluid{padding-right:15px;padding-left:15px}}.row{display:flex;flex-wrap:wrap;box-sizing:border-box;margin-right:-15px;margin-left:-15px}@media (min-width:34em){.row{margin-right:-15px;margin-left:-15px}}@media (min-width:48em){.row{margin-right:-15px;margin-left:-15px}}@media (min-width:62em){.row{margin-right:-15px;margin-left:-15px}}@media (min-width:75em){.row{margin-right:-15px;margin-left:-15px}}.no-gutters{margin-right:0;margin-left:0}.no-gutters>.col,.no-gutters>[class*=col-]{padding-right:0;padding-left:0}.col,.col-1,.col-2,.col-3,.col-4,.col-5,.col-6,.col-7,.col-8,.col-9,.col-10,.col-11,.col-12,.col-lg,.col-lg-1,.col-lg-2,.col-lg-3,.col-lg-4,.col-lg-5,.col-lg-6,.col-lg-7,.col-lg-8,.col-lg-9,.col-lg-10,.col-lg-11,.col-lg-12,.col-md,.col-md-1,.col-md-2,.col-md-3,.col-md-4,.col-md-5,.col-md-6,.col-md-7,.col-md-8,.col-md-9,.col-md-10,.col-md-11,.col-md-12,.col-sm,.col-sm-1,.col-sm-2,.col-sm-3,.col-sm-4,.col-sm-5,.col-sm-6,.col-sm-7,.col-sm-8,.col-sm-9,.col-sm-10,.col-sm-11,.col-sm-12,.col-xl,.col-xl-1,.col-xl-2,.col-xl-3,.col-xl-4,.col-xl-5,.col-xl-6,.col-xl-7,.col-xl-8,.col-xl-9,.col-xl-10,.col-xl-11,.col-xl-12{position:relative;width:100%;min-height:1px;padding-right:15px;padding-left:15px;box-sizing:border-box}@media (min-width:34em){.col,.col-1,.col-2,.col-3,.col-4,.col-5,.col-6,.col-7,.col-8,.col-9,.col-10,.col-11,.col-12,.col-lg,.col-lg-1,.col-lg-2,.col-lg-3,.col-lg-4,.col-lg-5,.col-lg-6,.col-lg-7,.col-lg-8,.col-lg-9,.col-lg-10,.col-lg-11,.col-lg-12,.col-md,.col-md-1,.col-md-2,.col-md-3,.col-md-4,.col-md-5,.col-md-6,.col-md-7,.col-md-8,.col-md-9,.col-md-10,.col-md-11,.col-md-12,.col-sm,.col-sm-1,.col-sm-2,.col-sm-3,.col-sm-4,.col-sm-5,.col-sm-6,.col-sm-7,.col-sm-8,.col-sm-9,.col-sm-10,.col-sm-11,.col-sm-12,.col-xl,.col-xl-1,.col-xl-2,.col-xl-3,.col-xl-4,.col-xl-5,.col-xl-6,.col-xl-7,.col-xl-8,.col-xl-9,.col-xl-10,.col-xl-11,.col-xl-12{padding-right:15px;padding-left:15px;box-sizing:border-box}}@media (min-width:48em){.col,.col-1,.col-2,.col-3,.col-4,.col-5,.col-6,.col-7,.col-8,.col-9,.col-10,.col-11,.col-12,.col-lg,.col-lg-1,.col-lg-2,.col-lg-3,.col-lg-4,.col-lg-5,.col-lg-6,.col-lg-7,.col-lg-8,.col-lg-9,.col-lg-10,.col-lg-11,.col-lg-12,.col-md,.col-md-1,.col-md-2,.col-md-3,.col-md-4,.col-md-5,.col-md-6,.col-md-7,.col-md-8,.col-md-9,.col-md-10,.col-md-11,.col-md-12,.col-sm,.col-sm-1,.col-sm-2,.col-sm-3,.col-sm-4,.col-sm-5,.col-sm-6,.col-sm-7,.col-sm-8,.col-sm-9,.col-sm-10,.col-sm-11,.col-sm-12,.col-xl,.col-xl-1,.col-xl-2,.col-xl-3,.col-xl-4,.col-xl-5,.col-xl-6,.col-xl-7,.col-xl-8,.col-xl-9,.col-xl-10,.col-xl-11,.col-xl-12{padding-right:15px;padding-left:15px;box-sizing:border-box}}@media (min-width:62em){.col,.col-1,.col-2,.col-3,.col-4,.col-5,.col-6,.col-7,.col-8,.col-9,.col-10,.col-11,.col-12,.col-lg,.col-lg-1,.col-lg-2,.col-lg-3,.col-lg-4,.col-lg-5,.col-lg-6,.col-lg-7,.col-lg-8,.col-lg-9,.col-lg-10,.col-lg-11,.col-lg-12,.col-md,.col-md-1,.col-md-2,.col-md-3,.col-md-4,.col-md-5,.col-md-6,.col-md-7,.col-md-8,.col-md-9,.col-md-10,.col-md-11,.col-md-12,.col-sm,.col-sm-1,.col-sm-2,.col-sm-3,.col-sm-4,.col-sm-5,.col-sm-6,.col-sm-7,.col-sm-8,.col-sm-9,.col-sm-10,.col-sm-11,.col-sm-12,.col-xl,.col-xl-1,.col-xl-2,.col-xl-3,.col-xl-4,.col-xl-5,.col-xl-6,.col-xl-7,.col-xl-8,.col-xl-9,.col-xl-10,.col-xl-11,.col-xl-12{padding-right:15px;padding-left:15px;box-sizing:border-box}}@media (min-width:75em){.col,.col-1,.col-2,.col-3,.col-4,.col-5,.col-6,.col-7,.col-8,.col-9,.col-10,.col-11,.col-12,.col-lg,.col-lg-1,.col-lg-2,.col-lg-3,.col-lg-4,.col-lg-5,.col-lg-6,.col-lg-7,.col-lg-8,.col-lg-9,.col-lg-10,.col-lg-11,.col-lg-12,.col-md,.col-md-1,.col-md-2,.col-md-3,.col-md-4,.col-md-5,.col-md-6,.col-md-7,.col-md-8,.col-md-9,.col-md-10,.col-md-11,.col-md-12,.col-sm,.col-sm-1,.col-sm-2,.col-sm-3,.col-sm-4,.col-sm-5,.col-sm-6,.col-sm-7,.col-sm-8,.col-sm-9,.col-sm-10,.col-sm-11,.col-sm-12,.col-xl,.col-xl-1,.col-xl-2,.col-xl-3,.col-xl-4,.col-xl-5,.col-xl-6,.col-xl-7,.col-xl-8,.col-xl-9,.col-xl-10,.col-xl-11,.col-xl-12{padding-right:15px;padding-left:15px;box-sizing:border-box}}.col{flex-basis:0;flex-grow:1;max-width:100%}.col-auto{flex:0 0 auto;width:auto}.col-1{flex:0 0 8.33333%;max-width:8.33333%}.col-2{flex:0 0 16.66667%;max-width:16.66667%}.col-3{flex:0 0 25%;max-width:25%}.col-4{flex:0 0 33.33333%;max-width:33.33333%}.col-5{flex:0 0 41.66667%;max-width:41.66667%}.col-6{flex:0 0 50%;max-width:50%}.col-7{flex:0 0 58.33333%;max-width:58.33333%}.col-8{flex:0 0 66.66667%;max-width:66.66667%}.col-9{flex:0 0 75%;max-width:75%}.col-10{flex:0 0 83.33333%;max-width:83.33333%}.col-11{flex:0 0 91.66667%;max-width:91.66667%}.col-12{flex:0 0 100%;max-width:100%}.pull-0{right:auto}.pull-1{right:8.33333%}.pull-2{right:16.66667%}.pull-3{right:25%}.pull-4{right:33.33333%}.pull-5{right:41.66667%}.pull-6{right:50%}.pull-7{right:58.33333%}.pull-8{right:66.66667%}.pull-9{right:75%}.pull-10{right:83.33333%}.pull-11{right:91.66667%}.pull-12{right:100%}.push-0{left:auto}.push-1{left:8.33333%}.push-2{left:16.66667%}.push-3{left:25%}.push-4{left:33.33333%}.push-5{left:41.66667%}.push-6{left:50%}.push-7{left:58.33333%}.push-8{left:66.66667%}.push-9{left:75%}.push-10{left:83.33333%}.push-11{left:91.66667%}.push-12{left:100%}.offset-1{margin-left:8.33333%}.offset-2{margin-left:16.66667%}.offset-3{margin-left:25%}.offset-4{margin-left:33.33333%}.offset-5{margin-left:41.66667%}.offset-6{margin-left:50%}.offset-7{margin-left:58.33333%}.offset-8{margin-left:66.66667%}.offset-9{margin-left:75%}.offset-10{margin-left:83.33333%}.offset-11{margin-left:91.66667%}@media (min-width:34em){.col-sm{flex-basis:0;flex-grow:1;max-width:100%}.col-sm-auto{flex:0 0 auto;width:auto}.col-sm-1{flex:0 0 8.33333%;max-width:8.33333%}.col-sm-2{flex:0 0 16.66667%;max-width:16.66667%}.col-sm-3{flex:0 0 25%;max-width:25%}.col-sm-4{flex:0 0 33.33333%;max-width:33.33333%}.col-sm-5{flex:0 0 41.66667%;max-width:41.66667%}.col-sm-6{flex:0 0 50%;max-width:50%}.col-sm-7{flex:0 0 58.33333%;max-width:58.33333%}.col-sm-8{flex:0 0 66.66667%;max-width:66.66667%}.col-sm-9{flex:0 0 75%;max-width:75%}.col-sm-10{flex:0 0 83.33333%;max-width:83.33333%}.col-sm-11{flex:0 0 91.66667%;max-width:91.66667%}.col-sm-12{flex:0 0 100%;max-width:100%}.pull-sm-0{right:auto}.pull-sm-1{right:8.33333%}.pull-sm-2{right:16.66667%}.pull-sm-3{right:25%}.pull-sm-4{right:33.33333%}.pull-sm-5{right:41.66667%}.pull-sm-6{right:50%}.pull-sm-7{right:58.33333%}.pull-sm-8{right:66.66667%}.pull-sm-9{right:75%}.pull-sm-10{right:83.33333%}.pull-sm-11{right:91.66667%}.pull-sm-12{right:100%}.push-sm-0{left:auto}.push-sm-1{left:8.33333%}.push-sm-2{left:16.66667%}.push-sm-3{left:25%}.push-sm-4{left:33.33333%}.push-sm-5{left:41.66667%}.push-sm-6{left:50%}.push-sm-7{left:58.33333%}.push-sm-8{left:66.66667%}.push-sm-9{left:75%}.push-sm-10{left:83.33333%}.push-sm-11{left:91.66667%}.push-sm-12{left:100%}.offset-sm-0{margin-left:0}.offset-sm-1{margin-left:8.33333%}.offset-sm-2{margin-left:16.66667%}.offset-sm-3{margin-left:25%}.offset-sm-4{margin-left:33.33333%}.offset-sm-5{margin-left:41.66667%}.offset-sm-6{margin-left:50%}.offset-sm-7{margin-left:58.33333%}.offset-sm-8{margin-left:66.66667%}.offset-sm-9{margin-left:75%}.offset-sm-10{margin-left:83.33333%}.offset-sm-11{margin-left:91.66667%}}@media (min-width:48em){.col-md{flex-basis:0;flex-grow:1;max-width:100%}.col-md-auto{flex:0 0 auto;width:auto}.col-md-1{flex:0 0 8.33333%;max-width:8.33333%}.col-md-2{flex:0 0 16.66667%;max-width:16.66667%}.col-md-3{flex:0 0 25%;max-width:25%}.col-md-4{flex:0 0 33.33333%;max-width:33.33333%}.col-md-5{flex:0 0 41.66667%;max-width:41.66667%}.col-md-6{flex:0 0 50%;max-width:50%}.col-md-7{flex:0 0 58.33333%;max-width:58.33333%}.col-md-8{flex:0 0 66.66667%;max-width:66.66667%}.col-md-9{flex:0 0 75%;max-width:75%}.col-md-10{flex:0 0 83.33333%;max-width:83.33333%}.col-md-11{flex:0 0 91.66667%;max-width:91.66667%}.col-md-12{flex:0 0 100%;max-width:100%}.pull-md-0{right:auto}.pull-md-1{right:8.33333%}.pull-md-2{right:16.66667%}.pull-md-3{right:25%}.pull-md-4{right:33.33333%}.pull-md-5{right:41.66667%}.pull-md-6{right:50%}.pull-md-7{right:58.33333%}.pull-md-8{right:66.66667%}.pull-md-9{right:75%}.pull-md-10{right:83.33333%}.pull-md-11{right:91.66667%}.pull-md-12{right:100%}.push-md-0{left:auto}.push-md-1{left:8.33333%}.push-md-2{left:16.66667%}.push-md-3{left:25%}.push-md-4{left:33.33333%}.push-md-5{left:41.66667%}.push-md-6{left:50%}.push-md-7{left:58.33333%}.push-md-8{left:66.66667%}.push-md-9{left:75%}.push-md-10{left:83.33333%}.push-md-11{left:91.66667%}.push-md-12{left:100%}.offset-md-0{margin-left:0}.offset-md-1{margin-left:8.33333%}.offset-md-2{margin-left:16.66667%}.offset-md-3{margin-left:25%}.offset-md-4{margin-left:33.33333%}.offset-md-5{margin-left:41.66667%}.offset-md-6{margin-left:50%}.offset-md-7{margin-left:58.33333%}.offset-md-8{margin-left:66.66667%}.offset-md-9{margin-left:75%}.offset-md-10{margin-left:83.33333%}.offset-md-11{margin-left:91.66667%}}@media (min-width:62em){.col-lg{flex-basis:0;flex-grow:1;max-width:100%}.col-lg-auto{flex:0 0 auto;width:auto}.col-lg-1{flex:0 0 8.33333%;max-width:8.33333%}.col-lg-2{flex:0 0 16.66667%;max-width:16.66667%}.col-lg-3{flex:0 0 25%;max-width:25%}.col-lg-4{flex:0 0 33.33333%;max-width:33.33333%}.col-lg-5{flex:0 0 41.66667%;max-width:41.66667%}.col-lg-6{flex:0 0 50%;max-width:50%}.col-lg-7{flex:0 0 58.33333%;max-width:58.33333%}.col-lg-8{flex:0 0 66.66667%;max-width:66.66667%}.col-lg-9{flex:0 0 75%;max-width:75%}.col-lg-10{flex:0 0 83.33333%;max-width:83.33333%}.col-lg-11{flex:0 0 91.66667%;max-width:91.66667%}.col-lg-12{flex:0 0 100%;max-width:100%}.pull-lg-0{right:auto}.pull-lg-1{right:8.33333%}.pull-lg-2{right:16.66667%}.pull-lg-3{right:25%}.pull-lg-4{right:33.33333%}.pull-lg-5{right:41.66667%}.pull-lg-6{right:50%}.pull-lg-7{right:58.33333%}.pull-lg-8{right:66.66667%}.pull-lg-9{right:75%}.pull-lg-10{right:83.33333%}.pull-lg-11{right:91.66667%}.pull-lg-12{right:100%}.push-lg-0{left:auto}.push-lg-1{left:8.33333%}.push-lg-2{left:16.66667%}.push-lg-3{left:25%}.push-lg-4{left:33.33333%}.push-lg-5{left:41.66667%}.push-lg-6{left:50%}.push-lg-7{left:58.33333%}.push-lg-8{left:66.66667%}.push-lg-9{left:75%}.push-lg-10{left:83.33333%}.push-lg-11{left:91.66667%}.push-lg-12{left:100%}.offset-lg-0{margin-left:0}.offset-lg-1{margin-left:8.33333%}.offset-lg-2{margin-left:16.66667%}.offset-lg-3{margin-left:25%}.offset-lg-4{margin-left:33.33333%}.offset-lg-5{margin-left:41.66667%}.offset-lg-6{margin-left:50%}.offset-lg-7{margin-left:58.33333%}.offset-lg-8{margin-left:66.66667%}.offset-lg-9{margin-left:75%}.offset-lg-10{margin-left:83.33333%}.offset-lg-11{margin-left:91.66667%}}@media (min-width:75em){.col-xl{flex-basis:0;flex-grow:1;max-width:100%}.col-xl-auto{flex:0 0 auto;width:auto}.col-xl-1{flex:0 0 8.33333%;max-width:8.33333%}.col-xl-2{flex:0 0 16.66667%;max-width:16.66667%}.col-xl-3{flex:0 0 25%;max-width:25%}.col-xl-4{flex:0 0 33.33333%;max-width:33.33333%}.col-xl-5{flex:0 0 41.66667%;max-width:41.66667%}.col-xl-6{flex:0 0 50%;max-width:50%}.col-xl-7{flex:0 0 58.33333%;max-width:58.33333%}.col-xl-8{flex:0 0 66.66667%;max-width:66.66667%}.col-xl-9{flex:0 0 75%;max-width:75%}.col-xl-10{flex:0 0 83.33333%;max-width:83.33333%}.col-xl-11{flex:0 0 91.66667%;max-width:91.66667%}.col-xl-12{flex:0 0 100%;max-width:100%}.pull-xl-0{right:auto}.pull-xl-1{right:8.33333%}.pull-xl-2{right:16.66667%}.pull-xl-3{right:25%}.pull-xl-4{right:33.33333%}.pull-xl-5{right:41.66667%}.pull-xl-6{right:50%}.pull-xl-7{right:58.33333%}.pull-xl-8{right:66.66667%}.pull-xl-9{right:75%}.pull-xl-10{right:83.33333%}.pull-xl-11{right:91.66667%}.pull-xl-12{right:100%}.push-xl-0{left:auto}.push-xl-1{left:8.33333%}.push-xl-2{left:16.66667%}.push-xl-3{left:25%}.push-xl-4{left:33.33333%}.push-xl-5{left:41.66667%}.push-xl-6{left:50%}.push-xl-7{left:58.33333%}.push-xl-8{left:66.66667%}.push-xl-9{left:75%}.push-xl-10{left:83.33333%}.push-xl-11{left:91.66667%}.push-xl-12{left:100%}.offset-xl-0{margin-left:0}.offset-xl-1{margin-left:8.33333%}.offset-xl-2{margin-left:16.66667%}.offset-xl-3{margin-left:25%}.offset-xl-4{margin-left:33.33333%}.offset-xl-5{margin-left:41.66667%}.offset-xl-6{margin-left:50%}.offset-xl-7{margin-left:58.33333%}.offset-xl-8{margin-left:66.66667%}.offset-xl-9{margin-left:75%}.offset-xl-10{margin-left:83.33333%}.offset-xl-11{margin-left:91.66667%}}html{font-size:100%}@media (max-width:48em){html{font-size:80%}}body{font-family:Open Sans,ヒラギノ角ゴ Pro W3,Hiragino Kaku Gothic Pro,メイリオ,Meiryo,MS Pゴシック,sans-serif;font-size:1rem;font-weight:400;line-height:normal}.demo-styles,body{color:#444}.demo-styles h1{font-size:2.8rem}.demo-styles h1,.demo-styles h2{font-family:Open Sans,ヒラギノ角ゴ Pro W3,Hiragino Kaku Gothic Pro,メイリオ,Meiryo,MS Pゴシック,sans-serif;font-weight:400;line-height:normal;font-weight:300}.demo-styles h2{font-size:2rem}.demo-styles h3{font-size:1.6rem}.demo-styles h3,.demo-styles h4{font-family:Open Sans,ヒラギノ角ゴ Pro W3,Hiragino Kaku Gothic Pro,メイリオ,Meiryo,MS Pゴシック,sans-serif;font-weight:400;line-height:normal}.demo-styles h4{font-size:1.5rem}.demo-styles h5{font-size:1.3rem}.demo-styles h5,.demo-styles h6{font-family:Open Sans,ヒラギノ角ゴ Pro W3,Hiragino Kaku Gothic Pro,メイリオ,Meiryo,MS Pゴシック,sans-serif;font-weight:400;line-height:normal}.demo-styles h6{font-size:1.2rem}.demo-styles form,.demo-styles input[type=text],.demo-styles p{font-family:Open Sans,ヒラギノ角ゴ Pro W3,Hiragino Kaku Gothic Pro,メイリオ,Meiryo,MS Pゴシック,sans-serif;font-size:1rem;font-weight:400;line-height:normal}.demo-styles input[type=text]{margin:0;border-radius:0;background-image:none;background:transparent;-webkit-appearance:none;appearance:none;outline:none;text-decoration:none;font-size:inherit;display:inline-block;width:100%;padding:10px;box-sizing:border-box;line-height:1;border:1px solid #ddd}.demo-styles input[type=text]:focus{border:none;outline:none}.demo-styles input[type=text]::placeholder{font-size:inherit}.demo-styles input[type=text]:focus{outline:0}.demo-styles input[type=text]::placeholder{color:#ddd}.demo-styles input[type=text]:focus{border:1px solid rgba(82,158,246,.5);background:#fffff2}@media (max-width:48em){.demo-styles input[type=text]{font-size:16px}}.demo-styles textarea{font-family:Open Sans,ヒラギノ角ゴ Pro W3,Hiragino Kaku Gothic Pro,メイリオ,Meiryo,MS Pゴシック,sans-serif;font-size:1rem;font-weight:400;line-height:normal;margin:0;border-radius:0;background-image:none;background:transparent;-webkit-appearance:none;appearance:none;outline:none;text-decoration:none;font-size:inherit;display:inline-block;width:100%;padding:10px;box-sizing:border-box;line-height:1;border:1px solid #ddd;line-height:1.6rem;height:120px}.demo-styles textarea:focus{border:none;outline:none}.demo-styles textarea::placeholder{font-size:inherit}.demo-styles textarea:focus{outline:0}.demo-styles textarea::placeholder{color:#ddd}.demo-styles textarea:focus{border:1px solid rgba(82,158,246,.5);background:#fffff2}@media (max-width:48em){.demo-styles textarea{font-size:16px}}.demo-styles legend{font-family:Open Sans,ヒラギノ角ゴ Pro W3,Hiragino Kaku Gothic Pro,メイリオ,Meiryo,MS Pゴシック,sans-serif;font-size:inherit;font-weight:400;line-height:normal}.demo-styles .radio,.demo-styles .radio input[type=radio]{display:inline-block;margin:0}.demo-styles .radio label{display:flex;align-items:center;align-content:center;justify-content:flex-start;margin:0;padding:0 1rem 0 0;line-height:1;cursor:pointer}.demo-styles .radio label:before{content:"";display:inline-block;position:relative;background-image:url("data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iNiIgaGVpZ2h0PSI2IiB2aWV3Qm94PSIxMTEgMjMwIDYgNiIgeG1sbnM9Imh0dHA6Ly93d3cudzMub3JnLzIwMDAvc3ZnIj48cmVjdCBmaWxsPSIjRkZGIiBmaWxsLXJ1bGU9ImV2ZW5vZGQiIHg9IjExMSIgeT0iMjMwIiB3aWR0aD0iNiIgaGVpZ2h0PSI2IiByeD0iMyIvPjwvc3ZnPg==");background-repeat:no-repeat;background-position:50%;flex:0 0 18px;width:18px;height:18px;vertical-align:middle;line-height:1;background-color:#fff;border:1px solid #ddd;margin:0 .4rem 0 0;padding:0;background-size:8px 8px;border-radius:18px}.demo-styles .radio input[type=radio]{display:none}.demo-styles .radio input[type=radio]:checked+label:before{background-color:#529ef6;border-color:#529ef6}.demo-styles .radio-inside,.demo-styles .radio-inside input[type=radio]{display:inline-block;margin:0}.demo-styles .radio-inside label{cursor:pointer;margin:0}.demo-styles .radio-inside span{display:flex;align-items:center;align-content:center;justify-content:flex-start;margin:0;padding:0 1rem 0 0;line-height:1;cursor:pointer}.demo-styles .radio-inside span:before{content:"";display:inline-block;position:relative;background-image:url("data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iNiIgaGVpZ2h0PSI2IiB2aWV3Qm94PSIxMTEgMjMwIDYgNiIgeG1sbnM9Imh0dHA6Ly93d3cudzMub3JnLzIwMDAvc3ZnIj48cmVjdCBmaWxsPSIjRkZGIiBmaWxsLXJ1bGU9ImV2ZW5vZGQiIHg9IjExMSIgeT0iMjMwIiB3aWR0aD0iNiIgaGVpZ2h0PSI2IiByeD0iMyIvPjwvc3ZnPg==");background-repeat:no-repeat;background-position:50%;flex:0 0 18px;width:18px;height:18px;vertical-align:middle;line-height:1;background-color:#fff;border:1px solid #ddd;margin:0 .4rem 0 0;padding:0;background-size:8px 8px;border-radius:18px}.demo-styles .radio-inside input[type=radio]{display:none}.demo-styles .radio-inside input[type=radio]:checked+span:before{background-color:#529ef6;border-color:#529ef6}.demo-styles .checkbox,.demo-styles .checkbox input[type=radio]{display:inline-block;margin:0}.demo-styles .checkbox label{display:flex;align-items:center;align-content:center;justify-content:flex-start;margin:0;padding:0 1rem 0 0;line-height:1;cursor:pointer}.demo-styles .checkbox label:before{content:"";display:inline-block;position:relative;background-image:url("data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iMTEiIGhlaWdodD0iMTEiIHZpZXdCb3g9Ijg2IDIyNiAxMSAxMSIgeG1sbnM9Imh0dHA6Ly93d3cudzMub3JnLzIwMDAvc3ZnIj48cGF0aCBkPSJNOTAuNTg2IDIzMy44MjhsNC4yNDItNC4yNDJMOTYuMjQzIDIzMWwtNS42NTcgNS42NTctLjcwNy0uNzA3LTMuNTM2LTMuNTM2TDg3Ljc1NyAyMzFsMi44MjkgMi44Mjh6IiBmaWxsPSIjRkZGIiBmaWxsLXJ1bGU9ImV2ZW5vZGQiLz48L3N2Zz4=");background-repeat:no-repeat;background-position:50%;flex:0 0 18px;width:18px;height:18px;vertical-align:middle;line-height:1;background-color:#fff;border:1px solid #ddd;margin:0 .4rem 0 0;padding:0;background-size:16px 14px;background-position:center 0;border-radius:.2rem}.demo-styles .checkbox input[type=checkbox]{display:none}.demo-styles .checkbox input[type=checkbox]:checked+label:before{background-color:#529ef6;border-color:#529ef6}.demo-styles .checkbox-inside,.demo-styles .checkbox-inside input[type=radio]{display:inline-block;margin:0}.demo-styles .checkbox-inside label{cursor:pointer;margin:0}.demo-styles .checkbox-inside span{display:flex;align-items:center;align-content:center;justify-content:flex-start;margin:0;padding:0 1rem 0 0;line-height:1;cursor:pointer}.demo-styles .checkbox-inside span:before{content:"";display:inline-block;position:relative;background-image:url("data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iMTEiIGhlaWdodD0iMTEiIHZpZXdCb3g9Ijg2IDIyNiAxMSAxMSIgeG1sbnM9Imh0dHA6Ly93d3cudzMub3JnLzIwMDAvc3ZnIj48cGF0aCBkPSJNOTAuNTg2IDIzMy44MjhsNC4yNDItNC4yNDJMOTYuMjQzIDIzMWwtNS42NTcgNS42NTctLjcwNy0uNzA3LTMuNTM2LTMuNTM2TDg3Ljc1NyAyMzFsMi44MjkgMi44Mjh6IiBmaWxsPSIjRkZGIiBmaWxsLXJ1bGU9ImV2ZW5vZGQiLz48L3N2Zz4=");background-repeat:no-repeat;background-position:50%;flex:0 0 18px;width:18px;height:18px;vertical-align:middle;line-height:1;background-color:#fff;border:1px solid #ddd;margin:0 .4rem 0 0;padding:0;background-size:16px 14px;background-position:center 0;border-radius:.2rem}.demo-styles .checkbox-inside input[type=checkbox]{display:none}.demo-styles .checkbox-inside input[type=checkbox]:checked+span:before{background-color:#529ef6;border-color:#529ef6}.demo-styles .select{padding:0;margin:0;border:1px solid #ccc;width:200px;border-radius:3px;overflow:hidden;background-color:#fff;background-image:url("data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iNiIgaGVpZ2h0PSIxMCIgdmlld0JveD0iMTQ3IDIyNSA2IDEwIiB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciPjxwYXRoIGQ9Ik0xNTAgMjI1bDMgNGgtNmwzLTR6bTAgMTBsLTMtNGg2bC0zIDR6IiBmaWxsLXJ1bGU9ImV2ZW5vZGQiLz48L3N2Zz4=");background-repeat:no-repeat;background-position:right 12px top 15px;background-size:6px 10px}.demo-styles .select select{padding:5px 12px;width:130%;height:40px;border:none;box-shadow:none;background-color:transparent;background-image:none;appearance:none;cursor:pointer}.demo-styles .select select:focus{outline:none}.demo-styles .table{font-family:Open Sans,ヒラギノ角ゴ Pro W3,Hiragino Kaku Gothic Pro,メイリオ,Meiryo,MS Pゴシック,sans-serif;font-size:1rem;font-weight:400;line-height:normal;width:100%;border-collapse:collapse;border-top:1px solid #eee;margin-bottom:10px}.demo-styles .table th{font-weight:700}.demo-styles .table td,.demo-styles .table th{padding:5px 10px}.demo-styles .table thead tr td,.demo-styles .table thead tr th{font-size:.8rem;border:solid #eee;border-width:1px 1px 2px}.demo-styles .table tbody tr:first-child td,.demo-styles .table tbody tr:first-child th{border-top:none}.demo-styles .table tbody th{border:solid #eee;border-width:1px 1px 2px}.demo-styles .table tbody td{border:1px solid #eee}.demo-styles .table-line{width:100%;border-collapse:collapse;margin-bottom:10px}.demo-styles .table-line th{font-weight:700}.demo-styles .table-line td,.demo-styles .table-line th{padding:5px 10px}.demo-styles .table-line thead tr td,.demo-styles .table-line thead tr th{border-bottom:2px solid #eee}.demo-styles .table-line tr:first-child td,.demo-styles .table-line tr:first-child th{border-top:none}.demo-styles .table-line td,.demo-styles .table-line th{border-top:1px solid #eee}.demo-styles .table-stripe{width:100%;border-collapse:collapse;margin-bottom:10px}.demo-styles .table-stripe th{font-weight:700}.demo-styles .table-stripe td,.demo-styles .table-stripe th{padding:5px 10px}.demo-styles .table-stripe thead tr{background-color:#fff}.demo-styles .table-stripe tbody tr:nth-child(2n){background-color:#eee}.demo-styles .table-stripe tbody tr:nth-child(odd){background-color:#f8f8f8}.demo-styles .fieldset{display:flex;justify-content:space-between;align-items:center;min-width:0;padding:0;margin:0 0 10px;border:0}.demo-styles .fieldset:last-child,.demo-styles .fieldset label,.demo-styles .fieldset legend{margin-bottom:0}.demo-styles .fieldset>legend{width:30%;padding-right:20px}.demo-styles .fieldset>:not(legend){flex:1}.demo-styles .button{font-family:Open Sans,ヒラギノ角ゴ Pro W3,Hiragino Kaku Gothic Pro,メイリオ,Meiryo,MS Pゴシック,sans-serif;font-size:1rem;line-height:normal;box-sizing:border-box;box-shadow:none;appearance:none;display:inline-block;border-radius:0;background-color:transparent;background-image:linear-gradient(0deg,transparent,transparent);position:relative;cursor:pointer;text-align:center;font-weight:400;margin:0;outline:none;border-radius:2px;border:1px solid #529ef6;background-color:#529ef6;color:#fff;padding:10px;line-height:1}.demo-styles .button:active,.demo-styles .button:hover,.demo-styles .button:link,.demo-styles .button:visited{text-decoration:none}.demo-styles .button:focus{outline:none}.demo-styles .button.is-disabled,.demo-styles .button:disabled{cursor:default;pointer-events:none;opacity:.2}.demo-styles .button:focus{background-color:#529ef6}.demo-styles .button.is-current,.demo-styles .button:active,.demo-styles .button:hover{background-color:#2283f3;color:#fff;border-color:#529ef6}.demo-styles .button-semiflat{font-family:Open Sans,ヒラギノ角ゴ Pro W3,Hiragino Kaku Gothic Pro,メイリオ,Meiryo,MS Pゴシック,sans-serif;font-size:1rem;line-height:normal;box-sizing:border-box;box-shadow:none;appearance:none;display:inline-block;border-radius:0;background-color:transparent;background-image:linear-gradient(0deg,transparent,transparent);position:relative;cursor:pointer;text-align:center;font-weight:400;margin:0;outline:none;border-radius:4px;background-color:#529ef6;background-image:linear-gradient(0deg,#529ef6,#6aacf7);border:1px solid #6aacf7;color:#fff;padding:10px;line-height:1}.demo-styles .button-semiflat:active,.demo-styles .button-semiflat:hover,.demo-styles .button-semiflat:link,.demo-styles .button-semiflat:visited{text-decoration:none}.demo-styles .button-semiflat:focus{outline:none}.demo-styles .button-semiflat.is-disabled,.demo-styles .button-semiflat:disabled{cursor:default;pointer-events:none;opacity:.2}.demo-styles .button-semiflat:focus{background-color:#529ef6;background-image:linear-gradient(0deg,#529ef6,#6aacf7)}.demo-styles .button-semiflat.is-current,.demo-styles .button-semiflat:active,.demo-styles .button-semiflat:hover{background-color:#3a90f5;background-image:linear-gradient(0deg,#3a90f5,#529ef6)}.demo-styles .button-border{font-family:Open Sans,ヒラギノ角ゴ Pro W3,Hiragino Kaku Gothic Pro,メイリオ,Meiryo,MS Pゴシック,sans-serif;font-size:1rem;line-height:normal;box-sizing:border-box;box-shadow:none;appearance:none;display:inline-block;border-radius:0;background-image:linear-gradient(0deg,transparent,transparent);position:relative;cursor:pointer;text-align:center;font-weight:400;margin:0;outline:none;border-radius:2px;background-color:transparent;padding:10px;border:1px solid #529ef6;color:#529ef6;line-height:1}.demo-styles .button-border:active,.demo-styles .button-border:hover,.demo-styles .button-border:link,.demo-styles .button-border:visited{text-decoration:none}.demo-styles .button-border:focus{outline:none}.demo-styles .button-border.is-disabled,.demo-styles .button-border:disabled{cursor:default;pointer-events:none;opacity:.2}.demo-styles .button-border:focus{background-color:transparent;border:1px solid #529ef6}.demo-styles .button-border.is-current,.demo-styles .button-border:active,.demo-styles .button-border:hover{background-color:#529ef6;color:#fff;border-color:transparet}.demo-styles .button-emboss{font-family:Open Sans,ヒラギノ角ゴ Pro W3,Hiragino Kaku Gothic Pro,メイリオ,Meiryo,MS Pゴシック,sans-serif;font-size:1rem;line-height:normal;box-sizing:border-box;box-shadow:none;appearance:none;display:inline-block;border-radius:0;background-color:transparent;background-image:linear-gradient(0deg,transparent,transparent);position:relative;cursor:pointer;text-align:center;font-weight:400;margin:0;border:none;outline:none;transition:all .05s ease-out;transform:translateY(-6px);box-shadow:0 6px 0 #2283f3;border-radius:4px;background-color:#529ef6;color:#fff;padding:10px;line-height:1}.demo-styles .button-emboss:active,.demo-styles .button-emboss:hover,.demo-styles .button-emboss:link,.demo-styles .button-emboss:visited{text-decoration:none}.demo-styles .button-emboss:focus{outline:none}.demo-styles .button-emboss.is-disabled,.demo-styles .button-emboss:disabled{cursor:default;pointer-events:none;opacity:.2}.demo-styles .button-emboss:focus{background-color:#529ef6;box-shadow:0 6px 0 #2283f3}.demo-styles .button-emboss.is-current,.demo-styles .button-emboss:active,.demo-styles .button-emboss:hover{transform:translateY(0);box-shadow:0 0 0 #529ef6;background-color:#2283f3}.demo-styles .button-group{display:flex;justify-content:space-between}.demo-styles .button-group>*{width:100%;border-radius:0}.demo-styles .button-group>:first-child{border-radius:3px 0 0 3px}.demo-styles .button-group>:last-child{border-radius:0 3px 3px 0}.demo-styles .switch input[type=checkbox]{display:none}.demo-styles .switch label{cursor:pointer;text-indent:-9999px;width:38px;height:20px;background:grey;display:block;border-radius:20px;position:relative}.demo-styles .switch label:after{content:"";position:absolute;top:2px;left:2px;width:16px;height:16px;background:#fff;border-radius:16px;transition:.3s}.demo-styles .switch input:checked+label{background:#529ef6}.demo-styles .switch input:checked+label:after{left:calc(100% - 2px);transform:translateX(-100%)}.demo-styles .switch label:active:after{width:20px}.demo-styles .reset-ul{margin:0;padding:0;list-style:none;display:inline-block}.demo-styles .reset-ul>li{display:inline-block}.demo-styles .word-break{white-space:normal;word-break:break-all;word-wrap:break-word}.demo-styles .word-break,.demo-styles .word-break-none{display:inline-block;width:100px;background:#f8f8f8;padding:10px}.demo-styles .word-break-none{white-space:nowrap;word-break:keep-all;word-wrap:normal}.demo-styles .text-overflow{overflow:hidden;white-space:nowrap;text-overflow:ellipsis;display:inline-block;width:100px;background:#f8f8f8;padding:10px}.demo-styles .icon-hamburger:before{background-color:#000;background-image:url("data:image/svg+xml;charset=utf-8,%3Csvg width='28' height='24' viewBox='6 8 28 24' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath fill='%23FFF' fill-rule='evenodd' d='M6 8h28v4H6zM6 18h28v4H6zM6 28h28v4H6z'/%3E%3C/svg%3E");background-size:45% 45%}.demo-styles .icon-hamburger:before,.demo-styles .icon-twitter:before{content:"";width:40px;height:40px;display:inline-block;background-repeat:no-repeat;background-position:50%}.demo-styles .icon-twitter:before{background-color:#1da1f2;background-image:url("data:image/svg+xml;charset=utf-8,%3Csvg width='26' height='22' viewBox='8 9 26 22' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M16.27 30.611c9.622 0 14.885-7.972 14.885-14.886 0-.226 0-.451-.015-.676a10.645 10.645 0 0 0 2.61-2.708c-.955.423-1.968.7-3.005.823a5.25 5.25 0 0 0 2.3-2.894 10.485 10.485 0 0 1-3.322 1.27 5.237 5.237 0 0 0-8.916 4.772 14.853 14.853 0 0 1-10.782-5.466 5.236 5.236 0 0 0 1.62 6.984 5.193 5.193 0 0 1-2.375-.655v.066a5.234 5.234 0 0 0 4.197 5.129c-.77.21-1.578.24-2.362.09a5.238 5.238 0 0 0 4.888 3.633A10.498 10.498 0 0 1 8.25 28.26a14.811 14.811 0 0 0 8.02 2.346' fill='%23FFF'/%3E%3C/svg%3E");background-size:60% 60%}.demo-styles .icon-facebook:before{background-color:#3c5999;background-image:url("data:image/svg+xml;charset=utf-8,%3Csvg width='18' height='34' viewBox='16 6 18 34' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M27.485 39.984V24.558h5.178l.776-6.012h-5.954v-3.838c0-1.74.484-2.927 2.98-2.927l3.183-.001V6.403c-.55-.073-2.44-.237-4.639-.237-4.59 0-7.732 2.801-7.732 7.947v4.433h-5.191v6.012h5.191v15.426h6.208z' fill='%23FEFEFE' fill-rule='evenodd'/%3E%3C/svg%3E");background-size:60% 60%}.demo-styles .icon-facebook:before,.demo-styles .icon-hatena:before{content:"";width:40px;height:40px;display:inline-block;background-repeat:no-repeat;background-position:50%}.demo-styles .icon-hatena:before{background-color:#2d92ba;background-image:url("data:image/svg+xml;charset=utf-8,%3Csvg width='22' height='20' viewBox='9 10 22 20' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M17.915 25.366c-.484.298-1.318.444-2.489.444h-1.732v-3.973h1.807c1.202 0 2.033.152 2.475.454.45.302.67.836.67 1.602 0 .685-.242 1.178-.73 1.473zm-4.22-10.426h1.064c1.23 0 2.056.139 2.482.415.42.278.635.757.635 1.44 0 .657-.228 1.12-.68 1.392-.457.266-1.291.401-2.512.401h-.99V14.94zm8.558 5.708c-.724-.81-1.732-1.265-3.024-1.363 1.15-.313 1.984-.772 2.513-1.384.525-.604.786-1.425.786-2.457 0-.818-.179-1.54-.525-2.165a3.905 3.905 0 0 0-1.535-1.49c-.587-.323-1.284-.55-2.096-.684-.816-.13-2.245-.196-4.296-.196H9.091v18.182h5.136c2.064 0 3.552-.072 4.462-.21.909-.143 1.671-.384 2.289-.714a4.196 4.196 0 0 0 1.753-1.713c.41-.74.612-1.591.612-2.566 0-1.349-.363-2.432-1.09-3.24zM28.606 24.485a2.302 2.302 0 1 0-.002 4.604 2.302 2.302 0 0 0 .002-4.604M26.606 23.031h4V10.91h-4z' fill='%23FFF' fill-rule='evenodd'/%3E%3C/svg%3E");background-size:50% 50%}.demo-styles .wordwrap-fadeout{position:relative;overflow:hidden}.demo-styles .wordwrap-fadeout:before{content:"";position:absolute;bottom:0;left:0;width:100%;height:10px;background:#fff}.demo-styles .wordwrap-fadeout:after{background-image:linear-gradient(0deg,#fff,hsla(0,0%,100%,0));content:"";position:absolute;bottom:10px;left:0;width:100%;height:50px}
@@ -1,3 +1,3 @@
1
1
  module Spuit
2
- VERSION = "0.0.14.2"
2
+ VERSION = "0.1.0"
3
3
  end
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "spuit",
3
- "version": "0.0.13",
3
+ "version": "0.1.0",
4
4
  "description": "JS + Sass Mixin Library",
5
5
  "main": "spuit.scss",
6
6
  "repository": {
@@ -15,32 +15,33 @@
15
15
  },
16
16
  "homepage": "https://github.com/is8r/spuit#readme",
17
17
  "devDependencies": {
18
- "autoprefixer": "^8.2.0",
19
- "bootstrap": "^4.0.0",
20
- "css-loader": "^0.28.7",
18
+ "autoprefixer": "^9.6.0",
19
+ "bootstrap": "^4.3.1",
20
+ "css-loader": "^3.0.0",
21
21
  "extract-text-webpack-plugin": "^4.0.0-beta.0",
22
22
  "html-loader": "^0.5.5",
23
23
  "html-webpack-plugin": "^3.2.0",
24
- "jquery": "^3.3.1",
25
- "node-sass": "^4.7.2",
26
- "popper.js": "^1.14.3",
27
- "postcss-loader": "^2.0.10",
28
- "sass-loader": "^6.0.6",
24
+ "jquery": "^3.4.1",
25
+ "node-sass": "^4.12.0",
26
+ "optimize-css-assets-webpack-plugin": "^5.0.1",
27
+ "popper.js": "^1.15.0",
28
+ "postcss-loader": "^3.0.0",
29
+ "sass-loader": "^7.1.0",
29
30
  "spuit": "0.0.13",
30
- "style-loader": "^0.20.3",
31
- "uglifyjs-webpack-plugin": "^1.2.4",
32
- "webpack": "^4.4.1",
33
- "webpack-cli": "^2.0.13",
34
- "webpack-dev-server": "^3.1.1",
35
- "webpack-manifest-plugin": "^2.0.0-rc.2"
31
+ "style-loader": "^0.23.1",
32
+ "terser-webpack-plugin": "^1.3.0",
33
+ "uglifyjs-webpack-plugin": "^2.1.3",
34
+ "webpack": "^4.34.0",
35
+ "webpack-cli": "^3.3.4",
36
+ "webpack-dev-server": "^3.7.1",
37
+ "webpack-manifest-plugin": "^2.0.4"
36
38
  },
37
39
  "dependencies": {
38
- "npm": "^6.0.1"
40
+ "npm": "^6.9.0"
39
41
  },
40
42
  "scripts": {
41
43
  "dev": "open http://localhost:8080/ && webpack-dev-server --progress --mode development --config webpack/webpack.config.js",
42
44
  "watch": "webpack --watch --progress --mode development --config webpack/webpack.config.js",
43
- "build": "webpack --progress --mode production --config webpack/webpack.config.js",
44
- "deploy": "npm publish"
45
+ "build": "webpack --progress --mode production --config webpack/webpack.config.js"
45
46
  }
46
47
  }
File without changes
File without changes
File without changes
File without changes
File without changes
@@ -0,0 +1,140 @@
1
+ @mixin button-base($c: transparent) {
2
+ box-sizing: border-box;
3
+ box-shadow: none;
4
+ appearance: none;
5
+ display: inline-block;
6
+ border-radius: 0;
7
+ background-color: $c;
8
+ background-image: linear-gradient(to top, $c, $c);
9
+ position: relative;
10
+ cursor: pointer;
11
+ text-align: center;
12
+ font-weight: normal;
13
+ margin: 0;
14
+ padding: 0;
15
+ border: none;
16
+ outline: none;
17
+ &:link,
18
+ &:visited,
19
+ &:hover,
20
+ &:active,
21
+ &:active {
22
+ text-decoration: none;
23
+ }
24
+ &:focus {
25
+ outline: none;
26
+ }
27
+ &:disabled,
28
+ &.is-disabled {
29
+ @include button-disabled;
30
+ opacity: 0.2;
31
+ }
32
+ }
33
+
34
+ @mixin button-disabled {
35
+ cursor: default;
36
+ pointer-events: none;
37
+ }
38
+
39
+ @mixin button-loading {
40
+ @include button-disabled;
41
+ @include icon-loading;
42
+ opacity: 0.6;
43
+ }
44
+
45
+ // @include button-normal(10px 10px, #529ef6, #fff, 2px);
46
+ @mixin button-normal($p: 10px 10px, $c: #529ef6, $c-text: #fff, $r: 2px) {
47
+ @include button-base;
48
+ border-radius: $r;
49
+ border: 1px solid $c;
50
+ background-color: $c;
51
+ color: $c-text;
52
+ padding: $p;
53
+ line-height: 1;
54
+
55
+ &:focus {
56
+ background-color: $c;
57
+ }
58
+
59
+ &:hover,
60
+ &:active,
61
+ &.is-current {
62
+ background-color: darken($c, 10%);
63
+ color: $c-text;
64
+ border-color: $c;
65
+ }
66
+ }
67
+
68
+ // @include button-semiflat(10px 10px, #529ef6, 10%, #fff, 2px);
69
+ @mixin button-semiflat($p: 10px 10px, $c: #529ef6, $strangth: 5%, $c-text: #fff, $r: 4px) {
70
+ @include button-base;
71
+ border-radius: $r;
72
+ background-color: $c;
73
+ background-image: linear-gradient(to top, $c, lighten($c, $strangth));
74
+ border: 1px solid lighten($c, $strangth);
75
+ color: $c-text;
76
+ padding: $p;
77
+ line-height: 1;
78
+
79
+ &:focus {
80
+ background-color: $c;
81
+ background-image: linear-gradient(to top, $c, lighten($c, $strangth));
82
+ }
83
+
84
+ &:hover,
85
+ &:active,
86
+ &.is-current {
87
+ background-color: darken($c, $strangth);
88
+ background-image: linear-gradient(to top, darken($c, $strangth), $c);
89
+ }
90
+ }
91
+
92
+ // @include button-border(10px 10px, #529ef6, #fff);
93
+ @mixin button-border($p: 10px 10px, $c: #529ef6, $c-text: #fff, $border: 1px, $r: 2px) {
94
+ @include button-base;
95
+ border-radius: $r;
96
+ background-color: transparent;
97
+ padding: $p;
98
+ border: $border solid $c;
99
+ color: $c;
100
+ line-height: 1;
101
+
102
+ &:focus {
103
+ background-color: transparent;
104
+ border: $border solid $c;
105
+ }
106
+
107
+ &:hover,
108
+ &:active,
109
+ &.is-current {
110
+ background-color: $c;
111
+ color: $c-text;
112
+ border-color: transparet;
113
+ }
114
+ }
115
+
116
+ // +button-emboss(10px 10px, #529ef6, #fff, 6px, 4px);
117
+ @mixin button-emboss($p: 10px 10px, $c: #529ef6, $c-text: #fff, $thickness: 6px, $r: 4px) {
118
+ @include button-base;
119
+ transition: all 0.05s ease-out;
120
+ transform: translateY(-$thickness);
121
+ box-shadow: 0 $thickness 0 darken($c, 10%);
122
+ border-radius: $r;
123
+ background-color: $c;
124
+ color: $c-text;
125
+ padding: $p;
126
+ line-height: 1;
127
+
128
+ &:focus {
129
+ background-color: $c;
130
+ box-shadow: 0 $thickness 0 darken($c, 10%);
131
+ }
132
+
133
+ &:hover,
134
+ &:active,
135
+ &.is-current {
136
+ transform: translateY(0);
137
+ box-shadow: 0 0 0 $c;
138
+ background-color: darken($c, 10%);
139
+ }
140
+ }
@@ -0,0 +1,23 @@
1
+ @mixin message-element($name: info, $color: #3498db) {
2
+ box-sizing: border-box;
3
+ padding: 12px;
4
+ border-radius: 3px;
5
+ display: block;
6
+
7
+ &.is-#{$name} {
8
+ color: $color;
9
+ background: rgba($color, 0.1);
10
+ border: 1px solid rgba($color, 0.15);
11
+ }
12
+ }
13
+
14
+ @mixin util-messages($color-info: #3498db, $color-success: #1abc9c, $color-warning: #f1c40f, $color-danger: #e74c3c) {
15
+ @at-root {
16
+ .message {
17
+ @include message-element(info, $color-info);
18
+ @include message-element(success, $color-success);
19
+ @include message-element(warning, $color-warning);
20
+ @include message-element(danger, $color-danger);
21
+ }
22
+ }
23
+ }
@@ -6,8 +6,9 @@
6
6
  // = link_to 'shoulder', '#'
7
7
  // Heading and shoulder links.
8
8
 
9
- =shoulder
10
- +reset-ul
11
- display: inline-block
12
- float: right
13
- padding-left: 10px
9
+ @mixin shoulder {
10
+ @include reset-ul;
11
+ display: inline-block;
12
+ float: right;
13
+ padding-left: 10px;
14
+ }
@@ -0,0 +1,45 @@
1
+ // Example:
2
+
3
+ // Simple Grid System - ie9-
4
+ @function split-width($column: 5, $gutter: 2) {
5
+ $parcent: (1 / $column) * 100;
6
+ $margin: ($gutter * ($column - 1)) / $column;
7
+ @return ($parcent - $margin);
8
+ }
9
+
10
+ @mixin split($column: 5, $gutter: 2, $debug: false) {
11
+ @at-root {
12
+ #{&} {
13
+ @include clearfix;
14
+ @include reset-ul;
15
+ position: relative;
16
+
17
+ > * {
18
+ @if $debug {
19
+ @include debug-block;
20
+ }
21
+
22
+ display: inline-block;
23
+ float: left;
24
+ box-sizing: border-box;
25
+ width: split-width($column, $gutter) * 1%;
26
+ margin-left: $gutter * 1%;
27
+ margin-bottom: 10px;
28
+
29
+ @for $i from 0 through 150 {
30
+ @if $i%$column == 1 {
31
+ &:nth-child(#{$i}) {
32
+ clear: both;
33
+ margin-left: 0;
34
+ }
35
+ } @else {
36
+ &:nth-child(#{$i}) {
37
+ clear: none;
38
+ margin-left: $gutter * 1%;
39
+ }
40
+ }
41
+ }
42
+ }
43
+ }
44
+ }
45
+ }
@@ -0,0 +1,50 @@
1
+ // Example:
2
+ // +triangle(#222, 12px, $w/2, 0, 'left')
3
+
4
+ @mixin triangle($c: #2dd, $w: 20px, $l: 0, $t: 0, $direction: "right", $element: "after") {
5
+ position: relative;
6
+ &:#{$element} {
7
+ content: "";
8
+ position: absolute;
9
+ width: 0;
10
+ height: 0;
11
+ border: $w solid transparent;
12
+ border-top-color: $c;
13
+ }
14
+ @if ($direction == "left") {
15
+ &:#{$element} {
16
+ transform: translateX(-$w * 2) translateY(-$w) rotate(90deg);
17
+ left: $l;
18
+ right: auto;
19
+ top: $t;
20
+ }
21
+ }
22
+ @if ($direction == "right") {
23
+ &:#{$element} {
24
+ transform: translateX($w * 2) translateY(-$w) rotate(-90deg);
25
+ left: auto;
26
+ right: $l;
27
+ top: $t;
28
+ }
29
+ }
30
+ @if ($direction == "top") {
31
+ &:#{$element} {
32
+ transform: translateX(-$w) translateY(-$w * 2) rotate(180deg);
33
+ right: auto;
34
+ left: $l;
35
+ top: $t;
36
+ }
37
+ }
38
+ @if ($direction == "bottom") {
39
+ &:#{$element} {
40
+ transform: translateX(-$w) translateY($w * 2) rotate(0);
41
+ right: auto;
42
+ left: $l;
43
+ bottom: $t;
44
+ }
45
+ }
46
+ }
47
+
48
+ @mixin tri($c: #2dd, $w: 20px, $l: 0, $t: 0, $direction: "right", $element: "after") {
49
+ @include triangle($c, $w, $l, $t, $direction, $element);
50
+ }
@@ -0,0 +1,22 @@
1
+ @mixin wordwrap-fadeout($h: 50px, $m: 10px, $c: #fff) {
2
+ position: relative;
3
+ overflow: hidden;
4
+ &:before {
5
+ content: '';
6
+ position: absolute;
7
+ bottom: 0;
8
+ left: 0;
9
+ width: 100%;
10
+ height: $m;
11
+ background: $c;
12
+ }
13
+ &:after {
14
+ background-image: linear-gradient(to top, rgba($c,1), rgba($c,0));
15
+ content: '';
16
+ position: absolute;
17
+ bottom: $m;
18
+ left: 0;
19
+ width: 100%;
20
+ height: $h;
21
+ }
22
+ }
@@ -0,0 +1,27 @@
1
+ @mixin wrap($n: 960px, $margin: 10px) {
2
+ width: 100%;
3
+ margin: 0;
4
+ padding: 0;
5
+ text-align: center;
6
+ min-width: $n;
7
+ @include breakpoint-down(md) {
8
+ width: auto;
9
+ min-width: 0;
10
+ }
11
+
12
+ @at-root {
13
+ #{&}__inner {
14
+ box-sizing: border-box;
15
+ position: relative;
16
+ display: block;
17
+ width: $n;
18
+ margin: 0 auto;
19
+ text-align: left;
20
+ @include breakpoint-down(md) {
21
+ width: 100%;
22
+ padding-left: $margin;
23
+ padding-right: $margin;
24
+ }
25
+ }
26
+ }
27
+ }
@@ -0,0 +1,40 @@
1
+ @mixin dl-base {
2
+ margin: 0;
3
+ padding: 0;
4
+ > * {
5
+ @include break-word;
6
+ margin: 0;
7
+ padding: 0;
8
+ display: border-box;
9
+ }
10
+ }
11
+
12
+ @mixin dl-flex($left: 30%, $p: 0.5rem 1rem) {
13
+ @include dl-base;
14
+ display: flex;
15
+ flex-flow: row wrap;
16
+ justify-content: space-between;
17
+ align-items: flex-start;
18
+ align-content: flex-start;
19
+
20
+ > dt {
21
+ width: $left;
22
+ padding: $p;
23
+ padding-left: 0;
24
+ }
25
+
26
+ > dd {
27
+ width: 100% - $left;
28
+ padding: $p;
29
+ padding-right: 0;
30
+ }
31
+ }
32
+
33
+ @mixin dl-border($border: 1px solid #ddd, $left: 30%, $p: 0.5rem 1rem) {
34
+ @include dl-flex($left, $p);
35
+ border-bottom: $border;
36
+
37
+ > * {
38
+ border-top: $border;
39
+ }
40
+ }